bordered container. the base card everything else builds on.

framed section with an optional header.

full-bleed layout wrapper with brand, breadcrumbs, and actions.

labeled divider between sections.

flex and grid helpers: row, stack, grid, cell, spacer.

viewport with a TUI scrollbar thumb.

single-line text input with a square border.

multi-line text in a shell-code face.

minimal dropdown picker, no chrome.

a [x] marker instead of a tick box.

a (•) marker for exclusive choice.

a two-state toggle.

drag a thumb along a bordered track. range, marks, and showValue are optional.

a numeric field with -/+ stepper buttons.

pick a known value from a filterable list. Select is for short closed lists. Autocomplete is free text. CommandPalette is actions.

free-text input with suggestions. Does not lock the value to an item.

type to filter, pick multiple, remove with backspace.

a month grid for picking a date, no library required.

a calendar behind a popover trigger.

two clicks on the calendar, start then end.

password field with a reveal toggle.

react-hook-form + zod, with FormInput, FormSelect, FormNumberInput, FormFileUpload, FormOtpInput, FormAutocomplete, and the rest.

dropzone with max size, removal, and optional per-file progress.

groups related fields under a shared legend.

one slot per digit, paste and autofill work out of the box.

same field as OtpInput, entered characters masked.

five variants, mechanical press, dither loading.

button with a keyboard shortcut binding.

keycap hint.

three-dimensional mechanical keycap with tactile press and modifier formatting.

the > selection cursor.

accent link, renders any element.

a two-state pressed/unpressed button.

toggle buttons joined into one segmented control.

a row of actions with proper keyboard navigation between them.

a filled or hollow dot.

dithered progress bar.

inline banner with a tone.

bordered box with a title, description, and four tones.

labeled bar with a current value.

label over a big number.

transient notification, deduplicated, with optional undo/retry actions.

pulsing placeholder for loading regions.

dithered inline loading indicator.

full-region gate while a server-side check resolves.

friendly nothing-here placeholder.

failure placeholder with a retry action.

hover or tap hint.

modal with backdrop, closes on esc.

non-modal floating panel.

menu from a trigger: items, submenus, checkboxes, shortcuts.

right-click or long-press menu with the same grammar as DropdownMenu: item, checkbox, radio, sub, shortcut.

destructive confirmation dialog, with optional type-to-confirm.

side drawer, used for the mobile sidebar.

Fresh passkey or authenticator-code check. Replaces an open confirm instead of stacking a second modal.

fuzzy command menu with groups, icons, and shortcuts.

hover or tap preview card popup.

classic desktop horizontal menu bar with nested submenus and shortcuts.

accessible top navigation menu with floating viewport panels.

static vertical menu.

segmented panel switcher.

path trail.

page controls with button or href links.

numbered progress through a multi-step flow, optional vertical and clickable completed steps.

expandable sections.

single show/hide region.

hierarchical list.

toolbar, table, empty, error, and pagination as one list page.

GET search input with a TUI / prefix. Hidden fields keep filters.

sortable table with selection, empty, loading, and footer.

divided vertical list.

label / value pair.

inline code and code blocks, with optional Shiki highlighting.

plain text with backtick spans rendered as code.

press mod+k to open the palette

text with a copy button.

hidden value with a reveal toggle, for secrets on screen.

small outlined label.

renders a filesystem path.

a line of terminal output.

a run of characters as a divider.

an input that looks like a shell prompt.

keycap plus description.

live-ticking duration and uptime clock in various TUI formats.

terminal log stream console with filtering, follow autoscroll, and line actions.

interactive inspector for nested objects, arrays, and primitive values.

panel-wrapped JSON inspector with interactive tree, raw text mode, filtering, and export.

terminal diff viewer with split and unified modes, custom TUI hunk expansion, and Shiki highlighting powered by @pierre/diffs.

the whole app frame: sidebar, topbar, main.

mechanical tmux/vim split panes with horizontal and vertical drag handles.

two-pane resizable layout with customizable default and min/max limits.

{
  "active": true,
  "role": "admin"
}

nav rail, collapses to a sheet on mobile.

top strip with trigger and actions.

title, description, and actions for a page.

avatar trigger with a dropdown.

system / light / dark picker.

avatar derived from a name hash, dithered.

the wrksz logo as a dithered canvas.

a dithered background texture.

compact dithered trend line with gradient area fill and crosshair.

full cartesian time-series chart with axes, grid, and crosshair tooltip.

discrete dithered column histogram with mechanical hover.

dithered circular ring chart with segment breakdown.

day-grouped Bus event list with load more, empty state, and detail sheet wiring.

one Bus event as a list row: source tag, summary, time.

full event detail (source, type, timestamps, payload) in a sheet.