Components
All 32 Sisyphos UI components, grouped by category. Click any component for live examples and the full API.
Forms & Inputs(12)
Buttons, text fields, pickers — every control your forms need.
Polymorphic, accessible button with four variants, five sizes, loading state, optional dropdown, and href support.
@sisyphos-ui/buttonText input with labels, helper text, validation state, adornments, and full keyboard accessibility.
@sisyphos-ui/inputMultiline text input with auto-resize, character count, and all Input features.
@sisyphos-ui/textareaBinary input with indeterminate state, custom icons, label association, and keyboard support.
@sisyphos-ui/checkboxToggle input for binary settings with on/off states and smooth transitions.
@sisyphos-ui/switchSingle-choice picker with `RadioGroup` compound API and roving tabindex.
@sisyphos-ui/radioDropdown picker with search, multi-select, virtualization-ready items, and full keyboard nav.
@sisyphos-ui/selectHierarchical picker with checkbox cascading, search, and async loading hooks.
@sisyphos-ui/tree-selectNumeric input with stepper buttons, min/max clamping, precision, and locale-aware formatting.
@sisyphos-ui/number-inputRange selector with single or dual thumbs, step snapping, marks, and keyboard arrow support.
@sisyphos-ui/sliderCalendar-driven date picker with range mode, disabled dates, and keyboard navigation.
@sisyphos-ui/datepickerDrag-and-drop file uploader with preview, progress, and validation hooks.
@sisyphos-ui/file-uploadData Display(12)
Lists, cards, tables, feedback surfaces — how data shows up.
Compact element for tags, filters, and small actions. Supports icons, removable state, and color tokens.
@sisyphos-ui/chipUser representation with image, initials fallback, grouping, and status indicator.
@sisyphos-ui/avatarLoading indicator. Respects `prefers-reduced-motion`.
@sisyphos-ui/spinnerLoading placeholder matching content layout. Shimmer animation with reduced-motion support.
@sisyphos-ui/skeletonStandardized empty result UI with illustration slot, title, description, and action.
@sisyphos-ui/empty-stateInline message with semantic colors, title, description, and dismiss action.
@sisyphos-ui/alertHierarchical navigation trail with custom separators and truncation.
@sisyphos-ui/breadcrumbCompound surface with header, body, footer slots. Elevated, outlined, and flat variants.
@sisyphos-ui/cardCollapsible panels with single or multiple expansion modes and full keyboard support.
@sisyphos-ui/accordionCompound tab interface with roving tabindex, automatic activation, and vertical/horizontal orientation.
@sisyphos-ui/tabsAccessible data table with sorting, row selection, sticky headers, and density variants.
@sisyphos-ui/tableTouch-friendly content rotator with autoplay, indicators, keyboard navigation, and reduced-motion support.
@sisyphos-ui/carouselOverlays & Feedback(5)
Popovers, dialogs, tooltips, toasts — floating UI and feedback.
Positioned hint with 12 placement options, arrow, and delay control. Uses `aria-describedby`.
@sisyphos-ui/tooltipPositioned floating panel for menus, forms, and custom UI. `role="dialog"` with focus management.
@sisyphos-ui/popoverMenu surface with `role="menu"` + `menuitem`, arrow key nav, type-ahead, and submenu support.
@sisyphos-ui/dropdown-menuModal dialog with focus trap, scroll lock, restore-on-close, and compound header/body/footer API.
@sisyphos-ui/dialogImperative notification API (`toast.success`, `toast.error`). Differentiates `role="alert"` from `role="status"`.
@sisyphos-ui/toastFoundation(3)
Design tokens, theme helpers, and shared primitives.
Design tokens, `applyTheme`, theme mode helpers, and the CSS variable foundation that every package builds on.
@sisyphos-ui/coreRenders children to a dedicated root outside the parent DOM tree. Used by every overlay primitive.
@sisyphos-ui/portalLabel, helper text, and error slot that wraps form inputs and wires up `aria-describedby`/`aria-invalid`.
@sisyphos-ui/form-control