Home > @uniformdev/design-system > FilterMultiSelect

FilterMultiSelect() function

The value segment of a filter condition for multi-select criteria. Built on SearchableMenu — the typeahead appears when there are more than searchThreshold options (default 10). Selecting an option removes it from the list and adds an xs / neutral-light dismissable chip to a bordered fake-input container above the remaining options; the menu stays open until outside click or Escape. The trigger shows selected labels as comma-separated plain text. When that text is truncated, hovering the value shows the full list (wrapping). A caret can be placed between chips; Backspace on an empty caret deletes the preceding chip. Options carrying a group render under MenuGroup headers; their leadingSlot shows in the dropdown and on selected chips. When some options have a leading visual and others do not, empty icon slots keep dropdown labels and chips left-aligned.

Signature:

Parameters

Parameter

Type

Description

{ options, value, onChange, placeholder, searchPlaceholder, searchThreshold, alwaysShowSearch, truncateAt, disabled, defaultOpen, tooltip, maxMenuHeight, id, iconSize, onSearchChange, emptyMessage, "data-testid": dataTestId, }

(not declared)

input

FilterMultiSelectProps<TValue>

Returns:

_emotion_react_jsx_runtime.JSX.Element

Example

<>