SelectMulti

Interface of SelectMulti
🏗 Coming Soon

The SelectMulti component is an extension of the Select component that supports multiple selected values and has the following specific features:

  • The input field renders an underlying InputChips
  • An on-the-fly "Create" option allows the user to enter custom values (see showCreate prop)
  • Option list stays open by default so the user can select multiple options (see closeOnSelect prop)
  • Values can be cleared individually or all at once (does not use the Select component's isClearable prop)

showCreate

As with Select, the isFilterable prop allows the user to type in the input, triggering the onFilter callback, which should be used to narrow the options passed to the SelectMulti.

When isFilterable is true, use the showCreate prop along with the formatCreateLabel(defaults to 'Create "[input value]"') to allow the user to free-form values.

closeOnSelect

With the closeOnSelect prop, the option list closes after an option is selected.

freeInput

Use the freeInput prop when the user needs to be able to easily enter values not found in the list of options. This enables the inputting behavior of InputChips where values are separated by the enter key, comma, or tab or newline character when pasting.

removeOnBackspace

The removeOnBackspace prop inherits from InputChips.