React Native Select dropdown

rn-select-dropdown is a customized select menu for react native that works for android and ios platforms.

Installation

# Using npm

npm i @mamodesaebsaad/rn-select-dropdown

Usage

import Select from "@mamodesaebsaad/rn-select-dropdown";
...
const [value, setValue] = React.useState();
...
<Select title="Currency"
        data={["£", "$", "MUR", "€"]}
        value={value}
        onChangeValue={setValue}
        search={true}
        closeButton={true}
        searchBoxContainer={{ borderWidth: 0, backgroundColor: '#f5f5f5' }}
        searchTextInputStyle={{ backgroundColor: 'white' }}
        buttonStyle={{ backgroundColor: 'red', borderWidth: 0 }}
        buttonTextStyle={{ color: 'white' }}
/>

Props

• data
• value
• onChangeValue
• search
• closeButton
• searchBoxContainer
• searchTextInputStyle
• buttonStyle
• buttonTextStyle

data

array of data that will be represented in dropdown

| Type | Required | | ---- | -------- | | array | Yes |

value

value of the selected option

| Type | Required | | ---- | -------- | | string | Yes |

onChangeValue

Method onChange

| Type | Required | | ---- | -------- | | Hook (useState) | Yes |

search

Enable/Disable Search in the dropdown

| Type | Required | | ---- | -------- | | boolean | Yes |

closeButton

Enable/Disable close button in the dropdown

| Type | Required | | ---- | -------- | | boolean | Yes |

searchBoxContainer

Styling of the SearchBox Container

| Type | Required | | ---- | -------- | | object | No |

searchTextInputStyle

Styling of the SearchBox Input style

| Type | Required | | ---- | -------- | | object | No |

buttonStyle

Styling of the close button style in the dropdown

| Type | Required | | ---- | -------- | | object | No |

buttonTextStyle

Styling of the close button text style in the dropdown

| Type | Required | | ---- | -------- | | object | No |