Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/richardcarls/react-native-paper-select
A select-like input component for projects leveraging react-native-paper.
https://github.com/richardcarls/react-native-paper-select
Last synced: about 1 month ago
JSON representation
A select-like input component for projects leveraging react-native-paper.
- Host: GitHub
- URL: https://github.com/richardcarls/react-native-paper-select
- Owner: richardcarls
- License: mit
- Created: 2023-07-30T14:09:52.000Z (over 1 year ago)
- Default Branch: dev
- Last Pushed: 2023-08-05T15:51:52.000Z (over 1 year ago)
- Last Synced: 2024-10-23T01:36:53.575Z (3 months ago)
- Language: TypeScript
- Size: 464 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# @rcarls/react-native-paper-select
A select-like input component for projects leveraging [react-native-paper](https://reactnativepaper.com/).
## What can it do?
- Single or multi-select input that supports `undefined` value
- Can be a controlled or uncontrolled input
- Easy to use with sensible defaults, react-native-paper theme support
- Accepts a render function for custom components
- Has `dropdown` or `modal` menu variants
- Default: `modal` in mobile environments, otherwise `dropdown`
- Options can be any collection, or simply an array of strings. For collections:
- Default: Use `value`, `key` or `id` keys for option values
- Default: Use `label` key for option label
- Also accepts functions to map options to values and labels
- `value` can be `undefined` with clear selection support
## Dependencies
- react-native
- react-native-vector-icons
- react-native-paper
## Installation
```sh
npm install @rcarls/react-native-paper-select
```
or
```sh
yarn add @rcarls/react-native-paper-select
```
## Usage
```js
import * as React from 'react';
import { PaperSelect } from '@rcarls/react-native-paper-select';
const options = ['one', 'two', 'three'];
const MyComponent = () => {
const [value, setValue] = React.useState('');
return (
setValue(option)}
/>
);
};
export default MyComponent;
```
## Try it out
You can run the example module by performing these steps:
```sh
yarn && yarn example web
```
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT
---
Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)