Flexible select

Features

• 2 themes: Bootstrap 4 (equal styles), Material Design
• autocomplete (you can use custom search)
• keyboard controls (not only through the arrows)
• slots (13) allow content to be changed anywhere
• events (7) will let you know about everything
• props (24) allow you to customize a component in a variety of ways
• loading indicator (helpful for REST requests)
• validation, state of error and success
• support on mobile devices
• disabled and readonly
• smile and large sizes (as in bootstrap)
• ability to set styles for a component
• TypeScript support

Write your suggestions, glad to add.

Installation

yarn add vue-cool-select@^2.0.0 or npm install --save vue-cool-select@^2.0.0

Get started

1. Import and select a theme:

import VueSelect from 'vue-cool-select'

Vue.use(VueSelect, {
  theme: 'bootstrap' // or 'material-design'
})

2. Use inside another component:

import { CoolSelect } from 'vue-cool-select'

export default {
  components: { CoolSelect },
  data () {
    return {
      // simple example of items
      items: ['Item 1', 'Item 2', 'Item 3'],
      // there will be a selected item
      selected: null
    }
  }
}

3. Add to <template>:

<cool-select
  v-model="selected"
  :items="items"
/>

Documentation and examples here.