Give MultiSelect chips accessible names and start creation fields empty.

Catalog chips now announce Select or Deselect so they are named for assistive tech. Method and value modals open blank; Generate draft inserts the catalog copy that used to be prefilled, and Customize still keeps the section headings.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilalloandCursor committed 2026-09-29 15:59:00 -06:00
1 parent fd9f82ea19
commit 20ea4a2f30
35 files changed
+498 -156

No files matched your search

@@ -46,6 +46,8 @@ const MultiSelectContainer = memo<MultiSelectProps>(
addButtonAriaLabel={
addButtonText || t("multiSelectAddFallback")
}
chipSelectAriaLabel={t("chipSelect")}
chipDeselectAriaLabel={t("chipDeselect")}
formHeader={formHeader}
onCustomChipConfirm={onCustomChipConfirm}
onCustomChipClose={onCustomChipClose}
@@ -85,6 +85,8 @@ export interface MultiSelectViewProps {
addButton: boolean;
addButtonText?: string;
addButtonAriaLabel: string;
chipSelectAriaLabel: string;
chipDeselectAriaLabel: string;
formHeader: boolean;
onCustomChipConfirm?: (chipId: string, value: string) => void;
onCustomChipClose?: (chipId: string) => void;
@@ -16,6 +16,8 @@ function MultiSelectView({
addButton,
addButtonText,
addButtonAriaLabel,
chipSelectAriaLabel,
chipDeselectAriaLabel,
formHeader = true,
onCustomChipConfirm,
onCustomChipClose,
@@ -88,6 +90,14 @@ function MultiSelectView({
palette={palette}
size={chipSize}
disabled={chipDisabled}
ariaLabel={
isCustom || !option.label
? undefined
: (isSelected
? chipDeselectAriaLabel
: chipSelectAriaLabel
).replace("{label}", option.label)
}
onClick={() => {
if (!isCustom && !chipDisabled && onChipClick) {
onChipClick(option.id);