BetaPublic beta — Read the release notes
Solidiom
Get Started
Documentation

Listbox

Single or multi-select list of options.

Package
@solidiom/listbox
Version
0.0.1-next.0
Status
stable

Generated from the package's public source.

API

Itemcomponent

@solidiom/listbox — Headless listbox primitive with selection and keyboard navigation. Parts: Root, Item.

                        Item(props: ListboxItemProps): Element

Props

disabled?
boolean — Disabled state.
textValue?
string — Text for typeahead matching. Defaults to value.
value
string — Unique value for this item.

children: Element

View source

ListboxItemPropsinterface

Props for a listbox item.

Props

disabled?
boolean — Disabled state.
textValue?
string — Text for typeahead matching. Defaults to value.
value
string — Unique value for this item.

children: Element

View source

ListboxReasontype

View source

ListboxRootPropsinterface

Props for the listbox root element.

Props

aria-label?
string — Accessible name for the listbox.
class?
string
defaultValue?
string[] — Default value (uncontrolled).
disabled?
Accessor<boolean> — Disabled state.
loop?
boolean — Whether navigation loops. Default: true.
onValueChange?
(value: string[], details: ChangeDetails<ListboxReason>) => void — Called when value change is requested.
orientation?
"horizontal" | "vertical" — Orientation for keyboard navigation. Default: "vertical".
ref?
(el: HTMLDivElement) => void
selectionMode?
ListboxSelectionMode — Selection mode. Default: "single".
style?
string | CSSProperties
value?
Accessor<string[]> — Controlled value.

children: Element

View source

ListboxSelectionModetype

View source

Rootcomponent

@solidiom/listbox — Headless listbox primitive with selection and keyboard navigation. Parts: Root, Item.

                        Root(props: ListboxRootProps): Element

Props

aria-label?
string — Accessible name for the listbox.
class?
string
defaultValue?
string[] — Default value (uncontrolled).
disabled?
Accessor<boolean> — Disabled state.
loop?
boolean — Whether navigation loops. Default: true.
onValueChange?
(value: string[], details: ChangeDetails<ListboxReason>) => void — Called when value change is requested.
orientation?
"horizontal" | "vertical" — Orientation for keyboard navigation. Default: "vertical".
ref?
(el: HTMLDivElement) => void
selectionMode?
ListboxSelectionMode — Selection mode. Default: "single".
style?
string | CSSProperties
value?
Accessor<string[]> — Controlled value.

children: Element

View source