Dropdown

Выпадающий список

<div class="ml-dropdown">
    <select data-dropdown>
        <option value="1">Москва</option>
        <option value="2">Санкт-Петербург</option>
        <option value="3">Алтайский край</option>
        <option value="Paris">Paris</option>
        <option value="Lyon">Lyon</option>
        <option value="Marseille">Marseille</option>
        <option value="Hamburg">Hamburg</option>
        <option value="Munich">Munich</option>
        <option value="Berlin">Berlin</option>
        <option value="New York">New York</option>
        <option value="Washington" disabled>Washington</option>
        <option value="Michigan">Michigan</option>
        <option value="Madrid">Madrid</option>
        <option value="Barcelona">Barcelona</option>
        <option value="Malaga">Malaga</option>
        <option value="Montreal">Montreal</option>
        <option value="Toronto">Toronto</option>
        <option value="Vancouver">Vancouver</option>
    </select>
</div>

npm репозиторий - [https://www.npmjs.com/package/@megalabs/ml-dropdown] (https://www.npmjs.com/package/@megalabs/ml-dropdown)

Для установки пакета

• npm i @megalabs/ml-dropdown
• затем в папке @megalabs/ml-dropdown запускаем npm install
• npm start

Расширенные настройки

Инициализация по атрибуту data-dropdown

В компоненте используется библиотека choices.js

    if (document.querySelector("[data-dropdown]")) {
        choices = new Choices('[data-dropdown]', {
            position: "down",
            searchEnabled: false,
            shouldSort: false
        });
    }

Документация

https://github.com/jshjohnson/Choices