Components

Browse the shipped @takeoff-ui/react-spar component surface. Each reference includes live examples, public props, compound parts, stable data attributes, and accessibility guidance where the component owns interaction behavior.

Actions & form controls

Component	Use it for
Button	Triggering actions with loading, toggle, and icon support.
Checkbox	Selecting multiple options or representing a mixed state.
Input	Building text inputs with labels, affixes, icons, chips, and actions.
Label	Labeling controls, sections, and compact metadata.
Radio	Choosing one option from a mutually exclusive set.
Select	Choosing from a keyboard-accessible list with typeahead.
Switch	Turning a single setting on or off.

Navigation & disclosure

Component	Use it for
Accordion	Organizing related details into collapsible sections.
Breadcrumb	Showing the current location within a hierarchy.
Tabs	Switching between related panels without leaving the task.

Feedback & status

Component	Use it for
Alert	Presenting contextual success, warning, information, or danger messages.
Badge	Displaying compact status, count, or category labels.
Chip	Representing filters, selections, and removable values.
Spinner	Communicating indeterminate loading work.
Tooltip	Adding short contextual information on hover or focus.

Content & overlays

Component	Use it for
Card	Grouping related content, summaries, and actions.
Dialog	Handling focused forms, confirmations, and blocking decisions.
Drawer	Showing navigation, filters, or details over the current page.
Popover	Displaying additional content or actions in a floating panel.

Start with Composition & styling to learn the shared compound, slot, and customization model.