Typography

Heading 1 (h1)

Heading 2 (h2)

Heading 3 (h3)

Heading 4 (h4)

Heading 5 (h5)

Heading 6 (h6)

Body Large (text-xl)

Body Regular (text-base)

Body Small (text-sm)

Caption / Overline (text-overline)

Bold Text

Secondary Text

Monospace Text

Buttons

Badges

Neutral Primary Success Warning Danger

Inputs & Form Fields

Disabled Input

Selection Controls

Text Inputs

Standard Textarea

Auto-resizing Textarea

Disabled Textarea

Selects

Single Select

Multi Select (Searchable)

Disabled Select

Alerts

Information

This is a standard informational alert.

Success!

Operation completed successfully. (Click X to dismiss)

Warning: This alert has no title, just content.

Critical Error

Something went terribly wrong.

Toasts

Navigation

Toolbar

Icons

Panels & Composition

File Explorer

Project Root

src

public

package.json

Account

Preferences

Notifications

Account Settings

Manage your profile and security settings.

DataGrid

Name	Role	Status
Alice Johnson	Admin	Active
Bob Smith	Editor	Offline
Charlie Brown	Viewer	Active
Diana Prince	Editor	Active
Evan Wright	Viewer	Inactive

ListView

Single-Select Mode (Standard)

Selected ID: item-1

Multi-Select Mode (Collapsible Groups)

Selected IDs: item-2

Custom Group Header (Collapsible)

Custom `groupHeader` snippet receiving group name, collapse state, and toggle function.