@specialdoom/solid-rev-kit
Version:
RevKit UI implementation for SolidJS
53 lines (46 loc) • 2.17 kB
Markdown
```jsx
import { Select } from '@specialdoom/solid-rev-kit';
const Container = () => {
const selectOptions = [
{
label: '🥭 Mango',
value: 'Mango'
},
{
label: '🍊 Orange',
value: 'Orange'
},
{
label: '🍎 Apple',
value: 'Apple',
disabled: true
}
];
return (
<>
<Select options={selectOptions} />
<Select options={selectOptions} placeholder="Select placeholder" />
<Select options={selectOptions} defaultOption="Mango" />
<Select options={selectOptions} disabled />
<Select
options={selectOptions}
placeholder="Select disabled placeholder"
disabled
/>
<Select options={selectOptions} defaultOption="Mango" disabled />
</>
);
};
```
| Property | Description | Type | Default |
| ------------- | -------------------------------------------------------------- | ---------------------------------------------- | --------- |
| options | Options of select component | [SelectOption](https://tinyurl.com/3vmvxxsh)[] | [] |
| placeholder | Placeholder of select component | string | undefined |
| defaultOption | Default option of select component. Element from options array | string | undefined |
| disabled | Whether the select component is disabled | boolean | false |
| onSelect | Select option event handler | (value: string) => void | undefined |
| onChange | Change option event handler | (value: string) => void | undefined |
| onBlur | Blur event handler | (value: string) => void | undefined |