Skip to content

components/listbox

@fungi.computer/caps


@fungi.computer/caps / components/listbox

ListboxItemState = object

Intrinsic focus and selection state supplied when rendering a Listbox item.

active: boolean

disabled: boolean

selected: boolean


ListboxProps<T, Multiple> > = object & Omit<HTMLAttributes<HTMLDivElement>>, "defaultValue" | "onChange" | "onSelect" | "value">>

Props accepted by Listbox.

optional defaultValue?: ListboxValue<Multiple>>

optional emptyMessage?: ReactNode

getKey: (item) => string

Returns the stable key used for focus and selection.

T

string

getLabel: (item) => string

Returns the accessible label used for an item.

T

string

optional isDisabled?: (item) => boolean

Determines whether an item can receive focus or selection.

T

boolean

items: readonly T[]

optional multiple?: Multiple

optional onValueChange?: (value, item) => void

Receives the next value and selected item after local interaction.

ListboxValue<Multiple>

Multiple extends true ? T[] : null | T

void

optional renderItem?: (item, active, state) => ReactNode

Renders an item with its intrinsic focus and selection state.

T

boolean

ListboxItemState

ReactNode

optional value?: ListboxValue<Multiple>>

T

Multiple extends boolean = false


ListboxValue<Multiple> > = Multiple extends true ? string[] : null | string

Supported ListboxValue values.

Multiple extends boolean = false

const Listbox: <T, Multiple>>(props) => ReactElement

A selection primitive with caller-owned values and intrinsic keyboard navigation.

T

Multiple extends boolean = false

object & object & Omit<HTMLAttributes<HTMLDivElement>, "value" | "defaultValue" | "onChange" | "onSelect">

ReactElement