<baht-button>

Design-system button. Variants + sizes via attributes; content via children or label.

Variants

Primary

Secondary

Ghost

Danger

<baht-button variant="primary">Primary</baht-button>
<baht-button variant="secondary">Secondary</baht-button>
<baht-button variant="ghost">Ghost</baht-button>
<baht-button variant="danger">Danger</baht-button>

Sizes

Small

Medium

Large

<baht-button size="sm">Small</baht-button>
<baht-button size="md">Medium</baht-button>
<baht-button size="lg">Large</baht-button>

With icon

Copy

Export

Import

Add field

Curated icon set: copy, check, download, upload, plus, external, close, play. Icons inherit the button color.

<baht-button icon="copy" variant="secondary">Copy</baht-button>
<baht-button icon="download">Export</baht-button>
<baht-button icon="upload" variant="ghost">Import</baht-button>
<baht-button icon="plus">Add field</baht-button>

Icon-only (needs label for a11y)

label becomes the aria-label. Required, since there is no visible text.

<baht-button icon="close" icon-only="true" label="Close" variant="ghost"></baht-button>
<baht-button icon="copy" icon-only="true" label="Copy" variant="secondary"></baht-button>
<baht-button icon="plus" icon-only="true" label="Add"></baht-button>

Disabled

Can’t touch this

<baht-button disabled="true">Can’t touch this</baht-button>

Props

Name	Type	Default	Description
`variant`	`ButtonVariant`	`'primary'`	Visual style (primary \| secondary \| ghost \| danger)
`size`	`ButtonSize`	`'md'`	Button size (sm \| md \| lg)
`disabled`	`boolean`	`false`	Disable
`type`	`'button' \| 'submit'`	`'button'`	Native button type (button \| submit)
`label`	`string`	`''`	Text alternative to children / a11y name for icon-only
`icon`	`IconName \| ''`	`''`	Optional leading icon (copy \| check \| download \| upload \| plus \| external \| close \| play)
`icon-only`	`boolean`	`false`	Square icon button; set label for the accessible name

Events

Event	detail	Description
`name`	CustomEvent
`click`	`MouseEvent`	Native click

Slots

Slot	Description
`(default)`	Button content