Chip()

Chip(__namedParameters): Element

Chip - A compact element for displaying tags, filters, or selectable items

Provides flexible chip functionality supporting both individual chips and chip lists. Includes variants for deletable and selectable chips with keyboard navigation and accessibility features. Perfect for tags, filters, or multi-selection interfaces.

Parameters

__namedParameters

ChipProps

Returns

Element

Examples

// Basic chip
<Chip>JavaScript</Chip>

// Chip list with multiple items
<ChipList>
  <Chip>React</Chip>
  <Chip>TypeScript</Chip>
  <Chip>Node.js</Chip>
</ChipList>

// Deletable chips
<ChipList onRemove={() => console.log('removed')}>
  <DeletableChip>
    Removable Tag
  </DeletableChip>
</ChipList>

// Selectable chips
<ChipList selectionMode="multiple">
  <SelectableChip id="option1">Option 1</SelectableChip>
  <SelectableChip id="option2">Option 2</SelectableChip>
</ChipList>