Badge
The badge component.
- Import
import "@tapsioss/web-components/badge";
- Tag
<tapsi-badge></tapsi-badge>
Properties
Name | Description | Type | Default Value |
---|---|---|---|
value | The value of the badge. | string | number | "" |
variant | The variant of the badge. | "pill" | "numeral" | "dot" | "pill" |
color | The color of the badge. | "success" | "error" | "info" | "warning" | "neutral" | "neutral" |
priority | The priority level of the badge. | "high" | "low" | "high" |
size | The size of the badge. | "md" | "sm" | "md" |
Slots
Name | Description |
---|---|
icon | The slot for icon element. |
TIP
You can use slot names as variables:
ts
import { Slots } from "@tapsioss/web-components/badge";
console.log(Slots.ICON); // "icon"