ComboboxMultiSelect API

API reference docs for theComboboxMultiSelectcomponent. For examples and details on the usage of this component, visit the component demo page.

Props

Prop

Type

Description

Default

children

((menuState: { isMenuOpen: boolean }) => React.ReactNode) | React.ReactNode

Accepts either a React node or a render function. The render function provides the menu's state (isMenuOpen).

_

closeButtonPropsForMobile?

{ label: string, onClick: function, size: 'large' | 'standard' | 'small' }

If closeButtonPropsForMobile is provided then the mobile version of the component will have a close button

_

inputValue?

string

Value of the combobox input.

_

menuTrigger?

'focus'| 'input'

Interaction type to display the Combobox menu.

input

mobileFriendly?

boolean

Indicates if the opened element should be rendered as a Sheet in mobile viewports

true

onClearInput?

() => void

Function to be invoked for clearing the Combobox input value.

_

onInputChange

(value: string) => void

Function to be invoked when the input value changes.

_

onRemoveLast?

() => void

Function to remove the last item in the selection options list. Invoked when user presses backspace.

_

onSelectionChange

(option: object) => void

Function to be invoked when the selection changes.

_

popoverMatchReferenceWidth?

boolean

Match the width of the popover with the reference element.

false

popoverMaxHeight?

number

The max height of the popover.

356

popoverMaxWidth?

number

The max width of the popover.

400

popoverOffset?

number

The offset of the combobox popover.

4

popoverPlacement?

'bottom' | 'bottom-start' | 'bottom-end'

The placement of the popover relative to the combobox Input.

'bottom-start'

selectedKey

keyOf object

Key for identifying the selected option.

_

selectedOptions

object[] | undefined

Currently selected options from the list.

_

strategy?

'absolute' | 'fixed'

The strategy used to position the floating element.

'absolute'

titleForMobile?

string

On mobile ComboboxMultiSelect renders a Sheet component. If titleForMobile is provided then the Sheet will have a Header with title rendered

_