EasyDropDown 4


EasyDropDown transforms the humble element into a blank canvas for your design and brand. As a drop-in enhancement, EasyDropDown maintains all the functionality and accessibility of a standard single-option select menu, while exposing a semantic DOM-structure that's easy to style and customize to the needs of your design.

EasyDropDown comes bundled with three ready-made themes which can be used as a starting point for custom styling.

Check out the demos to see what's possible. The source code for the demos can be found in the ./demos/ directory.

NB: If you are viewing the demos on a mobile device, you will see the device's native select UI as per the default configuration.

$3

- Respects the native element API*
- Full keyboard support (navigation, search and select)
- Emits native change events
- Enhanced placeholder support
- Form reset and validation support
- Collision detection
- Live updates
- Falls back to native UI on mobile devices
- CSS Modules support
- TypeScript/intellisense support
- ARIA-compliant-markup
- Support for IE9+, and all modern browsers.
- 9kb gzipped
- No third-party dependencies

*EasyDropDown does not support the multiple attribute.

#### Contents

- Installation
- Usage
- Single-instance instantiation
- Batch instantiation
- Placeholder Functionality
- Reading and Writing Values
- Anatomy of EasyDropDown
- Configuration Options
- Available Options
- API Methods
- React Example
- CSS Modules Example
- TypeScript Support
- Multiple Attribute Support

Installation

Firstly, install the package using your package manager of choice.

``
npm install easydropdown --save
`

#### Module Import

You may then import the easydropdown() factory function into your project's modules.

`js
// ES Modules
import easydropdown from 'easydropdown';

// CommonJS
const easydropdown = require('easydropdown');

// AMD/RequireJS
define(['easydropdown/bundles/easydropdown.js'] , easydropdown => {
...
});
`

#### Script Tag

Alternatively, for basic projects without modular scoping or a build process, the most simple way to use EasyDropDown is via a