@volvo-cars/react-select

@volvo-cars/react-select

React components and hooks for building accessible dropdown select, combobox, and calendar-linked dropdown patterns, styled with @volvo-cars/css.

What's included

Components

• Dropdown — Root wrapper for a dropdown select or combobox
• DropdownInputField — Text input trigger for a combobox-style dropdown
• Trigger — Button trigger for opening a dropdown
• ListBox — The scrollable list of options within a dropdown
• Option — An individual selectable option
• OptionGroup — A labelled group of options within a ListBox
• CalendarDialog — A popover-style dialog wrapping a calendar for date-picker dropdowns
• CalendarFooter — Footer actions (e.g. confirm/clear) for a CalendarDialog

Hooks

• useDropdownSelect — Core state and interaction logic for a dropdown select
• useCombobox — State and interaction logic for a combobox (searchable select)
• useDropdownCalendar — State and interaction logic for a calendar-linked date-picker dropdown
• useListBoxFocusState — Tracks focus state within a ListBox

Installation

yarn add @volvo-cars/react-select

Documentation

Read the docs