Button

Displays a button or a component that looks like a button.

Installation

Install the component using the StarUI CLI:

star add button

Four size options including icon-only buttons — always pair size='icon' with aria_label

Place icons before or after text as children — the built-in gap handles spacing, no manual margin needed

Ghost icon buttons composed as a text formatting toolbar with accessible labels

Mixing variants to convey intent — outline for cancel, default for confirm, destructive for danger

Signal-driven counter — the simplest reactive pattern [Signal, .add(), data_text]

Temporary state swap with auto-reset [set_timeout, data_show]

Prop	Type	Default	Description
`variant`	`Literal['default', 'secondary', 'destructive', 'outline', 'ghost', 'link']`	`'default'`	Visual style variant
`size`	`Literal['default', 'sm', 'lg', 'icon']`	`'default'`	Button size. Use 'icon' for square icon-only buttons
`disabled`	`bool`	`False`	Disables the button — adds opacity and blocks pointer events
`type`	`Literal['button', 'submit', 'reset']`	`'button'`	HTML button type. Defaults to 'button' (not 'submit' as in native HTML)
`cls`	`str`	`''`	Additional CSS classes

Component	Description
`Button`	Renders a <button> element. Accepts arbitrary children — text, icons, or both. All extra keyword arguments (data_on_click, aria_label, id, etc.) are passed through to the underlying element