Components

This index is generated from the @okrado/ui 0.11.0 manifest: 110 entries, 59 stable and 51 beta. Each name opens the component’s docs page in Storybook, where you can try every story in paper and night, at 375 px and in Arabic.

A component is stable only when it has a docs page, a green generated story matrix, an axe check at zero and a review score. beta components work but their API may still change. See Governance.

Agents can read the same data as JSON at /components/manifests/components.json.

Primitives

Name	Stage	What it is
AlertDialog	beta	A modal that interrupts for a decision the user cannot take back.
AlertDialogClose	beta	A control that closes its AlertDialog without acting.
AlertDialogContent	beta	The alert dialog panel.
AlertDialogTrigger	beta	The element that opens its AlertDialog.
Badge	stable	A status chip.
Button	stable	The one button.
ButtonLink	stable	A link that looks like a Button, for an action that navigates ("Talk to the founders" opening mail, "See how it works").
Checkbox	stable	A checkbox with its label on the same row.
Dialog	beta	A modal dialog.
DialogClose	stable	A control that closes its Dialog, such as a Cancel button.
DialogContent	stable	The dialog panel.
DialogTrigger	stable	The element that opens its Dialog.
Display	stable	The one display headline of a marketing page.
Drawer	beta	A panel that slides in from the edge.
DrawerClose	beta	A control that closes its Drawer, such as a Cancel button.
DrawerContent	beta	The drawer panel.
DrawerTrigger	beta	The element that opens its Drawer.
Heading	stable	A marketing or docs heading on the fluid scale.
Icon	beta	A Lucide icon by name from the Okrado allow-list, in one of the three standard sizes and drawn in currentColor.
IconButton	beta	A square button that shows only an icon, as wide as the control height.
Input	stable	A single-line text input.
Kbd	stable	A keyboard key or shortcut, such as ⌘K.
Link	stable	A text link inside the current zone, in the link colour with the focus-gap ring.
LiveRegion	beta	A live region.
Menu	stable	A menu of actions or links behind a trigger.
MenuCheckboxItem	beta	A menu item that toggles an option on or off and keeps the menu open, such as a visible column.
MenuContent	stable	The floating menu panel, positioned next to its trigger.
MenuGroup	beta	A labelled group of related items in a Menu, such as the options of one filter.
MenuItem	stable	One action in a Menu.
MenuLinkItem	stable	A menu entry that is a link (href), for navigation menus such as the ProductSwitcher.
MenuRadioGroup	beta	A set of mutually exclusive MenuRadioItems, such as the density.
MenuRadioItem	beta	One choice in a MenuRadioGroup.
MenuSeparator	stable	A rule between groups of menu items.
MenuTrigger	stable	The control that opens its Menu.
Meter	stable	A scalar measurement within a known range, such as a key result's progress toward its target.
Mono	stable	Evidence in JetBrains Mono.
Popover	beta	A small panel tied to a trigger.
PopoverClose	beta	A control that closes its Popover, such as a Done button.
PopoverContent	beta	The floating panel, positioned next to its trigger with collision flip and shift, at the popover layer, with an e2 shadow and a 1 px line border.
PopoverTrigger	beta	The control that opens its Popover.
Progress	beta	Progress of a long job (ADR-0113).
RecordMark	stable	The Record mark (ADR-0076 §14), the only way to put the Okrado logo on a page.
Select	stable	A single-choice dropdown for 4 to about 15 options (fewer.
Skeleton	stable	A placeholder block while content loads.
Switch	stable	An on/off switch for a setting that applies at once (use Checkbox inside forms that submit).
Tab	stable	One tab.
Tabs	stable	Tabs that switch between panels of one view, such as the long, shorts and feed variants of a video.
TabsList	stable	The row of Tab buttons.
TabsPanel	stable	The content shown while its Tab is active.
Text	stable	Running text on marketing and docs surfaces in Inter, on the language's body scale.
Textarea	stable	A multi-line text input.
ToastProvider	beta	Hosts toasts for everything inside it and renders them at the bottom-end of the viewport, at the toast layer.
Toggletip	beta	Help that opens on press and is read aloud, for what a Tooltip cannot carry.
Tooltip	beta	A short hint on hover and keyboard focus, such as the shortcut of an IconButton.
TooltipProvider	beta	The delay group of every Tooltip below it.
UiProvider	stable	Gives every @okrado/ui component its locale, text direction and shared strings.
VisuallyHidden	stable	Text for assistive technology only, such as the name of an icon-only region.

Components

Name	Stage	What it is
Banner	beta	A persistent, page-wide message at the top of the content.
BrandHead	beta	The brand's <head> tags for a plain React tree (React 19 hoists them into <head>).
Breadcrumbs	beta	The location trail of a page (ADR-0083).
BulkBar	beta	The bar that takes the place of the Toolbar while rows are selected (ADR-0083).
Card	stable	A surface that groups related content, with the card inset of the current density.
ConfirmDialog	beta	A destructive confirmation.
CtaCard	stable	The closing call to action of a page (ADR-0076 §6).
DataTable	beta	The list of records, the one table of the suite (ADR-0083, ADR-0078).
DecisionPanel	beta	The governance moment (ADR-0076 §4, §10).
EmptyState	stable	The state of a list or a module with nothing to show, or whose data could not be loaded.
Field	stable	A form field.
FilterBar	beta	The search, filters and result count of a list, for the Toolbar (ADR-0083).
Form	beta	A form with explicit save (ADR-0112).
FormActions	beta	The one Save button of a Form, kept enabled (a disabled save hides why it cannot save) with a Cancel to its right.
FormField	beta	One field of a Form.
InlineNotice	beta	A message tied to a place.
KeyResultProgress	stable	A key result with its progress (ADR-0030).
KpiTile	stable	A KPI on a dashboard or the app's Home (ADR-0076 §11).
KrRow	stable	One key result as a table row (ADR-0076 §10, §11).
LedgerChain	stable	A chain of ledger records (ADR-0076 §6).
LedgerRow	stable	One ledger record (ADR-0076 §10).
LoopDiagram	stable	The Loop (ADR-0076 §6).
PageContent	beta	The content column of a page inside the shell.
PageHeader	beta	The top of every page (ADR-0083).
Pagination	beta	The footer of a list.
PreferencesForm	stable	The user's display preferences (ADR-0060, ADR-0065).
ProductFrame	stable	A product shot on a marketing or docs page (ADR-0076 §8).
Prose	stable	Long-form Markdown, such as a decision record's body, in the design system's type scale.
RecordHeader	stable	The head of a record view (ADR-0069).
RecordList	stable	The list half of the viewer pattern (ADR-0069).
RecordListHead	stable	The header row of a {@link RecordList}.
RecordStatus	stable	The status of a decision, note, key result or video as a labelled badge, with one tone per status across the suite.
Section	stable	A titled region of a page (ADR-0069 page frame).
SectionHead	stable	The head of a marketing or docs section (ADR-0076 §2).
ShortcutsDialog	beta	The ? dialog.
SiteFooter	stable	The footer of an Okrado site (ADR-0076 §2, R §3).
SiteHeader	stable	The header of an Okrado site (ADR-0076 §2).
Steps	stable	Steps on a chained rule (ADR-0076 §6).
Toolbar	beta	The row of controls above a DataTable (ADR-0083).
VerifyBlock	stable	The proof under a ledger (ADR-0076 §6).
VideoCard	stable	A Studio video in a grid (ADR-0069 library).
ViewOptions	beta	The "View" menu of a list (ADR-0083).

Shells

Name	Stage	What it is
AppShell	beta	The suite's frame, the same in every zone (ADR-0058, ADR-0069, ADR-0083).
BottomBar	stable	The phone navigation of the shell (ADR-0069).
CommandPalette	stable	The suite's command palette (Cmd/Ctrl+K).
Inspector	beta	The right panel of a split page (ADR-0083, L4).
NavGroup	beta	A labelled group of sidebar items (ADR-0083).
ProductNav	beta	The sidebar list of the active product's modules, with registry labels in the user's locale.
ProductSwitcher	beta	The sidebar's product switcher.
SearchTrigger	beta	The top bar's search field (ADR-0083).
SuiteLink	stable	A link to any page of the suite, across zones.
TopBar	beta	The content of the shell's 48 px top bar (ADR-0083), passed as AppShell's topBar.
ZoneShell	beta	The whole zone frame in one piece (ADR-0058, ADR-0083), which the web-zone template mounts once.