Compact controls that allow for toggling and filtering
Chips allow users to make selections, filter content, or trigger small actions. Chips should appear as a group of multiple elements in most cases. Unlike buttons, chips shouldn’t navigate away from the current page. If the action requires a new page to load, please use a button instead of a chip.
There are two types of chip components: ToggleChip and FilterChip.
A toggle chip behaves the same way as a checkbox and should be used for a set of options where more than one option can be selected. It is currently not available as a React component.
A FilterChip is used to filter options and behaves like a button.
isSelected prop determines if a FilterChip is selected.
Below is an example of multiple FilterChips.
The text to display inside the FilterChip.
A function to be called whenever the selected state of the chip changes.
() => void
Determines if the FilterChip is selected, which changes the color. The default is for the FilterChip to start in the unselected state.