Tag
<sc-tag></sc-tag>
This component let users create tag.
- Preview
- Code
<sc-tag pill="true" type="info">Sample Tag</sc-tag><sc-tag type="danger">Sample Tag</sc-tag><sc-tag type="warning" size="small" clearable>Sample Tag</sc-tag>
Component Codex
Properties
| Property | Description | Type | Default |
|---|---|---|---|
| ariaLabel | Aria label | string | |
| clearable | Makes the tag clearable. | boolean | false |
| pill | Draws a pill-style tag with rounded edges. | boolean | false |
| size | The tag's size. | "large" | "medium" | "small" | 'medium' |
| type | The tag's type. | "danger" | "default" | "info" | "primary" | "success" | "warning" | 'default' |
Events
| Event | Description | Type |
|---|---|---|
scClear | CustomEvent<ScTag> |
Shadow Parts
| Part | Description |
|---|---|
base | |
content |
Used By
- sc-badge-notice
- sc-cart-header
- sc-charges-list
- sc-coupon-form
- sc-customer-details
- sc-customer-edit
- sc-downloads-list
- sc-fulfillment-shipping-status-badge
- sc-invoice-status-badge
- sc-license
- sc-licenses-list
- sc-order
- sc-order-confirmation-details
- sc-order-confirmation-totals
- sc-order-fulfillment-badge
- sc-order-return-badge
- sc-order-shipment-badge
- sc-order-status-badge
- sc-orders-list
- sc-payment
- sc-payment-method
- sc-payment-methods-list
- sc-premium-tag
- sc-price
- sc-product-item-list
- sc-subscription-details
- sc-subscription-payment-method
- sc-subscription-status-badge
- sc-subscription-switch