From 069a16709d615e668b1c56c18ce816efd857b563 Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Mon, 31 Jul 2023 11:29:11 -0400 Subject: [PATCH 1/6] Add aria-selected value to ActionList.Item. --- src/ActionList/Item.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/ActionList/Item.tsx b/src/ActionList/Item.tsx index e22a2d736b5..4925c6c2509 100644 --- a/src/ActionList/Item.tsx +++ b/src/ActionList/Item.tsx @@ -209,6 +209,7 @@ export const Item = React.forwardRef( data-variant={variant === 'danger' ? variant : undefined} {...containerProps} {...props} + aria-selected={selected} > From 8839dc2a44cbc1e710d698c0bbaf164d201d827e Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Mon, 31 Jul 2023 11:33:08 -0400 Subject: [PATCH 2/6] Create late-bugs-battle.md --- .changeset/late-bugs-battle.md | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 .changeset/late-bugs-battle.md diff --git a/.changeset/late-bugs-battle.md b/.changeset/late-bugs-battle.md new file mode 100644 index 00000000000..221ffe97559 --- /dev/null +++ b/.changeset/late-bugs-battle.md @@ -0,0 +1,7 @@ +--- +"@primer/react": patch +--- + +Add aria-selected value to ActionList.Item. + + From f256fa1feffcf732b0f553b3dcc9c5179aa00a8e Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Mon, 31 Jul 2023 13:00:34 -0400 Subject: [PATCH 3/6] Conditionally set aria-selected if role is option. --- src/ActionList/Item.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ActionList/Item.tsx b/src/ActionList/Item.tsx index 4925c6c2509..dd69ad81189 100644 --- a/src/ActionList/Item.tsx +++ b/src/ActionList/Item.tsx @@ -207,9 +207,9 @@ export const Item = React.forwardRef( ref={forwardedRef} sx={merge(styles, sxProp)} data-variant={variant === 'danger' ? variant : undefined} + {...containerProps.role === 'option' && ({'aria-selected': selected})} {...containerProps} {...props} - aria-selected={selected} > From 78085d3725589c46c35e0c33840d999e8a22f23e Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Mon, 31 Jul 2023 13:06:25 -0400 Subject: [PATCH 4/6] Linting and formatting. --- src/ActionList/Item.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ActionList/Item.tsx b/src/ActionList/Item.tsx index dd69ad81189..ce0ad3bfe57 100644 --- a/src/ActionList/Item.tsx +++ b/src/ActionList/Item.tsx @@ -207,7 +207,7 @@ export const Item = React.forwardRef( ref={forwardedRef} sx={merge(styles, sxProp)} data-variant={variant === 'danger' ? variant : undefined} - {...containerProps.role === 'option' && ({'aria-selected': selected})} + {...(containerProps.role === 'option' && {'aria-selected': selected})} {...containerProps} {...props} > From 676b9eb746ec6c4ab8e5497da8639683546cc399 Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Wed, 16 Aug 2023 10:43:55 -0400 Subject: [PATCH 5/6] Update src/ActionList/Item.tsx Co-authored-by: Josh Black --- src/ActionList/Item.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ActionList/Item.tsx b/src/ActionList/Item.tsx index ce0ad3bfe57..90ee1682abf 100644 --- a/src/ActionList/Item.tsx +++ b/src/ActionList/Item.tsx @@ -207,7 +207,7 @@ export const Item = React.forwardRef( ref={forwardedRef} sx={merge(styles, sxProp)} data-variant={variant === 'danger' ? variant : undefined} - {...(containerProps.role === 'option' && {'aria-selected': selected})} + aria-selected={containerProps.role === 'option' ? selected : undefined} {...containerProps} {...props} > From 25ef26b63ec9e59a7f42ddd47164d43addc932a7 Mon Sep 17 00:00:00 2001 From: Jeremy Neal Date: Wed, 16 Aug 2023 12:12:53 -0400 Subject: [PATCH 6/6] Update test so aria-selected gets generated correctly. --- src/__tests__/ActionList.test.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/__tests__/ActionList.test.tsx b/src/__tests__/ActionList.test.tsx index 9e990e235ef..ca070d04305 100644 --- a/src/__tests__/ActionList.test.tsx +++ b/src/__tests__/ActionList.test.tsx @@ -42,7 +42,6 @@ function SingleSelectListStory(): JSX.Element { key={index} role="option" selected={index === selectedIndex} - aria-selected={index === selectedIndex} onSelect={() => setSelectedIndex(index)} disabled={project.disabled} >