Chip
A compact component that displays content in a pill-shaped element. Features customizable appearance with support for icons, avatars, images, and interactive behaviors such as clicking and removing. Ideal for tags, filters, or compact information display.
Extends: fieldComponent
Fields
Name | Code | Data Type | Description |
|---|---|---|---|
Outline |
| boolean | When enabled, displays the chip with an outlined style |
Dense |
| boolean | Renders the chip in a more compact form |
Color |
| text | Sets the background color of the chip |
Size |
| text | Controls the size of the chip |
Shape Type |
| text | Sets the shape of the chip (square or round) |
Image Link |
| text | URL for an image to display in the chip |
Icon Right |
| text | Icon to display on the right side of the chip |
Text Color |
| text | Color of the text content in the chip |
Avatar Value |
| text | Text or value to display in the avatar section |
Avatar Color |
| text | Background color of the avatar section |
Clickable |
| boolean | Makes the chip interactive with click events |
Removable |
| boolean | Adds a remove button to the chip |
Icon |
| text | Icon to display on the left side of the chip |
Label |
| multi-locale | Display label for the chip |
ID |
| text | Unique identifier for the component |
Style Classes |
| text | CSS classes for styling |
Width |
| text | Controls component width |
Value |
| text | Content to display in the chip |
Visible |
| boolean | Controls component visibility |
Enabled |
| boolean | Controls whether component is enabled |
Methods
Name | Description |
|---|---|
| Handles chip removal and triggers remove event |
| Determines if chip should use specified shape type |
Events
Name | Description |
|---|---|
| Triggered when the chip's remove button is clicked |