51 lines
1.6 KiB
TypeScript
51 lines
1.6 KiB
TypeScript
import Choices from "choices.js";
|
|
|
|
const Select = (): void => {
|
|
// Pass single element
|
|
const selects: NodeListOf<HTMLSelectElement> = document.querySelectorAll(
|
|
"select:not([multiple])"
|
|
);
|
|
|
|
for (let i = 0; i < selects.length; i++) {
|
|
const select = selects[i];
|
|
|
|
new Choices(select, {
|
|
loadingText: select.dataset.loadingText,
|
|
itemSelectText: select.dataset.selectText,
|
|
maxItemText: select.dataset.maxItemText,
|
|
noChoicesText: select.dataset.noChoicesText,
|
|
noResultsText: select.dataset.noResultsText,
|
|
classNames: {
|
|
containerOuter: "choices",
|
|
containerInner: "choices__inner",
|
|
input: "choices__input",
|
|
inputCloned: "choices__input--cloned",
|
|
list: "choices__list",
|
|
listItems: "choices__list--multiple",
|
|
listSingle: "choices__list--single",
|
|
listDropdown: "choices__list--dropdown",
|
|
item: "choices__item",
|
|
itemSelectable: "choices__item--selectable",
|
|
itemDisabled: "choices__item--disabled",
|
|
itemChoice: "choices__item--choice",
|
|
placeholder: "choices__placeholder",
|
|
group: "choices__group",
|
|
groupHeading: "choices__heading",
|
|
button: "choices__button",
|
|
activeState: "is-active",
|
|
focusState: "is-focused",
|
|
openState: "is-open",
|
|
disabledState: "is-disabled",
|
|
highlightedState: "is-highlighted",
|
|
selectedState: "is-selected",
|
|
flippedState: "is-flipped",
|
|
loadingState: "is-loading",
|
|
noResults: "has-no-results",
|
|
noChoices: "has-no-choices",
|
|
},
|
|
});
|
|
}
|
|
};
|
|
|
|
export default Select;
|