Components

Browse component APIs, examples, and calculated checks.

Find a component

38 of 38 components

Status

Badge

Status or category label with semantic tones.

Status

Alert

Inline message with optional actions and dismissal.

Display

Card

Content container with header, footer, and media slots.

Display

Avatar

Image or initials with configurable size, shape, and ring.

Display

DataChart

SVG line, bar, and area charts with legends and point tooltips.

Advanced

Collection

Accordion

Expandable content sections with single or multiple open items.

Navigation

Breadcrumbs

Hierarchy navigation with separators and a current-page marker.

Navigation

SideNav

Two-level app navigation with expandable branches and a collapsed mode.

Advanced

Navigation

Stepper

Workflow steps with current, complete, upcoming, and error states.

Advanced

Action

Button

Action button or link with variants, sizes, and a loading state.

Choice

Chip

Compact selectable label with an optional dismiss action.

Field

InlineEdit

Text display that opens an editor with save and cancel actions.

Advanced

Field

Combobox

Searchable single-choice field with filtered options.

Advanced

Overlay

CommandPalette

Searchable command list with grouping and an optional keyboard shortcut.

Advanced

Field

DatePicker

Single-date field with a calendar, keyboard navigation, and blocked dates.

Advanced

Field

RangeDatePicker

Two-month date-range field with blocked-date support.

Advanced

Display

EmptyState

Empty-content message with an icon and optional action.

Field

TextField

Single-line input with labels, guidance, errors, and icon slots.

Field

Textarea

Multiline input with labels, guidance, and errors.

Choice

Checkbox

Independent choice with checked and indeterminate states.

Choice

Switch

Binary setting with on and off states.

Choice

RadioGroup

Single-choice group with visible options and descriptions.

Choice

SegmentedControl

Compact single-choice control for switching modes.

Navigation

Tabs

Related views with keyboard navigation and associated panels.

Collection

TreeView

Single-select hierarchy with branch expansion and keyboard navigation.

Advanced

Overlay

Dialog

Modal dialog with focus containment and configurable dismissal.

Advanced

Overlay

Drawer

Side-panel dialog with configurable size and dismissal.

Advanced

Overlay

Popover

Anchored content panel with placement and dismissal controls.

Advanced

Collection

Menu

Triggered action list with keyboard navigation and dismissal.

Advanced

Navigation

Pagination

Page navigation with a windowed range and current-page marker.

Field

FileUpload

File picker with validation limits and a selected-file list.

Status

Progress

Linear progress indicator with a label and semantic tones.

Collection

Select

Single-choice field with a triggered list of options.

Advanced

Display

Skeleton

Loading placeholders for text, cards, and avatars.

Collection

Table

Data table with sorting, selection, and sticky headers.

Advanced

Collection

DataGridLite

Data grid with cell focus, pinned columns, sorting, and selection.

Advanced

Overlay

Tooltip

Non-interactive hint shown on focus or pointer interaction.

Advanced

Status

Toast

Transient notification stack with actions and dismissal.

Advanced