alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: set default role to group, add aria-roledescription

Browse Source
This commit is contained in:
Abbey Yacoe
2025-06-02 13:19:27 +02:00
parent cdc08f1b54
commit 28b0430606
3 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react/src/components/NodeWrapper/index.tsx
+2 -1
View File
@@ -191,7 +191,8 @@ export function NodeWrapper<NodeType extends Node>({
onDoubleClick={onDoubleClickHandler} onDoubleClick={onDoubleClickHandler}
onKeyDown={isFocusable ? onKeyDown : undefined} onKeyDown={isFocusable ? onKeyDown : undefined}
tabIndex={isFocusable ? 0 : undefined} tabIndex={isFocusable ? 0 : undefined}
role={node.ariaRole === null ? undefined : node.ariaRole || (isFocusable ? 'button' : undefined)} role={node.ariaRole === null ? undefined : node.ariaRole || (isFocusable ? 'group' : undefined)}
aria-roledescription={node.ariaRoleDescription || 'node'}
aria-describedby={disableKeyboardA11y ? undefined : `${ARIA_NODE_DESC_KEY}-${rfId}`} aria-describedby={disableKeyboardA11y ? undefined : `${ARIA_NODE_DESC_KEY}-${rfId}`}
aria-label={node.ariaLabel} aria-label={node.ariaLabel}
> >
packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte
+2 -1
View File
@@ -252,7 +252,8 @@
: undefined} : undefined}
onkeydown={focusable ? onKeyDown : undefined} onkeydown={focusable ? onKeyDown : undefined}
tabIndex={focusable ? 0 : undefined} tabIndex={focusable ? 0 : undefined}
role={node.ariaRole === null ? undefined : node.ariaRole || (focusable ? 'button' : undefined)} role={node.ariaRole === null ? undefined : node.ariaRole || (focusable ? 'group' : undefined)}
aria-roledescription={node.ariaRoleDescription || 'node'}
aria-describedby={store.disableKeyboardA11y aria-describedby={store.disableKeyboardA11y
? undefined ? undefined
: `${ARIA_NODE_DESC_KEY}-${store.flowId}`} : `${ARIA_NODE_DESC_KEY}-${store.flowId}`}
packages/system/src/types/nodes.ts
+6 -3
View File
@@ -75,12 +75,15 @@ export type NodeBase<
handles?: NodeHandle[]; handles?: NodeHandle[];
/** /**
* The ARIA role attribute for the node element, used for accessibility. * The ARIA role attribute for the node element, used for accessibility.
* Common values for nodes might be 'button', 'group', 'listitem', etc. * @default "group"
* When not specified, focusable nodes default to 'button' role.
* @default "button" (for focusable nodes)
*/ */
ariaRole?: AriaRole; ariaRole?: AriaRole;
/**
* A description of the node's role, used for accessibility.
* @default "node"
*/
ariaRoleDescription?: string;
measured?: { measured?: {
width?: number; width?: number;
height?: number; height?: number;