Select

A dropdown for displaying choices.

Examples

Basic example

Initial state set to open

Initial value set to the first two options

Disabled example

Trigger an alert on value change

Enable searching the options

Enable clearing all of the selected options with clear all button

Set the maximum number of selected items

Ignore the internal logic with static property

Prop	Description	Type	Default
component	If the value is false only children of the main component will be rendered	`boolean`	`false`
isStatic	If true the components becomes a shell and ignores all the internal logic	`boolean`	`false`
options	Select options	`{ id: string \| number, value: string }[]`	`[]`
open	Whether the select dropdown is visible or not	`boolean`	`false`
disabled	Whether the select is disabled	`boolean`	`false`
value	Selected value	`{ id: string \| number, value: string }`	`undefined`
defaultValue	Initial value	`{ id: string \| number, value: string }`	`undefined`
onChange	Triggers when the value is changed	`function`	`(value: { id: string \| number, value: string }) => {}`
onInputClick	Triggers when the input is clicked	`function`	`() => {}`
enableSearch	Whether searching the options is enabled	`boolean`	`false`
clearAll	Whether clear all selected options is enabled	`boolean`	`false`
maxSelectedItems	Number of maximum selected options allowed	`number`	`undefined`

Prop	Description	Type	Default
disabled	Whether the input is disabled	`boolean`	`false`
enableSearch	Whether searching the options is enabled	`boolean`	`false`
searchValue	Search value	`string`
onClearAll	Triggered when clear button is clicked	`function`	`() => {}`
clearAll	Whether clear all selected options is enabled	`boolean`	`false`

Prop	Description	Type	Default
onClick	Triggered when the item is clciked	`function`	`() => {}`

Prop	Description	Type	Default
areOptionsVisible	Whether the options are visible	`boolean`	`false`

Prop	Description	Type	Default
disabled	Whether the input is disabled	`boolean`	`false`
selected	Whether the input is selected	`boolean`	`false`
onClick	triggered when the option is clicked	`funtion`	`() => {}`