Components

Every Bridge UI component available so far.

Bridge UI provides building blocks for React and Vue applications. Components share Bridge design tokens and a consistent API across both frameworks.

Use the framework selector in the site header to switch between React and Vue on every component page.

Inputs

Form controls and actions that accept user input.

Component	Description
Autocomplete	Combobox with search, free-solo, and async data
Button	Primary action control for forms, dialogs, and navigation
Checkbox	Binary choice with optional indeterminate state
Label	Accessible label for form fields
Number Field	Numeric input with min, max, and step
Otp Field	One-time password / PIN input with pin cells
Password Field	Password input with visibility toggle
Radio	Single choice within a group
Select	Dropdown selection, single or multiple
Slider	Horizontal control for a numeric value or range
Switch	On/off toggle
Text Field	Single-line text input with adornments
Textarea	Multi-line text input with optional autosize
Toggle Group	Segmented control for one or more options in a track

Calendars and fields for selecting dates, times, and ranges.

Component	Description
Calendar	Standalone calendar with date, month, and year panels
Date Field	Form field that opens a date picker
Date Range Field	Form field for selecting a start and end date
Date Time Field	Form field for selecting a date and time
Date Time Range Field	Form field for selecting a date-time range
Time Field	Form field that opens a time picker
Time Range Field	Form field for selecting a start and end time

Components for presenting content and metadata.

Component	Description
Avatar	User or entity representation with image, initials, or icon
Badge	Status indicator or count overlay
Divider	Horizontal or vertical separator for grouping content
Icon	Sized icon from a component or semantic name
List	Vertical list with sections and interactive items
Skeleton	Placeholder block for loading states

Non-blocking messages about app state.

Component	Description
Alert	Inline banner for contextual messages
Progress	Linear progress for determinate, indeterminate, buffer, and query
Snackbar	Toast notification portaled to the viewport
Spinner	Circular progress for determinate and indeterminate loading states

Containers that group related content.

Component	Description
Accordion	Expandable sections for FAQs, settings groups, and stacked content
Card	Elevated surface with title, body, and slots

Links and menus for moving through the app.

Component	Description
Breadcrumb	Hierarchy trail with compound items or a data-driven list
Link	Styled anchor for in-app and external navigation
Menu	Anchored floating panel for actions and dropdowns
Pagination	Page controls with numbered pages or simple prev/next
Tabs	Tabbed views with TabList, Tab, TabPanel, TabItem

Layered UI that sits above the page.

Component	Description
Drawer	Edge-docked overlay with portal, backdrop, and focus management
Modal	Dialog overlay with portal, backdrop, and focus management
Tooltip	Anchored hint on hover or focus