shadow
The Chip component is a universal element that is a small visual block containing various other elements such as avatars, text and icons. It offers options to customize colors, states and more.
It is also possible to display other elements in the chip element, for example avatar, label and icon elements.
| Description | If true, the chip is active and displays a check icon. |
| Attribute | active |
| Type | boolean |
| Default | false |
| Description | Chip colour. Default options include primary, complete, success, warning, danger, info and default. |
| Attribute | color |
| Type | "primary." ｜ "complete" ｜ "success" ｜ "warning" ｜ "danger" ｜ "info" ｜ "default" ｜ string |
| Default | undefined |
| Description | If true, the chip is deactivated and cannot be interacted with. |
| Attribute | disabled |
| Type | boolean |
| Default | false |
| Description | If true, the chip can be removed by clicking the remove button. |
| Attribute | removable |
| Type | boolean |
| Default | false |
| Name | Description |
|---|
wje:chip-remove | Issued when the chip is removed. |
No public methods available for this component.
| Name | Description |
|---|
native | Refers to the native wrapper element of the chip. |
remove | Button to remove the chip. |
| Name | Description |
|---|
--wje-chip-border-radius | Rounding the edges of the chip. |
--wje-chip-background-color | Chip background colour. |
--wje-chip-color | Chip text colour. |
--wje-chip-padding | Internal chip offset. |
| Name | Description |
|---|
| `` | The main content of the chip. |
end | Slot for additional content at the end of the chip. |