Chips

Chip sets group related chips into one input, filter, or selection list.

Props

React props
NameTypeRequiredDefaultDescription
classNamestring | Partial<Record<"chips", string>> | ClassNameComponent<ChipsInterface>No—Root classes (string), static element classes (object), or state-aware element classes (function).
labelstringNo'Chips'Accessible name for the chip collection.
variant"input"No'input'Enables inline input and removal behavior.
scrollablebooleanNotrueUses horizontal overflow instead of wrapping.
draggablebooleanNofalseEnables native dragging on every chip.
itemsChipItem[]No—Controlled source of truth for the collection.
onItemsChange(next: ChipItem[]) => voidNo—Notifies list changes caused by selection, editing, or removal.