Skip to content

component-registry.md

Latest commit

 

History

History
82 lines (64 loc) · 5.13 KB

component-registry.md

File metadata and controls

82 lines (64 loc) · 5.13 KB
Raw

coss Component Registry Index

Use this file to quickly identify the right coss primitive for a UI task. Each entry includes the component name, a one-line purpose, and the path to its reference guide (relative to the skill root apps/ui/skills/coss/).

For optional portalProps on composed *Popup components and toast providers (Base UI portal forwarding), see ./references/portal-props.md.

Overlays & Popups

  • Dialog — Centered modal requiring user focus. ./references/primitives/dialog.md
  • AlertDialog — Destructive/critical confirmation modal. ./references/primitives/alert-dialog.md
  • Sheet — Side-panel overlay for settings/details. ./references/primitives/sheet.md
  • Drawer — Bottom/side drawer, often mobile-responsive. ./references/primitives/drawer.md
  • Popover — Anchored non-modal floating content. ./references/primitives/popover.md
  • Tooltip — Short hover/focus hint text. ./references/primitives/tooltip.md
  • PreviewCard — Hover-triggered rich entity preview. ./references/primitives/preview-card.md
  • Menu — Dropdown action list with groups/submenus. ./references/primitives/menu.md
  • Command — Searchable command palette (not cmdk). ./references/primitives/command.md

Selection & Input

  • Select — Single-choice from predefined list (no search). ./references/primitives/select.md
  • Combobox — Searchable selection with filtering. ./references/primitives/combobox.md
  • Autocomplete — Free-text with suggestions. ./references/primitives/autocomplete.md
  • Input — Single-line text entry. ./references/primitives/input.md
  • Textarea — Multi-line text entry. ./references/primitives/textarea.md
  • InputGroup — Input with addons (icons, buttons, badges). ./references/primitives/input-group.md
  • OTPField — One-time passcode segmented slots. ./references/primitives/otp-field.md
  • NumberField — Numeric entry with stepper controls. ./references/primitives/number-field.md
  • Slider — Continuous/ranged numeric control. ./references/primitives/slider.md
  • Calendar — Date picker / calendar views. ./references/primitives/calendar.md

Forms & Validation

  • Form — Form validation/submission with Zod. ./references/primitives/form.md
  • Field — Label + description + error wiring. ./references/primitives/field.md
  • Fieldset — Grouped form controls with legend. ./references/primitives/fieldset.md
  • Label — Accessible label for controls. ./references/primitives/label.md

Toggle & Choice

  • Checkbox — Single boolean toggle. ./references/primitives/checkbox.md
  • CheckboxGroup — Multiple-selection set. ./references/primitives/checkbox-group.md
  • RadioGroup — Mutually exclusive single choice. ./references/primitives/radio-group.md
  • Switch — Binary on/off preference toggle. ./references/primitives/switch.md
  • Toggle — Pressable two-state command button. ./references/primitives/toggle.md
  • ToggleGroup — Grouped pressed-state controls. ./references/primitives/toggle-group.md

Layout & Navigation

  • Tabs — Mutually exclusive tabbed panels. ./references/primitives/tabs.md
  • Accordion — Collapsible content sections. ./references/primitives/accordion.md
  • Collapsible — Single expand/collapse region. ./references/primitives/collapsible.md
  • Sidebar — Persistent app shell navigation. ./references/primitives/sidebar.md
  • Breadcrumb — Hierarchical navigation trail. ./references/primitives/breadcrumb.md
  • Pagination — Paged navigation controls. ./references/primitives/pagination.md
  • Toolbar — Grouped command/action strip. ./references/primitives/toolbar.md
  • ScrollArea — Styled scroll container. ./references/primitives/scroll-area.md

Content & Display

  • Card — Content container with sections. ./references/primitives/card.md
  • Frame — Bordered content surface. ./references/primitives/frame.md
  • Table — Tabular data presentation. ./references/primitives/table.md
  • Avatar — User/entity profile image. ./references/primitives/avatar.md
  • Badge — Status indicator / label. ./references/primitives/badge.md
  • Kbd — Keyboard shortcut hints. ./references/primitives/kbd.md
  • Separator — Visual/semantic divider. ./references/primitives/separator.md
  • Group — Connected control cluster. ./references/primitives/group.md
  • Empty — Empty-state placeholder. ./references/primitives/empty.md

Feedback & Status

  • Alert — Inline persistent status message. ./references/primitives/alert.md
  • Toast — Transient notification (toastManager). ./references/primitives/toast.md
  • Progress — Task completion / async progress bar. ./references/primitives/progress.md
  • Meter — Bounded scalar measurement. ./references/primitives/meter.md
  • Spinner — Indeterminate loading indicator. ./references/primitives/spinner.md
  • Skeleton — Loading placeholder. ./references/primitives/skeleton.md

Actions

  • Button — Primary/secondary action trigger. ./references/primitives/button.md