Component Catalog

WebStarts-owned styles and behavior

WebStarts design system

One component architecture for gradual migration. Existing applications can load this library beside Bootstrap Material Design, replace one inline implementation at a time, and remove the old theme after migration.

Color Tokens

Shared CSS variables

Primary--brand-primary
Secondary--brand-secondary
Success--brand-success
Danger--brand-danger
Warning--brand-warning
Info--brand-info

Buttons

Variants, colors, sizes, groups, and actions

Variantsflat · raised · outline
Color Variationssemantic contexts
Sizes and Groupssmall · medium · large · split · FAB

Search & Select

Owned field behavior replacing inline search and Selectize usage

Search and single select SearchField · Select

Search runs from Enter or the search icon.

Searchable and tag selection searchable · multiple · createOption · renderOption
Text input states text · number · textarea autoResize

Selection Controls

Checkbox, radio, and switch

Tabs

Animated active indicator and keyboard navigation

General component configuration.
Visual design and theme options.
Advanced component settings.

Popup & Toast

Overlays and feedback

Page Scan
Ready to scan your website

Data Table

Remote sorting, infinite loading, selection, row actions, and reordering

Selected 0
Product Category Price Inventory
Scroll the table to load more products. Click a row to edit it.
React Contacts DataTable TanStack Query + controlled state

Agent Flow

One conversational question at a time

Conversational Agent Flow@webstarts/widgets

Agent Selectors

Address, Social Profiles, Logo, File Manager, and Opening Hours

Standalone Agent Selectorscontrolled value · onChange

Layout

Flex and Grid primitives

Stack.ws-stack
One
Two
Three
Grid.ws-grid
One
Two
Three
Four