A dead simple dropdown component for React
JavaScript CSS HTML
Pull request Compare This branch is 4 commits ahead, 23 commits behind fraserxu:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dist
example
.babelrc
.gitignore
LICENSE
README.md
index.js
package.json
style.css

README.md

react-dropdown

NPM version Downloads

Simple Dropdown component for React, inspired by react-select Demo is available here

Why

  • The default HTML select element is hard to style
  • And sometime we also want grouped menus
  • if you want more advanced select, check react-select

Installation

$ npm install react-dropdown  --save

Changelog

If you want to support React version under v0.13, use react-dropdown@v0.6.1

Usage

Flat Array options

const options = [
  'one', 'two', 'three'
]

Object Array options

const options = [
  { value: 'one', label: 'One' },
  { value: 'two', label: 'Two' },
  {
   type: 'group', name: 'group1', items: [
     { value: 'three', label: 'Three' },
     { value: 'four', label: 'Four' }
   ]
  },
  {
   type: 'group', name: 'group2', items: [
     { value: 'five', label: 'Five' },
     { value: 'six', label: 'Six' }
   ]
  }
]

Monut

import Dropdown from 'react-dropdown'
const defaultOption = options[0]
<Dropdown options={options} onChange={this._onSelect} value={defaultOption} placeholder="Select an option" />

Check more examples in the example folder.

Run example

$ npm start

License

MIT | Build for CSViz project @Wiredcraft