Chip
1. What does the component do?
- It shows values and categories as compact elements.
2. When should the component be used?
- When it should be possible to assign several values to an attribute in a form.
- For filtering by categories.
3. Rules
- The term in the chip is always single-line (no line breaks) and the chip itself increases in width with the text.
- If a chip is too long for the viewport because of the text, the text is shortened with “…”.
- The input chips are shown in a text field. This can also be multi-line depending on the number of chips and available space.
- The chips in the textfield can be deleted by using backspace.
- The chips can be generated via ‘autocomplete’ selection or with free text depending on the use case.
4. Variants and statuses
The component has the following statuses:
- Active
- Disabled
- Hover
- Focused
4.1 Input
