Props
| Prop | Type | Default | Notes |
|---|---|---|---|
label | string | '' | |
checked | boolean | false | |
disabled | boolean | false | |
size | xs | sm | md | lg | xl | md |
StellarUI
<stellar-toggle-tag>
Tag-like checkbox surface for short preferences, filters, and amenity toggles.
Properties
Preview
Preference toggle
Tag-like checkbox surface
Toggle tags work best in groups. The component only owns one pill surface and its checked state; grouping layout still belongs to the surrounding app or form.
Markup
<stellar-toggle-tag>Docs alerts</stellar-toggle-tag>API
Complete props, events, slots, and implementation notes for the shipped toggle-tag.
Events
| Event | Source | Notes |
|---|---|---|
click | native | Bubbles from the internal button when the tag is activated. |
input / change | stellar-toggle-tag | Emitted after a user toggle changes checked. |
Slots
| Slot | Notes |
|---|---|
| default | The tag label content. This may include icons or short inline markup. |
Notes
- The public tag is `stellar-toggle-tag`, matching the shipped tag-toggle boundary instead of baking grouping into the component itself.
- `checked` is the mutable state surface. User toggles emit `input` and `change` so app code can keep the live selection set in sync.
- The default slot is the visible tag content. Use the `label` prop only as plain-text fallback when the slot is empty.
- These surfaces read best in groups, but layout still belongs to the parent app, form row, or checkbox-group-like wrapper around them.