0.0.3 • Published 7 years ago
react-custom-select v0.0.3
React Custom Select
React custom select gives you a simple boiler plate for fully customizable select/option groups without having to battle with native styles. Because it's a react component you can easily integrate it with an existing react project and pass in the options via the props.
Installation:
npm install react-custom-select
Usage & Installation:
- Install react-custom-select
- Include CustomSelect, set your options & callback and use.
- Done!
Example Usage:
/* Array of your selectOptions */
const selectOptions = [
{text: 'one', value: 1},
{text: 'two', value: 2},
{text: 'three', value:3},
{text: 'three', value:4, default: true}
];
/*
static propTypes = {
options: React.PropTypes.array.required,
onSelect: React.PropTypes.func
};
*/
<CustomSelect
options={selectOptions}
/>
<CustomSelect
options={selectOptions}
selectorShown
/>
Defining your default option (optional)
- By passing {default: true} you set that option to be the default selected
Defining your callback: (optional)
- This allows you to send a callback to when the value is changed.
Defining visibility
- By passing
selectorShown
to the component you set the default visibility (of the selector block) to visible.
<CustomSelect
options={selectOptions}
onSelect={(value) => this.updateForm(value)}
/>
Coming soon:
- Placeholders
Contributing
Everyone brings something to the party so please contribute.
If you have any suggestions give me a shout on twitter
1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D
Credits
Created and maintained by @rorykermack
License
WTFPL (100% Open Source)