tedir-select

Tedir Select is a Vue 3 & Web Component Custom SelectBox, ListBox, Taggable, etc.

Usage no npm install needed!

<script type="module">
  import tedirSelect from 'https://cdn.skypack.dev/tedir-select';
</script>

README

Tedir Select

Tedir Select is a Vue 3 and a Web Component Custom SelectBox, ComboBox Autocomplete, ListBox, and Tags Input.

Install & Usage

npm install tedir-select

or

yarn add tedir-select

Initialize it in the .vue file

<script setup>
import { ref, reactive } from 'vue'
import { SelectBox, ComboBox, ListBox, TagBox } from 'tedir-select'

const stateRef = ref('')
const options = reactive(['Option One', 'Option Two', 'Option Three'])
</script>

<template>
  <SelectBox v-model="stateRef" :options="options" placeholder="-- Select Option --" :size="5" />
</template>

Select box in string type

String SelectBox

Select box in object type

Object SelectBox

Select box in array of strings

Array of Strings SelectBox

Select box in array of objects

Array of Objects SelectBox

Combo box autocomplete in string and object

ComboBox Autocomplete

List box in string, object, array of strings and array of objects

ListBox