Button
Command control. Three intents, three control heights, full state coverage; the primary intent reads as the affirmative action.
Example
Section titled “Example”| Prop | Type | Default | Description |
|---|---|---|---|
intent | ButtonIntent | 'default' | |
size | ButtonSize | 'md' | |
loading | boolean | false |
Plus all native <button> attributes.
States
Section titled “States”- default
- hover
- focus-visible
- active
- disabled
- loading
Do / Don’t
Section titled “Do / Don’t”Do
Use danger for destructive/irreversible actions only.
Use danger for destructive/irreversible actions only.
Don’t
Don’t rely on color alone — pair danger with a confirmation Dialog.
Don’t rely on color alone — pair danger with a confirmation Dialog.
Modes & RTL
Section titled “Modes & RTL”Colors come only from Semantic tokens, so this component re-themes automatically across Day / Night-NVG / Mono with no variant swap. It uses CSS logical properties, so it mirrors correctly in RTL.