Select
Select component.
import { Select } from '@redshank/native';
When To Use
- A dropdown menu for displaying choices - an elegant alternative to the native
selectelement. - Utilizing Radio is recommended when there are fewer total options (less than 5).
Examples
Default
Default select element.
Sizes
Sizes select element.
APIs
Select Props
Api props extends from RNPickerSelect
| Attribute | Type | Accepted values | Description | Default |
|---|---|---|---|---|
| background | ThemeColor | ThemeColor | Background color of the element | inputColor |
| borderInputColor | ThemeColor | ThemeColor | Border color of the element | border |
| color | ThemeColor | ThemeColor | Color of the element selected | accents2 |
| disabled | boolean | true false | Disabled or enable component | - |
| error | boolean | true false | Show error variant | - |
| items | SelectItem[] | SelectItem | Required list of the options | - |
| onChange | function | (value, index) => void | On change function trigger | - |
| size | SizeType | small middle large | Size of the select input | middle |
| type | RadioType | circle square | Circle or square variant | circle |
| value | string | Text | Value of the select input | - |
SelectItem
| Attribute | Type | Accepted values | Description | Default |
|---|---|---|---|---|
| key | string number | Text Number | Optional key for identify the option | - |
| label | string | Text | Text for show in the spinner | - |
| value | string | Text | Value for the select element | - |
Community:
We're excited to see the community adopt @redshank/native, raise issues, and provide feedback. Whether it's a feature request, bug report, or a project to showcase, please get involved!
DiscordGithubContributing:
PR's on @redshank/native are always welcome, please see our contribution guidelines to learn how you can contribute to this project.