https://github.com/alexcarpenter/butane-combobox

🔍 An accessible combobox/autocomplete library
https://github.com/alexcarpenter/butane-combobox

accessibility autocomplete combobox

Last synced: 3 months ago
JSON representation

🔍 An accessible combobox/autocomplete library

• Host: GitHub
• URL: https://github.com/alexcarpenter/butane-combobox
• Owner: alexcarpenter
• Created: 2019-10-17T12:30:48.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-09T22:29:20.000Z (about 2 years ago)
• Last Synced: 2024-10-15T07:12:57.471Z (4 months ago)
• Topics: accessibility, autocomplete, combobox
• Language: JavaScript
• Homepage: https://butane-combobox.netlify.com/
• Size: 579 KB
• Stars: 7
• Watchers: 2
• Forks: 0
• Open Issues: 25
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# butane-combobox

> An accessible combobox/autocomplete library

## Install

```bash

$ npm install butane-combobox --save

```

## Usage

```html



  Search

  

    Red

    Blue

    Green

    Purple

  



```


```js

import ButaneCombobox from 'butane-combobox';

const element = document.querySelector('.combobox');

new ButaneCombobox(element);

```

## Options

### showOnClick

When the input is clicked, show options list immediately.

```js

new ButaneCombobox(element, {

  showOnClick: true,

});

```

### onSelectedOption

Returns the selected option.

```js

new ButaneCombobox(element, {

  onSelectOption: option => console.log(option),

});

```

### onShowMenu

Callback for when the menu is shown.

```js

new ButaneCombobox(element, {

  onShowMenu: () => console.log('Menu shown'),

});

```

### onHideMenu

Callback for when the menu is hidden.

```js

new ButaneCombobox(element, {

  onHideMenu: () => console.log('Menu hidden'),

});

```

## License

MIT License © [Alex Carpenter](https://alexcarpenter.me)