@cnvrg/vue-selector

selector

Usage no npm install needed!

<script type="module">
  import cnvrgVueSelector from 'https://cdn.skypack.dev/@cnvrg/vue-selector';
</script>

README

selector

requirements:

  • Provide a single component to for selectors
  • Be customizable enough to provide all our needs

features:

  • multiple select (tags) or single select (same appearance but only one value enabled)

  • virtual scroller

  • search

  • slots

    • input
    • place for footer:
      • default - get title, icon, explanation, read more link from props
      • template
    • option
      • default - label (with a checkbox)
      • template - gets current item, onToggle function, isSelected
    • no results
      • nothing - will show "No Results Found"
      • label
      • template

  • api :

    • callback for select/unselect (parameter - the new selected set for multiple, the single object key for single)
    • value - the current select value (set/selected)
    • search input - value/on-change
    • styles
    • callbacks
    • classes

future options:

  • group by selector (e.g commits - see the whole list, group by experiment, user...)
    • the dev will need to supply group by function for each of the options
  • handling keyboard arrows, enter,
    • e.g left, right will move in the search input, up/down will move between options, enter will select an option