Period Comboboxes let the user choose one or more items from a list thats generated from a param passed in.
The period combobox is an input component, composed of a text field and a list, that displays one or more selected items as chips in the text field. Period Comboboxes let you restrict input to a pre-defined set of items, with modes for multiple or single selection.
This control behaves similarly to the Combobox but with inbuilt generation of the “item list” of periods based upon parameters passed in. Periods are defined as a number of days, weeks, months, and years. A user should be able to start typing the number and the control would filter the available periods accordingly.
Click or tap a period combobox to display its dropdown list which shows all the available items. Type in the text field to filter the items shown in the dropdown list. When the dropdown list is displayed, click or tap an item to select it.
Use a period combobox for an input field that allows one or more items to be selected from a list that was generated through a param. If you need to restrict input to a single item, use the period combobox in 'single' mode; This gives a behaviour equivalent to a Radio Group or Select instead.
Our components have been designed to comply with the WCAG 2.1 AA accessibility guidelines. For more information about how our design system complies with color-related accessibility guidelines, see Foundations > Colors > Accessibility.
Related components: