Components
Label
A lightweight form label with support for required-state styling.
Use Label directly when you are composing your own field structure or when you want explicit control over the relationship between field and caption.
import { Label } from '@tile-ui/vue';
export default function LabelDemo() {
return (
<div class="component-preview__stack">
<div class="form-group">Registry install
pnpm dlx shadcn@latest add @tile-ui/labelPackage usage
import { Label } from '@tile-ui/vue';<div class="form-group">
<Label htmlFor="slug" required>
Project slug
</Label>
<input id="slug" defaultValue="tile-ui" readonly />
</div>Label works as a standalone primitive and pairs with custom field structures when you do not need the higher-level Input and Textarea components.
Highlights
- Required marker styling
- Simple form composition
- Pairs cleanly with Input and Textarea
Registry dependencies
| Item | Purpose |
|---|---|
label |
Component source and module styles |
core |
Framework-agnostic logic helpers |
styles |
Shared SCSS tokens and globals |
API reference
Label
| Prop | Type | Default | Notes |
|---|---|---|---|
required |
boolean |
false |
Adds required styling to the label. |
htmlFor |
string |
— | The id of the associated control. |