Autocomplete

Simple autocomplete Javascript Library

Install

npm i @avoristravel/autocomplete

Default options

new Autocomplete({
    input: null,
    defaultData: () => [],
    data: () => [],
    filters: ['filters'],
    threshold: 3,
    debounce: 500,
    onSelect: () => {},
    width: 'auto',
    popperOptions: {
        placement: 'bottom-start',
        modifiers: [
            {
                name: 'preventOverflow',
                options: {
                    padding: 16
                }
            }
        ]
    },
    template: {
        list: (items) => {
            return `<ul class="autocomplete-list" rol="listbox" tabindex="-1">${items}</ul>`
        },
        item: (item, index) => {
            return `<li class="autocomplete-item" tabindex="0" rol="option" data-index="${index}" data-value="${item}">${item}</li>`
        },
        noResults: (keyword) => {
            return `<div class="autocomplete-no-results" tabindex="0">No results with ${keyword}</div>`
        }
    }
})