52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import Choices from "choices.js";
|
|
|
|
const MultiSelect = (): void => {
|
|
// Pass single element
|
|
const multiSelects: NodeListOf<HTMLSelectElement> =
|
|
document.querySelectorAll("select[multiple]");
|
|
|
|
for (let i = 0; i < multiSelects.length; i++) {
|
|
const multiSelect = multiSelects[i];
|
|
|
|
new Choices(multiSelect, {
|
|
maxItemCount: parseInt(multiSelect.dataset.maxItemCount || "-1"),
|
|
loadingText: multiSelect.dataset.loadingText,
|
|
itemSelectText: multiSelect.dataset.selectText,
|
|
maxItemText: multiSelect.dataset.maxItemText,
|
|
noChoicesText: multiSelect.dataset.noChoicesText,
|
|
noResultsText: multiSelect.dataset.noResultsText,
|
|
removeItemButton: true,
|
|
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 MultiSelect;
|