tb-vue3-typeahead

Install:

npm i tb-vue3-typeahead

Example:

<template>
    <Typeahead
        :data='data'
        :inputStyle="{
                backgroundColor: 'white',
                width: '460px',
                height: '35px',
                border: 'solid 1px black',
                fontSize: '20px'
            }"
        placeholder="Search..."
        @tb-typeahead-result="TbTypeaheadResult"
    >
    </Typeahead>
</template>

<script>

    import Typeahead from 'tb-vue3-typeahead';

    import { ref } from 'vue';

    export default {
        components: {
            Typeahead
        },
        setup() {

            const data = ref([
                'Avon',
                'Bedfordshire',
                'Berkshire',
                'Buckinghamshire',
                'Cambridgeshire',
                'Cheshire',
                'City of London',
                'Cleveland',
                'Cornwall',
                'Cumbria',
                'Derbyshire',
                'Devon',
                'Dorset',
                'Durham',
                'East Sussex',
                'Essex',
                'Gloucestershire',
                'Greater London',
                'Greater Manchester',
                'Hampshire',
                'Herefordshire',
                'Hertfordshire',
                'Isle of Wight',
                'Kent',
                'Lancashire',
                'Leicestershire',
                'Lincolnshire',
                'Merseyside',
                'Middlesex',
                'Norfolk',
                'Northamptonshire',
                'Northumberland',
                'North Humberside',
                'North Yorkshire',
                'Nottinghamshire',
                'Oxfordshire',
                'Rutland',
                'Shropshire',
                'Somerset',
                'South Humberside',
                'South Yorkshire',
                'Staffordshire',
                'Suffolk',
                'Surrey',
                'Tyne and Wear',
                'Warwickshire',
                'West Midlands',
                'West Sussex',
                'West Yorkshire',
                'Wiltshire',
                'Worcestershire'
            ]);

            function TbTypeaheadResult(result) {
                console.log(result)
            }
            return { data, TbTypeaheadResult}

        }
    }
</script>

Props:

   inputStyle: Style The Input Field
   
   ulStyle: Style The ul Tag For Results
   
   liStyle: Style The li Tags For Results