ComboBox

Props

MultiComboBox props

NameRequiredTypeDefault ValueDescription
itemstrueItem<T>[]A list of items to choose from.
selectedItemstrue(Item<T> & { deletable?: boolean; })[]A list of items that have already been selected.
name-stringThe value of the input `name` attribute.
disabled-false, trueThe value of the input `disabled` attribute.
error-false, trueIf true, the outline of this component will be DANGER color.
creatable-false, trueIf true, you can add new item that do not exist in `items` props.
placeholder-stringThe value of the input `placeholder` attribute.
isLoading-false, trueIf `true`, a loader is displayed on the dropdown list.
width-string, numberThe value given to the width style of input.
className-stringThe `className` given to the outermost element of this component.
onChange-(e: ChangeEvent<HTMLInputElement>) => voidFire when the value of input changes. @deprecated The onChange handler is deprecated, so use onChangeInput handler instead.
onChangeInput-(e: ChangeEvent<HTMLInputElement>) => voidFire when the value of input changes.
onAdd-(label: string) => voidFire when adding an item that does not exist in `items` props.
onDelete-(item: Item<T>) => voidFire when clicking the delete element of `selectedItems` button.
onSelect-(item: Item<T>) => voidFire when clicking an element of `items`.
onChangeSelected-(selectedItems: Item<T>[]) => voidFire when the item selections are changed.

SingleComboBox props

NameRequiredTypeDefault ValueDescription
itemstrueItem<T>[]A list of items to choose from.
selectedItemtrueItem<T>An item that have already been selected.
name-stringThe value of the input `name` attribute.
disabled-false, trueThe value of the input `disabled` attribute.
error-false, trueIf true, the outline of this component will be DANGER color.
creatable-false, trueIf true, you can add new item that do not exist in `items` props.
placeholder-stringThe value of the input `placeholder` attribute.
isLoading-false, trueIf `true`, a loader is displayed on the dropdown list.
width-string, numberThe value given to the width style of input.
className-stringThe `className` given to the outermost element of this component.
onChange-(e: ChangeEvent<HTMLInputElement>) => voidFire when the value of input changes. @deprecated The onChange handler is deprecated, so use onChangeInput handler instead.
onChangeInput-(e: ChangeEvent<HTMLInputElement>) => voidFire when the value of input changes.
onAdd-(label: string) => voidFire when adding an item that does not exist in `items` props.
onSelect-(item: Item<T>) => voidFire when an item is selected.
onClear-() => voidFire when the selected item is cleared.
onChangeSelected-(selectedItem: Item<T>) => voidFire when the item selection is changed.
© 2021, SmartHR, Inc.