Skip to main content
CategoryChipRow
ImplementedSingle-select event-category chip row (SEARCH-03, Pattern A: one category per event). Owns layout, the aria group and the All semantics; the consumer owns data, i18n and navigation. Selecting the active category or All reports null.
Categorymolecules
Source
components/molecules/CategoryChipRow/CategoryChipRow.tsxProps
Preview
CategoryChipRow
Prop
Type
Required
Default
Description
categoriesCategoryChipOption[]Required
—Ordered categories ({ slug, label }).
selectedstring | nullRequired
—Active slug, or null for All.
onSelect(slug: string | null) => voidRequired
—Next slug; null clears the filter.
allLabelstringRequired
—Label of the clearing All chip.
ariaLabelstringOptional
"Filter by category"Accessible name of the chip group.
size"sm" | "md"Optional
"sm"Chip size token.
classNamestringOptional
—Utility class passthrough on the row.
Quick use:
<CategoryChipRow />Accessibility
ARIA rolegroup