Select Box

yarn add @clayui/form

Select Box allows users to select multiple options and if needed the ability to reorder selected options.

Property	Type	Required	Default	Description
ariaLabels	{ reorderUp: string; reorderDown: string; }	false	{ reorderDown: 'Reorder Down', reorderUp: 'Reorder Up', }	Labels for aria attributes
buttonAlignment	'center' \| 'end'	false	'end'	Aligns the buttons used to reorder items relative to the Select Box.
items	Array<TItem>	true		Items to be displayed in the Select Box.
label	string	false		Label to be displayed above the Select Box.
multiple	boolean	false		Defines whether the Select Box supports selection of multiple items.
onItemsChange	(items: Array<TItem>) => void	false		Handler that triggers when the content of the items prop are changed caused by reordering of items.
onSelectChange	(val: Array<string>) => void	true		Handler that triggers when a new item is selected.
selectedIndexes	Array<number>	false		Selected indexes, most commonly used in combination with the Dual Listbox component
size	number	false		Amount of items that can fit inside the both Select Boxes before a scrollbar is introduced.
showArrows	boolean	false		Defines whether the component should render buttons that allow reordering of items.
value	string \| Array<string>	true		Value of the component.
spritemap	string	false		Path to the spritemap that Icon should use when referencing symbols.