chore(a11y): pass a11y descriptions in svelte

This commit is contained in:
Abbey Yacoe
2025-05-19 15:16:19 +02:00
parent 9e4a9ae65d
commit 36f1d94ca7
4 changed files with 33 additions and 10 deletions
@@ -70,6 +70,7 @@
nodes = $bindable([]),
edges = $bindable([]),
viewport = $bindable(undefined),
a11yMessages,
...props
}: SvelteFlowProps<NodeType, EdgeType> &
Omit<HTMLAttributes<HTMLDivElement>, 'onselectionchange'> = $props();
@@ -217,6 +218,6 @@
</Pane>
</Zoom>
<Attribution {proOptions} position={attributionPosition} />
<A11yDescriptions {store} />
<A11yDescriptions {store} a11yMessages={a11yMessages} />
{@render children?.()}
</Wrapper>
@@ -20,7 +20,8 @@ import type {
OnConnectEnd,
OnReconnect,
OnReconnectStart,
OnReconnectEnd
OnReconnectEnd,
a11yMessages
} from '@xyflow/system';
import type {
@@ -471,4 +472,9 @@ export type SvelteFlowProps<
onselectionstart?: (event: PointerEvent) => void;
/** This event handler gets called when the user finishes dragging a selection box */
onselectionend?: (event: PointerEvent) => void;
/**
* Custom accessibility messages for screen readers and a11y features.
* Allows localization and customization of ARIA descriptions.
*/
a11yMessages?: a11yMessages;
};