PrimitivasBeta
Bloques de construcción headless y accesibles generados a partir del registro de Solidiom. Cada primitiva incluye su propio resumen, referencia de API generada, ejemplos y evidencia de accesibilidad.
87 primitivas
87 primitivas
- AccordionVertically stacked set of collapsible sections.
- AlertInline, non-modal alert for status messages with live region semantics.
- Alert DialogModal confirmation dialog requiring explicit user action.
- App ShellTop-level application layout with header, sidebar, and main content areas.
- Aspect RatioContainer that constrains children to a specified aspect ratio.
- AttachmentFile attachment display with preview, name, and size.
- AvatarUser avatar with image and fallback.
- Avatar GroupStacked avatar display for showing multiple users.
- BadgeInline status or label indicator.
- BannerDismissible site-wide notification bar.
- BreadcrumbHierarchical location indicator with links.
- ButtonClickable trigger for actions.
- CalendarDate selection with day/month/year views.
- CardContent container with header, body, and footer.
- CarouselHorizontal slide-based content viewer.
- ChartData visualization wrapper with accessible fallback table.
- Chat ComposerRich text input for composing chat messages with send action.
- Chat LayoutContainer managing message flow, scroll behavior, and composer positioning.
- Chat MessageMessage bubble for conversational UI with sender, content, and metadata.
- Chat Message MetadataTimestamps, read receipts, and sender info for chat messages.
- Chat System MessageSystem and bot announcement messages in conversations.
- Chat Tool CallsDisplay of tool/function call results in AI chat interfaces.
- CheckboxBinary or indeterminate toggle control.
- Code BlockSyntax-highlighted code display with copy button and line numbers.
- CollapsibleSingle expandable/collapsible section.
- ComboboxText input with autocomplete dropdown.
- Command PaletteModal search and action launcher.
- Context MenuRight-click triggered menu.
- Data TableSortable, selectable table with column control.
- Date PickerCalendar popup for selecting dates.
- Date Range InputDate range selection with start/end text fields and calendar picker.
- DialogModal or non-modal overlay window.
- DirectionRTL/LTR direction context provider component.
- DrawerSlide-in panel from any screen edge.
- Empty StatePlaceholder for empty content areas.
- FieldComposition wrapper: label + control + description + error with automatic ARIA wiring.
- File InputFile upload trigger with dropzone support and validation.
- GridCSS Grid layout primitive with responsive columns and gap.
- Hover CardContent preview on hover with open delay and anchored positioning.
- InputText input and textarea with validation states and Field integration.
- Input GroupInput wrapper with prefix/suffix addon slots for icons and buttons.
- Input OTPA one-time password input with individual character slots.
- KbdKeyboard shortcut display element.
- LabelAccessible label element linked to form controls via htmlFor.
- LightboxImage and media overlay viewer with navigation controls.
- LinkStyled anchor with router integration and safety validation.
- ListboxSingle or multi-select list of options.
- Mega MenuExpanded navigation dropdown with rich multi-column content.
- MenuAction list triggered by a button.
- MenubarDesktop-style horizontal menu bar with dropdown submenus.
- Message ScrollerAuto-scrolling message container with new-content indicators.
- MeterScalar measurement within a known range (e.g. disk usage, signal strength).
- Multi SelectorMulti-select dropdown with checkbox items and search filtering.
- Navigation MenuA top-level navigation component with accessible dropdown sub-menus.
- Number InputNumeric input with increment/decrement controls and locale-aware formatting.
- PaginationPage navigation with prev/next and page numbers.
- PopoverNon-modal floating content panel.
- ProgressDeterminate and indeterminate progress indicator.
- QuestionnaireMulti-step form and survey flow with progress tracking.
- Radio GroupSingle-select radio button set with keyboard navigation.
- Resizable PanelsDrag-to-resize panel layout.
- Scroll AreaCustom-styled scrollbar with native scrolling performance.
- Segmented ControlMutually exclusive option selector with connected segments.
- SelectDropdown selection from a list of options.
- SeparatorHorizontal or vertical visual divider.
- SheetSide-panel dialog with slide animation.
- SidebarCollapsible application sidebar navigation panel.
- SkeletonLoading placeholder with pulse animation.
- SliderNumeric range input with thumb control.
- SpinnerLoading spinner indicator.
- StackFlex layout primitive with configurable gap, direction, and alignment.
- Status DotSmall colored dot indicating presence or status.
- SwitchBinary toggle with on/off semantics.
- TableSimple static data table with header, body, rows, and cells.
- TabsTabbed content switcher.
- TextareaNative textarea primitive with validation states and optional auto-resizing.
- Time InputSegmented time entry with hour, minute, second fields and AM/PM toggle.
- ToastTemporary non-blocking notification.
- ToggleA two-state button that can be toggled on or off.
- Toggle GroupGroup of mutually-exclusive or multi-select toggle buttons.
- TokenizerTag/token input for managing multiple values with keyboard support.
- ToolbarGrouped actions and controls in a horizontal bar.
- TooltipContextual hint shown on hover/focus.
- TreeHierarchical tree view with expand/collapse.
- TypographySemantic text primitives for headings, paragraphs, and inline text.
- Virtual ListViewport-windowed list for large datasets.
- Visually HiddenHides content visually while keeping it accessible to screen readers.
- AccordionVertically stacked set of collapsible sections.
- AlertInline, non-modal alert for status messages with live region semantics.
- Alert DialogModal confirmation dialog requiring explicit user action.
- App ShellTop-level application layout with header, sidebar, and main content areas.
- Aspect RatioContainer that constrains children to a specified aspect ratio.
- AttachmentFile attachment display with preview, name, and size.
- AvatarUser avatar with image and fallback.
- Avatar GroupStacked avatar display for showing multiple users.
- BadgeInline status or label indicator.
- BannerDismissible site-wide notification bar.
- BreadcrumbHierarchical location indicator with links.
- ButtonClickable trigger for actions.
- CalendarDate selection with day/month/year views.
- CardContent container with header, body, and footer.
- CarouselHorizontal slide-based content viewer.
- ChartData visualization wrapper with accessible fallback table.
- Chat ComposerRich text input for composing chat messages with send action.
- Chat LayoutContainer managing message flow, scroll behavior, and composer positioning.
- Chat MessageMessage bubble for conversational UI with sender, content, and metadata.
- Chat Message MetadataTimestamps, read receipts, and sender info for chat messages.
- Chat System MessageSystem and bot announcement messages in conversations.
- Chat Tool CallsDisplay of tool/function call results in AI chat interfaces.
- CheckboxBinary or indeterminate toggle control.
- Code BlockSyntax-highlighted code display with copy button and line numbers.
- CollapsibleSingle expandable/collapsible section.
- ComboboxText input with autocomplete dropdown.
- Command PaletteModal search and action launcher.
- Context MenuRight-click triggered menu.
- Data TableSortable, selectable table with column control.
- Date PickerCalendar popup for selecting dates.
- Date Range InputDate range selection with start/end text fields and calendar picker.
- DialogModal or non-modal overlay window.
- DirectionRTL/LTR direction context provider component.
- DrawerSlide-in panel from any screen edge.
- Empty StatePlaceholder for empty content areas.
- FieldComposition wrapper: label + control + description + error with automatic ARIA wiring.
- File InputFile upload trigger with dropzone support and validation.
- GridCSS Grid layout primitive with responsive columns and gap.
- Hover CardContent preview on hover with open delay and anchored positioning.
- InputText input and textarea with validation states and Field integration.
- Input GroupInput wrapper with prefix/suffix addon slots for icons and buttons.
- Input OTPA one-time password input with individual character slots.
- KbdKeyboard shortcut display element.
- LabelAccessible label element linked to form controls via htmlFor.
- LightboxImage and media overlay viewer with navigation controls.
- LinkStyled anchor with router integration and safety validation.
- ListboxSingle or multi-select list of options.
- Mega MenuExpanded navigation dropdown with rich multi-column content.
- MenuAction list triggered by a button.
- MenubarDesktop-style horizontal menu bar with dropdown submenus.
- Message ScrollerAuto-scrolling message container with new-content indicators.
- MeterScalar measurement within a known range (e.g. disk usage, signal strength).
- Multi SelectorMulti-select dropdown with checkbox items and search filtering.
- Navigation MenuA top-level navigation component with accessible dropdown sub-menus.
- Number InputNumeric input with increment/decrement controls and locale-aware formatting.
- PaginationPage navigation with prev/next and page numbers.
- PopoverNon-modal floating content panel.
- ProgressDeterminate and indeterminate progress indicator.
- QuestionnaireMulti-step form and survey flow with progress tracking.
- Radio GroupSingle-select radio button set with keyboard navigation.
- Resizable PanelsDrag-to-resize panel layout.
- Scroll AreaCustom-styled scrollbar with native scrolling performance.
- Segmented ControlMutually exclusive option selector with connected segments.
- SelectDropdown selection from a list of options.
- SeparatorHorizontal or vertical visual divider.
- SheetSide-panel dialog with slide animation.
- SidebarCollapsible application sidebar navigation panel.
- SkeletonLoading placeholder with pulse animation.
- SliderNumeric range input with thumb control.
- SpinnerLoading spinner indicator.
- StackFlex layout primitive with configurable gap, direction, and alignment.
- Status DotSmall colored dot indicating presence or status.
- SwitchBinary toggle with on/off semantics.
- TableSimple static data table with header, body, rows, and cells.
- TabsTabbed content switcher.
- TextareaNative textarea primitive with validation states and optional auto-resizing.
- Time InputSegmented time entry with hour, minute, second fields and AM/PM toggle.
- ToastTemporary non-blocking notification.
- ToggleA two-state button that can be toggled on or off.
- Toggle GroupGroup of mutually-exclusive or multi-select toggle buttons.
- TokenizerTag/token input for managing multiple values with keyboard support.
- ToolbarGrouped actions and controls in a horizontal bar.
- TooltipContextual hint shown on hover/focus.
- TreeHierarchical tree view with expand/collapse.
- TypographySemantic text primitives for headings, paragraphs, and inline text.
- Virtual ListViewport-windowed list for large datasets.
- Visually HiddenHides content visually while keeping it accessible to screen readers.