https://github.com/vue-a11y/vue-accessible-multiselect

Vue.js accessible multiselect component
https://github.com/vue-a11y/vue-accessible-multiselect

a11y accessible hacktoberfest multiselect select vue vue-accessible-multiselect vuejs

Last synced: 3 months ago
JSON representation

Vue.js accessible multiselect component

• Host: GitHub
• URL: https://github.com/vue-a11y/vue-accessible-multiselect
• Owner: vue-a11y
• License: mit
• Created: 2019-10-14T09:39:00.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2022-12-14T20:35:40.000Z (over 1 year ago)
• Last Synced: 2024-03-26T12:45:45.839Z (3 months ago)
• Topics: a11y, accessible, hacktoberfest, multiselect, select, vue, vue-accessible-multiselect, vuejs
• Language: JavaScript
• Homepage: https://multiselect.vue-a11y.com/
• Size: 1.85 MB
• Stars: 13
• Watchers: 2
• Forks: 3
• Open Issues: 24
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Lists

• awesome-access - vue-accessible-multiselect - Vue.js accessible multiselect component made according to WAI-ARIA practices. (Components and plugins / Courses)

README

        
# vue-accessible-multiselect

Vue.js accessible multiselect component made according to [WAI-ARIA practices](https://www.w3.org/TR/wai-aria-practices/#Listbox).

## Features

- ♿️ fully accessible to screen readers;

- ⌨️ supports keyboard navigation (there really a lot of keyboard shortcuts);

- 🔣 type-ahead to focus option that starts with typed symbols;

- 💅 style agnostic, so you can style it whatever you like (but including `core.scss` is highly encouraged).

## Links

- [Documentation](https://multiselect.vue-a11y.com)

- [Demo - Edit on codesandbox](https://codesandbox.io/s/vue-accessible-multiselect-u7rdh)

## Tests

### Unit

[`Jest`](https://jestjs.io) and [`VueTestUtils`](https://vue-test-utils.vuejs.org) is used for unit tests.

You can run unit tests by running next command:

```bash

npm run test:unit

```

## Development

1. Clone this repository

2. Install dependencies using `yarn install` or `npm install`

3. Start development server using `npm run dev`

## Build

1. To build production ready build simply run `npm run build`:

After successful build the following `dist` folder will be generated:

```

├── styles

│   ├── themes

│   │   ├── default.css

│   ├── core.css

├── vue-accessible-multiselect.common.js

├── vue-accessible-multiselect.esm.js

├── vue-accessible-multiselect.js

├── vue-accessible-multiselect.min.js

```

## Powered by

- `Rollup` (and plugins)

- `Babel`

- `SASS` and `node-sass`

- `PostCSS`

- `Autoprefixer`

- `Jest`

- `Vue Test Utils`

- `keycode-js`

- `lodash`

## License

[MIT](http://opensource.org/licenses/MIT)