Biswarup Mondal
Bengaluru
Actions

Button

The only control that commits a change or navigates.

Specimen

Variants. Only one primary may appear in a view.

Small. Drops to 32px only where the pointer is fine — a touch device keeps 44px.

Go to work

With `to`, it renders a real router link carrying a real href.

Email

With `href`, a plain anchor — for anything the router must not resolve as a route.

Props

PropTypeNote
variant"primary" | "secondary" | "ghost"Defaults to secondary.
size"sm" | "md"Defaults to md. sm is 32px on fine pointers only.
tostringA route in this app. Renders a router Link.
hrefstringmailto:, tel:, or off-site. Renders a plain anchor — the router must not see these.
disabledbooleanButton only. Use aria-disabled on a link.

Use it for

  • Committing a change, submitting, or navigating somewhere significant.
  • Exactly one primary per view — it is the answer to 'what did you want me to do'.

Do not use it for

  • Inline inside a sentence — that is Link.
  • As a tag or status. That is Chip, which is not interactive.
  • Passing a mailto: or an external URL to `to` — that is what `href` is for.