From 015ed949c0b7a643a2301a88b1a11f399e4da314 Mon Sep 17 00:00:00 2001 From: Bernardo Sunderhus Date: Wed, 18 Dec 2024 09:17:42 -0300 Subject: [PATCH 1/2] chore: modify roles for toolbar + buttons instead of listbox + options --- ...ct-tag-picker-64fc2595-4402-4433-89ba-6fa4382c8d08.json | 7 +++++++ .../src/components/TagPickerGroup/useTagPickerGroup.ts | 1 - 2 files changed, 7 insertions(+), 1 deletion(-) create mode 100644 change/@fluentui-react-tag-picker-64fc2595-4402-4433-89ba-6fa4382c8d08.json diff --git a/change/@fluentui-react-tag-picker-64fc2595-4402-4433-89ba-6fa4382c8d08.json b/change/@fluentui-react-tag-picker-64fc2595-4402-4433-89ba-6fa4382c8d08.json new file mode 100644 index 00000000000000..6458d4dd9b7946 --- /dev/null +++ b/change/@fluentui-react-tag-picker-64fc2595-4402-4433-89ba-6fa4382c8d08.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "chore: modify roles for toolbar + buttons instead of listbox + options", + "packageName": "@fluentui/react-tag-picker", + "email": "bernardo.sunderhus@gmail.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-components/react-tag-picker/library/src/components/TagPickerGroup/useTagPickerGroup.ts b/packages/react-components/react-tag-picker/library/src/components/TagPickerGroup/useTagPickerGroup.ts index c2cd563fc5b413..5223099c977c57 100644 --- a/packages/react-components/react-tag-picker/library/src/components/TagPickerGroup/useTagPickerGroup.ts +++ b/packages/react-components/react-tag-picker/library/src/components/TagPickerGroup/useTagPickerGroup.ts @@ -37,7 +37,6 @@ export const useTagPickerGroup_unstable = ( const state = useTagGroup_unstable( { - role: 'listbox', disabled, ...props, ...arrowNavigationProps, From 1b9333c684ebdcabb13d053c17ab7673642e82a7 Mon Sep 17 00:00:00 2001 From: Bernardo Sunderhus Date: Tue, 14 Jan 2025 10:29:23 +0100 Subject: [PATCH 2/2] chore: adds aria-roledescription to every TagPickerGroup usage --- .../stories/src/TagPicker/TagPickerAppearance.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerBestPractices.md | 2 ++ .../stories/src/TagPicker/TagPickerButton.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerDefault.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerDisabled.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerExpandIcon.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerFiltering.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerGrouped.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerNoPopover.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerSecondaryAction.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerSingleSelect.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerSize.stories.tsx | 2 +- .../stories/src/TagPicker/TagPickerTruncatedText.stories.tsx | 2 +- 13 files changed, 14 insertions(+), 12 deletions(-) diff --git a/packages/react-components/react-tag-picker/stories/src/TagPicker/TagPickerAppearance.stories.tsx b/packages/react-components/react-tag-picker/stories/src/TagPicker/TagPickerAppearance.stories.tsx index 3514ea4b85e477..45dcb28019e392 100644 --- a/packages/react-components/react-tag-picker/stories/src/TagPicker/TagPickerAppearance.stories.tsx +++ b/packages/react-components/react-tag-picker/stories/src/TagPicker/TagPickerAppearance.stories.tsx @@ -42,7 +42,7 @@ const Example = ({ appearance }: Pick) => { - + {selectedOptions.map(option => ( { - + {selectedOptions.map(option => ( { - + {selectedOptions.map(option => ( { - + {selectedOptions.map(option => ( { }> - + {selectedOptions.map(option => ( { - + {selectedOptions.map(option => ( { - + {selectedOptions.map(option => ( { - + {selectedOptions.map((option, index) => ( { } > - + {selectedOptions.map(option => ( { {selectedOption && ( - + ) => { - + {selectedOptions.map(option => ( { option.value)}> - + {selectedOptions.map(option => (