Base UI
Foundational building blocks — Label, Separator, and Kbd.
Label
Accessible form label with required indicator and hint text.
Separator — Horizontal
Dashed horizontal divider with optional center label.
or continue with
Separator — Vertical
Inline vertical divider for toolbars and button rows.
FileEditView
Kbd — Keyboard Keys
Physical key styling for shortcuts. Add a 'shortcut' prop to autonomously listen for hotkeys and emit '@trigger'.
Press ⌘J anywhere on this page
0
Label API
| Prop / Event | Type | Default | Description |
|---|---|---|---|
for | string | '' | ID of the input element this label is bound to. |
required | boolean | false | When true, displays a red asterisk. |
hint | string | '' | Optional helper text displayed inline. |
disabled | boolean | false | Visually dims the label. |
Separator API
| Prop / Event | Type | Default | Description |
|---|---|---|---|
orientation | string | 'horizontal' | Direction: 'horizontal' or 'vertical'. |
label | string | '' | Optional text badge displayed in the center (horizontal only). |
Kbd API
| Prop / Event | Type | Default | Description |
|---|---|---|---|
shortcut | string | '' | A shortcut combo (e.g. "meta+j", "shift+k") to automatically listen for. |
size | string | 'md' | Size of the key: 'sm', 'md', or 'lg'. |