Listbox

Forms

A list of selectable items displayed inline. Use listbox when options should always be visible and users benefit from seeing all choices at once.

Import

import { Listbox, ListboxItem } from "@/components/ui/listbox";

Usage

Single Selection

Standard listbox with single selection

Category
  • In-Wall Speakers
    Wall-mounted speakers
  • In-Ceiling Speakers
    Ceiling-mounted speakers
  • Outdoor Speakers
    Weather-resistant

Multiple Selection

Listbox allowing multiple selections

Select Features
  • WiFi Connectivity
  • Bluetooth
  • AirPlay 2
  • Chromecast Built-in

With Disabled Items

Listbox with some disabled options

Stock Status
  • Available
  • On Backorder
  • Discontinued

API Reference

PropTypeDefaultDescription
valuestring | string[]Controlled selected value(s)
defaultValuestring | string[]Default selected value(s) (uncontrolled)
onValueChange(value: string | string[]) => voidHandler called when selection changes
multiplebooleanfalseAllow multiple selections
labelstringLabel text displayed above the listbox

Related Components