This commit is contained in:
Xon 2026-01-05 02:56:50 +00:00
commit b0911cdfd3
29 changed files with 1378 additions and 796 deletions

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 14 KiB

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@ -217,9 +217,6 @@
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -251,6 +248,26 @@
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -418,6 +435,12 @@
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -883,7 +906,9 @@
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -929,6 +954,7 @@
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -956,6 +982,7 @@
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -971,6 +998,7 @@
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -979,7 +1007,9 @@
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1280,7 +1310,8 @@
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1338,9 +1369,9 @@
function _defineProperty(e, r, t) {
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
value: t,
enumerable: !0,
configurable: !0,
writable: !0
enumerable: true,
configurable: true,
writable: true
}) : e[r] = t, e;
}
function ownKeys(e, r) {
@ -1356,7 +1387,7 @@
function _objectSpread2(e) {
for (var r = 1; r < arguments.length; r++) {
var t = null != arguments[r] ? arguments[r] : {};
r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
_defineProperty(e, r, t[r]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
@ -1368,7 +1399,7 @@
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r || "default");
var i = e.call(t, r);
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
@ -1391,16 +1422,13 @@
function isArray(value) {
return !Array.isArray ? getTag(value) === '[object Array]' : Array.isArray(value);
}
// Adapted from: https://github.com/lodash/lodash/blob/master/.internal/baseToString.js
const INFINITY = 1 / 0;
function baseToString(value) {
// Exit early for strings to avoid a performance hit in some environments.
if (typeof value == 'string') {
return value;
}
let result = value + '';
return result == '0' && 1 / value == -INFINITY ? '-0' : result;
return result == '0' && 1 / value == -Infinity ? '-0' : result;
}
function toString(value) {
return value == null ? '' : baseToString(value);
@ -1436,7 +1464,6 @@
function getTag(value) {
return value == null ? value === undefined ? '[object Undefined]' : '[object Null]' : Object.prototype.toString.call(value);
}
const EXTENDED_SEARCH_UNAVAILABLE = 'Extended search is not available';
const INCORRECT_INDEX_TYPE = "Incorrect 'index' type";
const LOGICAL_SEARCH_INVALID_QUERY_FOR_KEY = key => `Invalid value for key ${key}`;
const PATTERN_LENGTH_TOO_LARGE = max => `Pattern length exceeds max of ${max}.`;
@ -2690,9 +2717,7 @@
class Fuse {
constructor(docs, options = {}, index) {
this.options = _objectSpread2(_objectSpread2({}, Config), options);
if (this.options.useExtendedSearch && !true) {
throw new Error(EXTENDED_SEARCH_UNAVAILABLE);
}
if (this.options.useExtendedSearch && false) ;
this._keyStore = new KeyStore(this.options.keys);
this.setCollection(docs, index);
}
@ -3024,7 +3049,7 @@
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -3131,8 +3156,9 @@
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -3237,6 +3263,7 @@
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -3406,7 +3433,7 @@
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -3446,6 +3473,8 @@
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -3552,7 +3581,7 @@
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3567,7 +3596,7 @@
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3577,7 +3606,7 @@
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3589,7 +3618,7 @@
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3644,6 +3673,11 @@
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -3652,6 +3686,7 @@
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -3664,9 +3699,8 @@
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -3924,7 +3958,7 @@
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -4007,13 +4041,7 @@
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -4023,11 +4051,16 @@
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -4037,16 +4070,20 @@
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -4056,7 +4093,7 @@
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -4065,7 +4102,7 @@
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -4075,12 +4112,12 @@
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -4094,9 +4131,7 @@
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -4206,23 +4241,12 @@
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -4238,7 +4262,7 @@
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -4427,7 +4451,7 @@
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -4439,12 +4463,12 @@
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -4495,6 +4519,7 @@
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -4532,12 +4557,21 @@
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -4555,6 +4589,10 @@
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -4804,7 +4842,7 @@
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -4913,7 +4951,7 @@
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -4937,6 +4975,27 @@
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -4945,12 +5004,7 @@
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -4991,9 +5045,10 @@
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -5006,7 +5061,7 @@
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -5121,24 +5176,24 @@
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -5221,7 +5276,7 @@
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

File diff suppressed because one or more lines are too long

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/******************************************************************************
Copyright (c) Microsoft Corporation.
@ -211,9 +211,6 @@ var strToEl = (function () {
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -245,6 +242,26 @@ var unwrapStringForEscaped = function (s) {
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -412,6 +429,12 @@ var Container = /** @class */ (function () {
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -877,7 +900,9 @@ var WrappedSelect = /** @class */ (function (_super) {
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -923,6 +948,7 @@ var DEFAULT_CLASSNAMES = {
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -950,6 +976,7 @@ var DEFAULT_CONFIG = {
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -965,6 +992,7 @@ var DEFAULT_CONFIG = {
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -973,7 +1001,9 @@ var DEFAULT_CONFIG = {
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1274,7 +1304,8 @@ var Store = /** @class */ (function () {
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1332,9 +1363,9 @@ var NoticeTypes = {
function _defineProperty(e, r, t) {
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
value: t,
enumerable: !0,
configurable: !0,
writable: !0
enumerable: true,
configurable: true,
writable: true
}) : e[r] = t, e;
}
function ownKeys(e, r) {
@ -1350,7 +1381,7 @@ function ownKeys(e, r) {
function _objectSpread2(e) {
for (var r = 1; r < arguments.length; r++) {
var t = null != arguments[r] ? arguments[r] : {};
r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
_defineProperty(e, r, t[r]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
@ -1362,7 +1393,7 @@ function _toPrimitive(t, r) {
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r || "default");
var i = e.call(t, r);
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
@ -1385,16 +1416,13 @@ function _toPropertyKey(t) {
function isArray(value) {
return !Array.isArray ? getTag(value) === '[object Array]' : Array.isArray(value);
}
// Adapted from: https://github.com/lodash/lodash/blob/master/.internal/baseToString.js
const INFINITY = 1 / 0;
function baseToString(value) {
// Exit early for strings to avoid a performance hit in some environments.
if (typeof value == 'string') {
return value;
}
let result = value + '';
return result == '0' && 1 / value == -INFINITY ? '-0' : result;
return result == '0' && 1 / value == -Infinity ? '-0' : result;
}
function toString(value) {
return value == null ? '' : baseToString(value);
@ -1430,7 +1458,6 @@ function isBlank(value) {
function getTag(value) {
return value == null ? value === undefined ? '[object Undefined]' : '[object Null]' : Object.prototype.toString.call(value);
}
const EXTENDED_SEARCH_UNAVAILABLE = 'Extended search is not available';
const INCORRECT_INDEX_TYPE = "Incorrect 'index' type";
const LOGICAL_SEARCH_INVALID_QUERY_FOR_KEY = key => `Invalid value for key ${key}`;
const PATTERN_LENGTH_TOO_LARGE = max => `Pattern length exceeds max of ${max}.`;
@ -2684,9 +2711,7 @@ function format(results, docs, {
class Fuse {
constructor(docs, options = {}, index) {
this.options = _objectSpread2(_objectSpread2({}, Config), options);
if (this.options.useExtendedSearch && !true) {
throw new Error(EXTENDED_SEARCH_UNAVAILABLE);
}
if (this.options.useExtendedSearch && false) ;
this._keyStore = new KeyStore(this.options.keys);
this.setCollection(docs, index);
}
@ -3018,7 +3043,7 @@ var assignCustomProperties = function (el, choice, withCustomProperties) {
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -3125,8 +3150,9 @@ var templates = {
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -3231,6 +3257,7 @@ var templates = {
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -3400,7 +3427,7 @@ var Choices = /** @class */ (function () {
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -3440,6 +3467,8 @@ var Choices = /** @class */ (function () {
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -3546,7 +3575,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3561,7 +3590,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3571,7 +3600,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3583,7 +3612,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3638,6 +3667,11 @@ var Choices = /** @class */ (function () {
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -3646,6 +3680,7 @@ var Choices = /** @class */ (function () {
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -3658,9 +3693,8 @@ var Choices = /** @class */ (function () {
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -3918,7 +3952,7 @@ var Choices = /** @class */ (function () {
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -4001,13 +4035,7 @@ var Choices = /** @class */ (function () {
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -4017,11 +4045,16 @@ var Choices = /** @class */ (function () {
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -4031,16 +4064,20 @@ var Choices = /** @class */ (function () {
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -4050,7 +4087,7 @@ var Choices = /** @class */ (function () {
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -4059,7 +4096,7 @@ var Choices = /** @class */ (function () {
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -4069,12 +4106,12 @@ var Choices = /** @class */ (function () {
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -4088,9 +4125,7 @@ var Choices = /** @class */ (function () {
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -4200,23 +4235,12 @@ var Choices = /** @class */ (function () {
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -4232,7 +4256,7 @@ var Choices = /** @class */ (function () {
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -4421,7 +4445,7 @@ var Choices = /** @class */ (function () {
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -4433,12 +4457,12 @@ var Choices = /** @class */ (function () {
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -4489,6 +4513,7 @@ var Choices = /** @class */ (function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -4526,12 +4551,21 @@ var Choices = /** @class */ (function () {
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -4549,6 +4583,10 @@ var Choices = /** @class */ (function () {
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -4798,7 +4836,7 @@ var Choices = /** @class */ (function () {
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -4907,7 +4945,7 @@ var Choices = /** @class */ (function () {
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -4931,6 +4969,27 @@ var Choices = /** @class */ (function () {
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -4939,12 +4998,7 @@ var Choices = /** @class */ (function () {
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -4985,9 +5039,10 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -5000,7 +5055,7 @@ var Choices = /** @class */ (function () {
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -5115,24 +5170,24 @@ var Choices = /** @class */ (function () {
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -5215,7 +5270,7 @@ var Choices = /** @class */ (function () {
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@ -217,9 +217,6 @@
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -251,6 +248,26 @@
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -418,6 +435,12 @@
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -883,7 +906,9 @@
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -929,6 +954,7 @@
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -956,6 +982,7 @@
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -971,6 +998,7 @@
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -979,7 +1007,9 @@
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1280,7 +1310,8 @@
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1338,9 +1369,9 @@
function _defineProperty(e, r, t) {
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
value: t,
enumerable: !0,
configurable: !0,
writable: !0
enumerable: true,
configurable: true,
writable: true
}) : e[r] = t, e;
}
function ownKeys(e, r) {
@ -1356,7 +1387,7 @@
function _objectSpread2(e) {
for (var r = 1; r < arguments.length; r++) {
var t = null != arguments[r] ? arguments[r] : {};
r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
_defineProperty(e, r, t[r]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
@ -1368,7 +1399,7 @@
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r || "default");
var i = e.call(t, r);
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
@ -1391,16 +1422,13 @@
function isArray(value) {
return !Array.isArray ? getTag(value) === '[object Array]' : Array.isArray(value);
}
// Adapted from: https://github.com/lodash/lodash/blob/master/.internal/baseToString.js
const INFINITY = 1 / 0;
function baseToString(value) {
// Exit early for strings to avoid a performance hit in some environments.
if (typeof value == 'string') {
return value;
}
let result = value + '';
return result == '0' && 1 / value == -INFINITY ? '-0' : result;
return result == '0' && 1 / value == -Infinity ? '-0' : result;
}
function toString(value) {
return value == null ? '' : baseToString(value);
@ -2269,7 +2297,7 @@
class Fuse {
constructor(docs, options = {}, index) {
this.options = _objectSpread2(_objectSpread2({}, Config), options);
if (this.options.useExtendedSearch && !false) {
if (this.options.useExtendedSearch && true) {
throw new Error(EXTENDED_SEARCH_UNAVAILABLE);
}
this._keyStore = new KeyStore(this.options.keys);
@ -2542,7 +2570,7 @@
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -2649,8 +2677,9 @@
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -2755,6 +2784,7 @@
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -2924,7 +2954,7 @@
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -2964,6 +2994,8 @@
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -3070,7 +3102,7 @@
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3085,7 +3117,7 @@
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3095,7 +3127,7 @@
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3107,7 +3139,7 @@
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3162,6 +3194,11 @@
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -3170,6 +3207,7 @@
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -3182,9 +3220,8 @@
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -3442,7 +3479,7 @@
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -3525,13 +3562,7 @@
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -3541,11 +3572,16 @@
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -3555,16 +3591,20 @@
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -3574,7 +3614,7 @@
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -3583,7 +3623,7 @@
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -3593,12 +3633,12 @@
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -3612,9 +3652,7 @@
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -3724,23 +3762,12 @@
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -3756,7 +3783,7 @@
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -3945,7 +3972,7 @@
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -3957,12 +3984,12 @@
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -4013,6 +4040,7 @@
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -4050,12 +4078,21 @@
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -4073,6 +4110,10 @@
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -4322,7 +4363,7 @@
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -4431,7 +4472,7 @@
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -4455,6 +4496,27 @@
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -4463,12 +4525,7 @@
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -4509,9 +4566,10 @@
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -4524,7 +4582,7 @@
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -4639,24 +4697,24 @@
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -4739,7 +4797,7 @@
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

File diff suppressed because one or more lines are too long

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/******************************************************************************
Copyright (c) Microsoft Corporation.
@ -211,9 +211,6 @@ var strToEl = (function () {
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -245,6 +242,26 @@ var unwrapStringForEscaped = function (s) {
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -412,6 +429,12 @@ var Container = /** @class */ (function () {
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -877,7 +900,9 @@ var WrappedSelect = /** @class */ (function (_super) {
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -923,6 +948,7 @@ var DEFAULT_CLASSNAMES = {
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -950,6 +976,7 @@ var DEFAULT_CONFIG = {
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -965,6 +992,7 @@ var DEFAULT_CONFIG = {
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -973,7 +1001,9 @@ var DEFAULT_CONFIG = {
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1274,7 +1304,8 @@ var Store = /** @class */ (function () {
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1332,9 +1363,9 @@ var NoticeTypes = {
function _defineProperty(e, r, t) {
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
value: t,
enumerable: !0,
configurable: !0,
writable: !0
enumerable: true,
configurable: true,
writable: true
}) : e[r] = t, e;
}
function ownKeys(e, r) {
@ -1350,7 +1381,7 @@ function ownKeys(e, r) {
function _objectSpread2(e) {
for (var r = 1; r < arguments.length; r++) {
var t = null != arguments[r] ? arguments[r] : {};
r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
_defineProperty(e, r, t[r]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
@ -1362,7 +1393,7 @@ function _toPrimitive(t, r) {
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r || "default");
var i = e.call(t, r);
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
@ -1385,16 +1416,13 @@ function _toPropertyKey(t) {
function isArray(value) {
return !Array.isArray ? getTag(value) === '[object Array]' : Array.isArray(value);
}
// Adapted from: https://github.com/lodash/lodash/blob/master/.internal/baseToString.js
const INFINITY = 1 / 0;
function baseToString(value) {
// Exit early for strings to avoid a performance hit in some environments.
if (typeof value == 'string') {
return value;
}
let result = value + '';
return result == '0' && 1 / value == -INFINITY ? '-0' : result;
return result == '0' && 1 / value == -Infinity ? '-0' : result;
}
function toString(value) {
return value == null ? '' : baseToString(value);
@ -2263,7 +2291,7 @@ function format(results, docs, {
class Fuse {
constructor(docs, options = {}, index) {
this.options = _objectSpread2(_objectSpread2({}, Config), options);
if (this.options.useExtendedSearch && !false) {
if (this.options.useExtendedSearch && true) {
throw new Error(EXTENDED_SEARCH_UNAVAILABLE);
}
this._keyStore = new KeyStore(this.options.keys);
@ -2536,7 +2564,7 @@ var assignCustomProperties = function (el, choice, withCustomProperties) {
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -2643,8 +2671,9 @@ var templates = {
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -2749,6 +2778,7 @@ var templates = {
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -2918,7 +2948,7 @@ var Choices = /** @class */ (function () {
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -2958,6 +2988,8 @@ var Choices = /** @class */ (function () {
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -3064,7 +3096,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3079,7 +3111,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -3089,7 +3121,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3101,7 +3133,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -3156,6 +3188,11 @@ var Choices = /** @class */ (function () {
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -3164,6 +3201,7 @@ var Choices = /** @class */ (function () {
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -3176,9 +3214,8 @@ var Choices = /** @class */ (function () {
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -3436,7 +3473,7 @@ var Choices = /** @class */ (function () {
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -3519,13 +3556,7 @@ var Choices = /** @class */ (function () {
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -3535,11 +3566,16 @@ var Choices = /** @class */ (function () {
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -3549,16 +3585,20 @@ var Choices = /** @class */ (function () {
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -3568,7 +3608,7 @@ var Choices = /** @class */ (function () {
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -3577,7 +3617,7 @@ var Choices = /** @class */ (function () {
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -3587,12 +3627,12 @@ var Choices = /** @class */ (function () {
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -3606,9 +3646,7 @@ var Choices = /** @class */ (function () {
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -3718,23 +3756,12 @@ var Choices = /** @class */ (function () {
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -3750,7 +3777,7 @@ var Choices = /** @class */ (function () {
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -3939,7 +3966,7 @@ var Choices = /** @class */ (function () {
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -3951,12 +3978,12 @@ var Choices = /** @class */ (function () {
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -4007,6 +4034,7 @@ var Choices = /** @class */ (function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -4044,12 +4072,21 @@ var Choices = /** @class */ (function () {
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -4067,6 +4104,10 @@ var Choices = /** @class */ (function () {
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -4316,7 +4357,7 @@ var Choices = /** @class */ (function () {
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -4425,7 +4466,7 @@ var Choices = /** @class */ (function () {
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -4449,6 +4490,27 @@ var Choices = /** @class */ (function () {
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -4457,12 +4519,7 @@ var Choices = /** @class */ (function () {
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -4503,9 +4560,10 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -4518,7 +4576,7 @@ var Choices = /** @class */ (function () {
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -4633,24 +4691,24 @@ var Choices = /** @class */ (function () {
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -4733,7 +4791,7 @@ var Choices = /** @class */ (function () {
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@ -208,9 +208,6 @@
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -242,6 +239,26 @@
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -409,6 +426,12 @@
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -874,7 +897,9 @@
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -920,6 +945,7 @@
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -947,6 +973,7 @@
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -962,6 +989,7 @@
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -970,7 +998,9 @@
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1271,7 +1301,8 @@
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1385,11 +1416,12 @@
var field = this._fields[k];
if (field in obj && kmpSearch(needle, obj[field].toLowerCase()) !== -1) {
results.push({
item: obj[field],
item: obj,
score: count,
rank: count + 1,
});
count++;
break;
}
}
}
@ -1425,7 +1457,7 @@
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -1532,8 +1564,9 @@
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -1638,6 +1671,7 @@
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -1807,7 +1841,7 @@
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -1847,6 +1881,8 @@
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -1953,7 +1989,7 @@
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1968,7 +2004,7 @@
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1978,7 +2014,7 @@
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -1990,7 +2026,7 @@
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -2045,6 +2081,11 @@
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -2053,6 +2094,7 @@
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -2065,9 +2107,8 @@
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -2325,7 +2366,7 @@
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -2408,13 +2449,7 @@
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -2424,11 +2459,16 @@
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -2438,16 +2478,20 @@
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -2457,7 +2501,7 @@
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -2466,7 +2510,7 @@
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -2476,12 +2520,12 @@
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -2495,9 +2539,7 @@
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -2607,23 +2649,12 @@
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -2639,7 +2670,7 @@
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -2828,7 +2859,7 @@
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -2840,12 +2871,12 @@
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -2896,6 +2927,7 @@
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -2933,12 +2965,21 @@
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -2956,6 +2997,10 @@
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -3205,7 +3250,7 @@
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -3314,7 +3359,7 @@
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -3338,6 +3383,27 @@
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -3346,12 +3412,7 @@
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -3392,9 +3453,10 @@
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -3407,7 +3469,7 @@
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -3522,24 +3584,24 @@
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -3622,7 +3684,7 @@
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

File diff suppressed because one or more lines are too long

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/******************************************************************************
Copyright (c) Microsoft Corporation.
@ -202,9 +202,6 @@ var strToEl = (function () {
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -236,6 +233,26 @@ var unwrapStringForEscaped = function (s) {
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -403,6 +420,12 @@ var Container = /** @class */ (function () {
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -868,7 +891,9 @@ var WrappedSelect = /** @class */ (function (_super) {
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -914,6 +939,7 @@ var DEFAULT_CLASSNAMES = {
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -941,6 +967,7 @@ var DEFAULT_CONFIG = {
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -956,6 +983,7 @@ var DEFAULT_CONFIG = {
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -964,7 +992,9 @@ var DEFAULT_CONFIG = {
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1265,7 +1295,8 @@ var Store = /** @class */ (function () {
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1379,11 +1410,12 @@ var SearchByKMP = /** @class */ (function () {
var field = this._fields[k];
if (field in obj && kmpSearch(needle, obj[field].toLowerCase()) !== -1) {
results.push({
item: obj[field],
item: obj,
score: count,
rank: count + 1,
});
count++;
break;
}
}
}
@ -1419,7 +1451,7 @@ var assignCustomProperties = function (el, choice, withCustomProperties) {
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -1526,8 +1558,9 @@ var templates = {
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -1632,6 +1665,7 @@ var templates = {
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -1801,7 +1835,7 @@ var Choices = /** @class */ (function () {
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -1841,6 +1875,8 @@ var Choices = /** @class */ (function () {
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -1947,7 +1983,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1962,7 +1998,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1972,7 +2008,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -1984,7 +2020,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -2039,6 +2075,11 @@ var Choices = /** @class */ (function () {
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -2047,6 +2088,7 @@ var Choices = /** @class */ (function () {
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -2059,9 +2101,8 @@ var Choices = /** @class */ (function () {
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -2319,7 +2360,7 @@ var Choices = /** @class */ (function () {
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -2402,13 +2443,7 @@ var Choices = /** @class */ (function () {
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -2418,11 +2453,16 @@ var Choices = /** @class */ (function () {
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -2432,16 +2472,20 @@ var Choices = /** @class */ (function () {
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -2451,7 +2495,7 @@ var Choices = /** @class */ (function () {
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -2460,7 +2504,7 @@ var Choices = /** @class */ (function () {
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -2470,12 +2514,12 @@ var Choices = /** @class */ (function () {
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -2489,9 +2533,7 @@ var Choices = /** @class */ (function () {
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -2601,23 +2643,12 @@ var Choices = /** @class */ (function () {
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -2633,7 +2664,7 @@ var Choices = /** @class */ (function () {
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -2822,7 +2853,7 @@ var Choices = /** @class */ (function () {
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -2834,12 +2865,12 @@ var Choices = /** @class */ (function () {
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -2890,6 +2921,7 @@ var Choices = /** @class */ (function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -2927,12 +2959,21 @@ var Choices = /** @class */ (function () {
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -2950,6 +2991,10 @@ var Choices = /** @class */ (function () {
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -3199,7 +3244,7 @@ var Choices = /** @class */ (function () {
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -3308,7 +3353,7 @@ var Choices = /** @class */ (function () {
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -3332,6 +3377,27 @@ var Choices = /** @class */ (function () {
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -3340,12 +3406,7 @@ var Choices = /** @class */ (function () {
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -3386,9 +3447,10 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -3401,7 +3463,7 @@ var Choices = /** @class */ (function () {
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -3516,24 +3578,24 @@ var Choices = /** @class */ (function () {
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -3616,7 +3678,7 @@ var Choices = /** @class */ (function () {
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@ -208,9 +208,6 @@
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -242,6 +239,26 @@
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -409,6 +426,12 @@
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -874,7 +897,9 @@
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -920,6 +945,7 @@
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -947,6 +973,7 @@
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -962,6 +989,7 @@
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -970,7 +998,9 @@
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1271,7 +1301,8 @@
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1384,7 +1415,7 @@
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -1491,8 +1522,9 @@
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -1597,6 +1629,7 @@
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -1766,7 +1799,7 @@
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -1806,6 +1839,8 @@
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -1912,7 +1947,7 @@
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1927,7 +1962,7 @@
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1937,7 +1972,7 @@
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -1949,7 +1984,7 @@
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -2004,6 +2039,11 @@
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -2012,6 +2052,7 @@
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -2024,9 +2065,8 @@
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -2284,7 +2324,7 @@
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -2367,13 +2407,7 @@
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -2383,11 +2417,16 @@
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -2397,16 +2436,20 @@
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -2416,7 +2459,7 @@
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -2425,7 +2468,7 @@
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -2435,12 +2478,12 @@
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -2454,9 +2497,7 @@
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -2566,23 +2607,12 @@
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -2598,7 +2628,7 @@
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -2787,7 +2817,7 @@
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -2799,12 +2829,12 @@
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -2855,6 +2885,7 @@
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -2892,12 +2923,21 @@
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -2915,6 +2955,10 @@
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -3164,7 +3208,7 @@
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -3273,7 +3317,7 @@
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -3297,6 +3341,27 @@
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -3305,12 +3370,7 @@
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -3351,9 +3411,10 @@
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -3366,7 +3427,7 @@
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -3481,24 +3542,24 @@
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -3581,7 +3642,7 @@
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

File diff suppressed because one or more lines are too long

View file

@ -1,4 +1,4 @@
/*! choices.js v11.1.0 | © 2025 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/*! choices.js v11.2.0 | © 2026 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
/******************************************************************************
Copyright (c) Microsoft Corporation.
@ -202,9 +202,6 @@ var strToEl = (function () {
return firstChild;
};
})();
var resolveNoticeFunction = function (fn, value) {
return typeof fn === 'function' ? fn(sanitise(value), value) : fn;
};
var resolveStringFunction = function (fn) {
return typeof fn === 'function' ? fn() : fn;
};
@ -236,6 +233,26 @@ var unwrapStringForEscaped = function (s) {
}
return '';
};
var getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: unwrapStringForRaw(choice.labelDescription),
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
};
var resolveNoticeFunction = function (fn, value, item) {
return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn;
};
var escapeForTemplate = function (allowHTML, s) {
return allowHTML ? unwrapStringForEscaped(s) : sanitise(s);
};
@ -403,6 +420,12 @@ var Container = /** @class */ (function () {
Container.prototype.removeFocusState = function () {
removeClassesFromElement(this.element, this.classNames.focusState);
};
Container.prototype.addInvalidState = function () {
addClassesToElement(this.element, this.classNames.invalidState);
};
Container.prototype.removeInvalidState = function () {
removeClassesFromElement(this.element, this.classNames.invalidState);
};
Container.prototype.enable = function () {
removeClassesFromElement(this.element, this.classNames.disabledState);
this.element.removeAttribute('aria-disabled');
@ -868,7 +891,9 @@ var WrappedSelect = /** @class */ (function (_super) {
highlighted: false,
placeholder: this.extractPlaceholder && (!option.value || option.hasAttribute('placeholder')),
labelClass: typeof option.dataset.labelClass !== 'undefined' ? stringToHtmlClass(option.dataset.labelClass) : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined' ? option.dataset.labelDescription : undefined,
labelDescription: typeof option.dataset.labelDescription !== 'undefined'
? { trusted: option.dataset.labelDescription }
: undefined,
customProperties: parseCustomProperties(option.dataset.customProperties),
};
};
@ -914,6 +939,7 @@ var DEFAULT_CLASSNAMES = {
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
invalidState: ['is-invalid'],
notice: ['choices__notice'],
addChoice: ['choices__item--selectable', 'add-choice'],
noResults: ['has-no-results'],
@ -941,6 +967,7 @@ var DEFAULT_CONFIG = {
paste: true,
searchEnabled: true,
searchChoices: true,
searchDisabledChoices: false,
searchFloor: 1,
searchResultLimit: 4,
searchFields: ['label', 'value'],
@ -956,6 +983,7 @@ var DEFAULT_CONFIG = {
prependValue: null,
appendValue: null,
renderSelectedChoices: 'auto',
searchRenderSelectedChoices: true,
loadingText: 'Loading...',
noResultsText: 'No results found',
noChoicesText: 'No choices to choose from',
@ -964,7 +992,9 @@ var DEFAULT_CONFIG = {
customAddItemText: 'Only values matching specific conditions can be added',
addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); },
removeItemIconText: function () { return "Remove item"; },
removeItemLabelText: function (value) { return "Remove item: ".concat(value); },
removeItemLabelText: function (value, _valueRaw, i) {
return "Remove item: ".concat(i ? sanitise(i.label) : value);
},
maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); },
valueComparer: function (value1, value2) { return value1 === value2; },
fuseOptions: {
@ -1265,7 +1295,8 @@ var Store = /** @class */ (function () {
* Get choices that can be searched (excluding placeholders or disabled choices)
*/
get: function () {
return this.choices.filter(function (choice) { return !choice.disabled && !choice.placeholder; });
var context = this._context;
return this.choices.filter(function (choice) { return !choice.placeholder && (context.searchDisabledChoices || !choice.disabled); });
},
enumerable: false,
configurable: true
@ -1378,7 +1409,7 @@ var assignCustomProperties = function (el, choice, withCustomProperties) {
dataset.labelClass = getClassNames(labelClass).join(' ');
}
if (labelDescription) {
dataset.labelDescription = labelDescription;
dataset.labelDescription = unwrapStringForRaw(labelDescription);
}
if (withCustomProperties && customProperties) {
if (typeof customProperties === 'string') {
@ -1485,8 +1516,9 @@ var templates = {
var removeButton = document.createElement('button');
removeButton.type = 'button';
addClassesToElement(removeButton, button);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value);
var eventChoice = getChoiceForOutput(choice);
setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice));
var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice);
if (REMOVE_ITEM_LABEL) {
removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL);
}
@ -1591,6 +1623,7 @@ var templates = {
else {
addClassesToElement(div, itemSelectable);
div.dataset.choiceSelectable = '';
div.setAttribute('aria-selected', choice.selected ? 'true' : 'false');
}
return div;
},
@ -1760,7 +1793,7 @@ var Choices = /** @class */ (function () {
this.initialised = false;
this._store = new Store(config);
this._currentValue = '';
config.searchEnabled = (!isText && config.searchEnabled) || isSelectMultiple;
config.searchEnabled = !isText && config.searchEnabled;
this._canSearch = config.searchEnabled;
this._isScrollingOnIe = false;
this._highlightPosition = 0;
@ -1800,6 +1833,8 @@ var Choices = /** @class */ (function () {
this._onEscapeKey = this._onEscapeKey.bind(this);
this._onDirectionKey = this._onDirectionKey.bind(this);
this._onDeleteKey = this._onDeleteKey.bind(this);
this._onChange = this._onChange.bind(this);
this._onInvalid = this._onInvalid.bind(this);
// If element has already been initialised with Choices, fail silently
if (this.passedElement.isActive) {
if (!config.silent) {
@ -1906,7 +1941,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, true));
if (runEvent) {
this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1921,7 +1956,7 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(highlightItem(choice, false));
if (runEvent) {
this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice));
}
return this;
};
@ -1931,7 +1966,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (!item.highlighted) {
_this._store.dispatch(highlightItem(item, true));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -1943,7 +1978,7 @@ var Choices = /** @class */ (function () {
_this._store.items.forEach(function (item) {
if (item.highlighted) {
_this._store.dispatch(highlightItem(item, false));
_this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item));
_this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item));
}
});
});
@ -1998,6 +2033,11 @@ var Choices = /** @class */ (function () {
_this.input.focus();
}
_this.passedElement.triggerEvent(EventType.showDropdown);
var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
// We use the native scrollIntoView function instead of choiceList.scrollToChildElement to avoid animated scroll.
activeElement.scrollIntoView();
}
});
return this;
};
@ -2006,6 +2046,7 @@ var Choices = /** @class */ (function () {
if (!this.dropdown.isActive) {
return this;
}
this._removeHighlightedChoices();
requestAnimationFrame(function () {
_this.dropdown.hide();
_this.containerOuter.close();
@ -2018,9 +2059,8 @@ var Choices = /** @class */ (function () {
return this;
};
Choices.prototype.getValue = function (valueOnly) {
var _this = this;
var values = this._store.items.map(function (item) {
return (valueOnly ? item.value : _this._getChoiceForOutput(item));
return (valueOnly ? item.value : getChoiceForOutput(item));
});
return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values;
};
@ -2278,7 +2318,7 @@ var Choices = /** @class */ (function () {
// @todo integrate with Store
this._searcher.reset();
if (choice.selected) {
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice));
}
return this;
};
@ -2361,13 +2401,7 @@ var Choices = /** @class */ (function () {
}
var _a = this, config = _a.config, isSearching = _a._isSearching;
var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices;
var renderLimit = 0;
if (isSearching && config.searchResultLimit > 0) {
renderLimit = config.searchResultLimit;
}
else if (config.renderChoiceLimit > 0) {
renderLimit = config.renderChoiceLimit;
}
var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit;
if (this._isSelectElement) {
var backingOptions = activeChoices.filter(function (choice) { return !choice.element; });
if (backingOptions.length) {
@ -2377,11 +2411,16 @@ var Choices = /** @class */ (function () {
var fragment = document.createDocumentFragment();
var renderableChoices = function (choices) {
return choices.filter(function (choice) {
return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected);
return !choice.placeholder &&
(isSearching
? (config.searchRenderSelectedChoices || !choice.selected) && !!choice.rank
: config.renderSelectedChoices || !choice.selected);
});
};
var showLabel = config.appendGroupInSearch && isSearching;
var selectableChoices = false;
var renderChoices = function (choices, withinGroup, groupLabel) {
var highlightedEl = null;
var renderChoices = function (choices, withinGroup) {
if (isSearching) {
// sortByRank is used to ensure stable sorting, as scores are non-unique
// this additionally ensures fuseOptions.sortFn is not ignored
@ -2391,16 +2430,20 @@ var Choices = /** @class */ (function () {
choices.sort(config.sorter);
}
var choiceLimit = choices.length;
choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit;
choiceLimit--;
choices.every(function (choice, index) {
// choiceEl being empty signals the contents has probably significantly changed
var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel);
var dropdownItem = choice.choiceEl ||
_this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined);
choice.choiceEl = dropdownItem;
fragment.appendChild(dropdownItem);
if (isSearching || !choice.selected) {
selectableChoices = true;
}
else if (!highlightedEl) {
highlightedEl = dropdownItem;
}
return index < choiceLimit;
});
};
@ -2410,7 +2453,7 @@ var Choices = /** @class */ (function () {
}
if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) {
// If we have a placeholder choice along with groups
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false);
}
// If we have grouped options
if (activeGroups.length && !isSearching) {
@ -2419,7 +2462,7 @@ var Choices = /** @class */ (function () {
}
// render Choices without group first, regardless of sort, otherwise they won't be distinguishable
// from the last group
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined);
renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false);
activeGroups.forEach(function (group) {
var groupChoices = renderableChoices(group.choices);
if (groupChoices.length) {
@ -2429,12 +2472,12 @@ var Choices = /** @class */ (function () {
dropdownGroup.remove();
fragment.appendChild(dropdownGroup);
}
renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined);
renderChoices(groupChoices, true);
}
});
}
else {
renderChoices(renderableChoices(activeChoices), false, undefined);
renderChoices(renderableChoices(activeChoices), false);
}
}
if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) {
@ -2448,9 +2491,7 @@ var Choices = /** @class */ (function () {
}
this._renderNotice(fragment);
this.choiceList.element.replaceChildren(fragment);
if (selectableChoices) {
this._highlightChoice();
}
this._highlightChoice(highlightedEl);
};
Choices.prototype._renderItems = function () {
var _this = this;
@ -2560,23 +2601,12 @@ var Choices = /** @class */ (function () {
}
}
};
/**
* @deprecated Use utils.getChoiceForOutput
*/
// eslint-disable-next-line class-methods-use-this
Choices.prototype._getChoiceForOutput = function (choice, keyCode) {
return {
id: choice.id,
highlighted: choice.highlighted,
labelClass: choice.labelClass,
labelDescription: choice.labelDescription,
customProperties: choice.customProperties,
disabled: choice.disabled,
active: choice.active,
label: choice.label,
placeholder: choice.placeholder,
value: choice.value,
groupValue: choice.group ? choice.group.label : undefined,
element: choice.element,
keyCode: keyCode,
};
return getChoiceForOutput(choice, keyCode);
};
Choices.prototype._triggerChange = function (value) {
if (value === undefined || value === null) {
@ -2592,7 +2622,7 @@ var Choices = /** @class */ (function () {
if (!items.length || !this.config.removeItems || !this.config.removeItemButton) {
return;
}
var id = element && parseDataSetId(element.parentElement);
var id = element && parseDataSetId(element.closest('[data-id]'));
var itemToRemove = id && items.find(function (item) { return item.id === id; });
if (!itemToRemove) {
return;
@ -2781,7 +2811,7 @@ var Choices = /** @class */ (function () {
var notice = '';
if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
canAddItem = false;
notice = resolveNoticeFunction(config.customAddItemText, value);
notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
}
if (canAddItem) {
var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
@ -2793,12 +2823,12 @@ var Choices = /** @class */ (function () {
}
if (!config.duplicateItemsAllowed) {
canAddItem = false;
notice = resolveNoticeFunction(config.uniqueItemText, value);
notice = resolveNoticeFunction(config.uniqueItemText, value, undefined);
}
}
}
if (canAddItem) {
notice = resolveNoticeFunction(config.addItemText, value);
notice = resolveNoticeFunction(config.addItemText, value, undefined);
}
if (notice) {
this._displayNotice(notice, NoticeTypes.addChoice);
@ -2849,6 +2879,7 @@ var Choices = /** @class */ (function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
// capture events - can cancel event processing or propagation
documentElement.addEventListener('touchend', this._onTouchEnd, true);
outerElement.addEventListener('keydown', this._onKeyDown, true);
@ -2886,12 +2917,21 @@ var Choices = /** @class */ (function () {
passive: true,
});
}
if (passedElement.hasAttribute('required')) {
passedElement.addEventListener('change', this._onChange, {
passive: true,
});
passedElement.addEventListener('invalid', this._onInvalid, {
passive: true,
});
}
this.input.addEventListeners();
};
Choices.prototype._removeEventListeners = function () {
var documentElement = this._docRoot;
var outerElement = this.containerOuter.element;
var inputElement = this.input.element;
var passedElement = this.passedElement.element;
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
outerElement.removeEventListener('keydown', this._onKeyDown, true);
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
@ -2909,6 +2949,10 @@ var Choices = /** @class */ (function () {
if (inputElement.form) {
inputElement.form.removeEventListener('reset', this._onFormReset);
}
if (passedElement.hasAttribute('required')) {
passedElement.removeEventListener('change', this._onChange);
passedElement.removeEventListener('invalid', this._onInvalid);
}
this.input.removeEventListeners();
};
Choices.prototype._onKeyDown = function (event) {
@ -3158,7 +3202,7 @@ var Choices = /** @class */ (function () {
*/
Choices.prototype._onMouseDown = function (event) {
var target = event.target;
if (!(target instanceof HTMLElement)) {
if (!(target instanceof Element)) {
return;
}
// If we have our mouse down on the scrollbar and are on IE11...
@ -3267,7 +3311,7 @@ var Choices = /** @class */ (function () {
// Remove the focus state when the past outerContainer was the target
containerOuter.removeFocusState();
// Also close the dropdown if search is disabled
if (!this._canSearch) {
if (!this.config.searchEnabled) {
this.hideDropdown(true);
}
}
@ -3291,6 +3335,27 @@ var Choices = /** @class */ (function () {
}
});
};
Choices.prototype._onChange = function (event) {
if (!event.target.checkValidity()) {
return;
}
this.containerOuter.removeInvalidState();
};
Choices.prototype._onInvalid = function () {
this.containerOuter.addInvalidState();
};
/**
* Removes any highlighted choice options
*/
Choices.prototype._removeHighlightedChoices = function () {
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
};
Choices.prototype._highlightChoice = function (el) {
if (el === void 0) { el = null; }
var choices = Array.from(this.dropdown.element.querySelectorAll(selectableChoiceIdentifier));
@ -3299,12 +3364,7 @@ var Choices = /** @class */ (function () {
}
var passedEl = el;
var highlightedState = this.config.classNames.highlightedState;
var highlightedChoices = Array.from(this.dropdown.element.querySelectorAll(getClassNamesSelector(highlightedState)));
// Remove any highlighted choices
highlightedChoices.forEach(function (choice) {
removeClassesFromElement(choice, highlightedState);
choice.setAttribute('aria-selected', 'false');
});
this._removeHighlightedChoices();
if (passedEl) {
this._highlightPosition = choices.indexOf(passedEl);
}
@ -3345,9 +3405,10 @@ var Choices = /** @class */ (function () {
}
this._store.dispatch(addItem(item));
if (withEvents) {
this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item));
var eventChoice = getChoiceForOutput(item);
this.passedElement.triggerEvent(EventType.addItem, eventChoice);
if (userTriggered) {
this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.choice, eventChoice);
}
}
};
@ -3360,7 +3421,7 @@ var Choices = /** @class */ (function () {
if (notice && notice.type === NoticeTypes.noChoices) {
this._clearNotice();
}
this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item));
this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item));
};
Choices.prototype._addChoice = function (choice, withEvents, userTriggered) {
if (withEvents === void 0) { withEvents = true; }
@ -3475,24 +3536,24 @@ var Choices = /** @class */ (function () {
containerInner.wrap(passedElement.element);
// Wrapper inner container with outer container
containerOuter.wrap(containerInner.element);
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
}
else {
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
containerOuter.element.appendChild(containerInner.element);
containerOuter.element.appendChild(dropdownElement);
containerInner.element.appendChild(this.itemList.element);
dropdownElement.appendChild(this.choiceList.element);
if (!this._isSelectOneElement) {
if (this._isSelectOneElement) {
this.input.placeholder = this.config.searchPlaceholderValue || '';
if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
}
}
else {
if (!this._isSelectMultipleElement || this.config.searchEnabled) {
containerInner.element.appendChild(this.input.element);
}
else if (this.config.searchEnabled) {
dropdownElement.insertBefore(this.input.element, dropdownElement.firstChild);
if (this._placeholderValue) {
this.input.placeholder = this._placeholderValue;
}
this.input.setWidth();
}
this._highlightPosition = 0;
this._isSearching = false;
@ -3575,7 +3636,7 @@ var Choices = /** @class */ (function () {
throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
}
};
Choices.version = '11.1.0';
Choices.version = '11.2.0';
return Choices;
}());

View file

@ -1,6 +1,36 @@
/* =============================================
= Generic styling =
============================================= */
:root {
--color-primary: #005F75;
}
@media (prefers-color-scheme: dark) {
:root {
/* Demo defaults */
--body-bg: #272a2b;
--text-color: #cacaca;
--color-primary: #38daff;
--section-bg: #181a1b;
--section-color: #cacaca;
--hr-border: #373a3d;
--choices-primary-color: #38daff;
--choices-item-color: black;
--choices-bg-color: #101010;
--choices-bg-color-dropdown: #101010;
--choices-keyline-color: #3b3e40;
--choices-bg-color-disabled: #181a1b;
--choices-item-disabled-color: #eee;
--choices-disabled-color: #2d2d2d;
--choices-highlighted-color: #16292d;
--choices-icon-cross: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
--choices-icon-cross-inverse: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
color-scheme: dark;
}
input, select {
color: #fff;
}
}
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@ -24,8 +54,8 @@ body {
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-size: 16px;
line-height: 1.4;
color: #fff;
background-color: #333;
color: var(--text-color, #fff);
background-color: var(--body-bg, #333);
overflow-x: hidden;
}
@ -46,7 +76,7 @@ hr {
display: block;
margin: 30px 0;
border: 0;
border-bottom: 1px solid #eaeaea;
border-bottom: 1px solid var(--hr-border, #eaeaea);
height: 1px;
}
@ -65,7 +95,7 @@ h6 {
a,
a:visited,
a:focus {
color: #fff;
color: var(--link-color, #fff);
text-decoration: none;
font-weight: 600;
}
@ -73,9 +103,9 @@ a:focus {
.form-control {
display: block;
width: 100%;
background-color: #f9f9f9;
background-color: var(--form-bg, #f9f9f9);
padding: 12px;
border: 1px solid #ddd;
border: 1px solid var(--form-boder, #ddd);
border-radius: 2.5px;
font-size: 14px;
appearance: none;
@ -129,14 +159,14 @@ label + p {
}
.section {
background-color: #fff;
background-color: var(--section-bg, #fff);
padding: 24px;
color: #333;
color: var(--section-color, #333);
}
.section a,
.section a:visited,
.section a:focus {
color: #005F75;
color: var(--link-color-section, var(--color-primary));
}
.logo {

View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../src/styles/base.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAYA;EACE;EACA;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,eAtFiB;;;AAyFnB;AAAA;EAEE,WA1FoB;;;AA6FtB;AAAA;EAEE,WA9FoB;;;AAiGtB;AAAA;EAEE,WAlGoB;;;AAqGtB;AAAA;EAEE,WAtGoB;;;AAyGtB;AAAA;EAEE,WA1GoB;;;AA6GtB;AAAA;EAEE,WA9GoB;;;AAiHtB;EACE;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;;AAIJ;EACE;EACA,SAxIiB;EAyIjB;;AAEA;AAAA;AAAA;EAGE;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE,eArKiB;;;AAwKnB;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,eArLiB;;;AAwLnB","file":"base.css"}
{"version":3,"sourceRoot":"","sources":["../../../src/styles/base.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAIA;EACE;;;AAGF;EACE;AACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAEA;;EAGF;IACE;;;AAYJ;EACE;EACA;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,eAtFiB;;;AAyFnB;AAAA;EAEE,WA1FoB;;;AA6FtB;AAAA;EAEE,WA9FoB;;;AAiGtB;AAAA;EAEE,WAlGoB;;;AAqGtB;AAAA;EAEE,WAtGoB;;;AAyGtB;AAAA;EAEE,WA1GoB;;;AA6GtB;AAAA;EAEE,WA9GoB;;;AAiHtB;EACE;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;;AAIJ;EACE;EACA,SAxIiB;EAyIjB;;AAEA;AAAA;AAAA;EAGE;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE,eArKiB;;;AAwKnB;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,eArLiB;;;AAwLnB","file":"base.css"}

View file

@ -1 +1 @@
*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,::after,::before{box-sizing:border-box}body,html{position:relative;margin:0;width:100%;height:100%}body{font-family:"Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;font-size:16px;line-height:1.4;color:#fff;background-color:#333;overflow-x:hidden}hr,label{display:block}label,p{margin-bottom:8px}label{font-size:14px;font-weight:500;cursor:pointer}p{margin-top:0}hr{margin:30px 0;border:0;border-bottom:1px solid #eaeaea;height:1px}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:12px;font-weight:400;line-height:1.2}a,a:focus,a:visited{color:#fff;text-decoration:none;font-weight:600}.form-control{display:block;width:100%;background-color:#f9f9f9;padding:12px;border:1px solid #ddd;border-radius:2.5px;font-size:14px;appearance:none;margin-bottom:24px}.h1,h1{font-size:32px}.h2,h2{font-size:24px}.h3,h3{font-size:20px}.h4,h4{font-size:18px}.h5,h5{font-size:16px}.h6,h6{font-size:14px}label+p{margin-top:-4px}.container{display:block;margin:auto;max-width:40em;padding:48px}@media (max-width:620px){.container{padding:0}}.section{background-color:#fff;padding:24px;color:#333}.section a,.section a:focus,.section a:visited{color:#005f75}.logo{display:block;margin-bottom:12px}.logo-img{width:100%;height:auto;display:inline-block;max-width:100%;vertical-align:top;padding:6px 0}.visible-ie{display:none}.push-bottom{margin-bottom:24px}.zero-bottom{margin-bottom:0}.zero-top{margin-top:0}.text-center{text-align:center}[data-test-hook]{margin-bottom:24px}
:root{--color-primary:#005F75}@media (prefers-color-scheme:dark){:root{--body-bg:#272a2b;--text-color:#cacaca;--color-primary:#38daff;--section-bg:#181a1b;--section-color:#cacaca;--hr-border:#373a3d;--choices-primary-color:#38daff;--choices-item-color:black;--choices-bg-color:#101010;--choices-bg-color-dropdown:#101010;--choices-keyline-color:#3b3e40;--choices-bg-color-disabled:#181a1b;--choices-item-disabled-color:#eee;--choices-disabled-color:#2d2d2d;--choices-highlighted-color:#16292d;--choices-icon-cross:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");--choices-icon-cross-inverse:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");color-scheme:dark}input,select{color:#fff}}*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,::after,::before{box-sizing:border-box}body,html{position:relative;margin:0;width:100%;height:100%}body{font-family:"Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;font-size:16px;line-height:1.4;color:var(--text-color, #fff);background-color:var(--body-bg, #333);overflow-x:hidden}hr,label{display:block}label,p{margin-bottom:8px}label{font-size:14px;font-weight:500;cursor:pointer}p{margin-top:0}hr{margin:30px 0;border:0;border-bottom:1px solid var(--hr-border, #eaeaea);height:1px}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:12px;font-weight:400;line-height:1.2}a,a:focus,a:visited{color:var(--link-color, #fff);text-decoration:none;font-weight:600}.form-control{display:block;width:100%;background-color:var(--form-bg, #f9f9f9);padding:12px;border:1px solid var(--form-boder, #ddd);border-radius:2.5px;font-size:14px;appearance:none;margin-bottom:24px}.h1,h1{font-size:32px}.h2,h2{font-size:24px}.h3,h3{font-size:20px}.h4,h4{font-size:18px}.h5,h5{font-size:16px}.h6,h6{font-size:14px}label+p{margin-top:-4px}.container{display:block;margin:auto;max-width:40em;padding:48px}@media (max-width:620px){.container{padding:0}}.section{background-color:var(--section-bg, #fff);padding:24px;color:var(--section-color, #333)}.section a,.section a:focus,.section a:visited{color:var(--link-color-section, var(--color-primary))}.logo{display:block;margin-bottom:12px}.logo-img{width:100%;height:auto;display:inline-block;max-width:100%;vertical-align:top;padding:6px 0}.visible-ie{display:none}.push-bottom{margin-bottom:24px}.zero-bottom{margin-bottom:0}.zero-top{margin-top:0}.text-center{text-align:center}[data-test-hook]{margin-bottom:24px}

View file

@ -4,8 +4,8 @@
.choices {
position: relative;
overflow: hidden;
margin-bottom: 24px;
font-size: 16px;
margin-bottom: var(--choices-guttering, 24px);
font-size: var(--choices-font-size-lg, 16px);
}
.choices:focus {
outline: none;
@ -16,36 +16,39 @@
.choices.is-open {
overflow: visible;
}
.choices.is-disabled .choices__inner,
.choices.is-disabled .choices__input {
background-color: #eaeaea;
cursor: not-allowed;
.choices.is-disabled :is(.choices__inner, .choices__input) {
background-color: var(--choices-bg-color-disabled, #eaeaea);
cursor: not-allowed !important;
-webkit-user-select: none;
user-select: none;
}
.choices.is-disabled .choices__item {
cursor: not-allowed;
color: var(--choices-item-disabled-color, #fff);
}
.choices [hidden] {
display: none !important;
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0;
}
.choices[data-type*=select-one] {
cursor: pointer;
}
.choices[data-type*=select-one] .choices__inner {
padding-bottom: 7.5px;
padding-bottom: var(--choices-inner-one-padding, 7.5px);
}
.choices[data-type*=select-one] .choices__input {
display: block;
width: 100%;
padding: 10px;
border-bottom: 1px solid #ddd;
background-color: #fff;
width: var(--choices-width, 100%);
padding: var(--choices-dropdown-item-padding, 10px);
border-bottom: var(--choices-base-border, 1px solid) var(--choices-keyline-color, #ddd);
background-color: var(--choices-bg-color-dropdown, #fff);
margin: 0;
}
.choices[data-type*=select-one] .choices__button {
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
background-image: var(--choices-icon-cross-inverse, url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg=="));
padding: 0;
background-size: 8px;
position: absolute;
@ -58,11 +61,11 @@
border-radius: 10em;
opacity: 0.25;
}
.choices[data-type*=select-one] .choices__button:hover, .choices[data-type*=select-one] .choices__button:focus {
opacity: 1;
.choices[data-type*=select-one] .choices__button:is(:hover, :focus) {
opacity: var(--choices-button-opacity-hover, 1);
}
.choices[data-type*=select-one] .choices__button:focus {
box-shadow: 0 0 0 2px #005F75;
box-shadow: 0 0 0 2px var(--choices-highlight-color, #005F75);
}
.choices[data-type*=select-one] .choices__item[data-placeholder] .choices__button {
display: none;
@ -72,17 +75,17 @@
height: 0;
width: 0;
border-style: solid;
border-color: #333 transparent transparent transparent;
border-width: 5px;
border-color: var(--choices-text-color, #333) transparent transparent transparent;
border-width: var(--choices-arrow-size, 5px);
position: absolute;
right: 11.5px;
right: var(--choices-arrow-right, 11.5px);
top: 50%;
margin-top: -2.5px;
margin-top: var(--choices-arrow-margin-top, -2.5px);
pointer-events: none;
}
.choices[data-type*=select-one].is-open::after {
border-color: transparent transparent #333;
margin-top: -7.5px;
border-color: transparent transparent var(--choices-text-color, #333);
margin-top: var(--choices-arrow-margin-top-open, -7.5px);
}
.choices[data-type*=select-one][dir=rtl]::after {
left: 11.5px;
@ -95,53 +98,49 @@
margin-right: 0;
}
.choices[data-type*=select-multiple] .choices__inner,
.choices[data-type*=text] .choices__inner {
.choices:is([data-type*=select-multiple], [data-type*=text]) .choices__inner {
cursor: text;
}
.choices[data-type*=select-multiple] .choices__button,
.choices[data-type*=text] .choices__button {
.choices:is([data-type*=select-multiple], [data-type*=text]) .choices__button {
position: relative;
display: inline-block;
margin-top: 0;
margin-right: -4px;
margin-bottom: 0;
margin-left: 8px;
padding-left: 16px;
border-left: 1px solid #003642;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
background-size: 8px;
width: 8px;
line-height: 1;
opacity: 0.75;
border-radius: 0;
margin: 0 calc(var(--choices-button-offset, 8px) * -0.5) 0 var(--choices-button-offset, 8px);
padding-left: calc(var(--choices-button-offset, 8px) * 2);
border-left: 1px solid color-mix(in srgb, var(--choices-primary-color, #005F75) 90%, var(--choices-darken, black));
background-image: var(--choices-icon-cross, url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg=="));
background-size: var(--choices-button-dimension, 8px);
width: var(--choices-button-dimension, 8px);
line-height: var(--choices-button-line-height, 1);
border-radius: var(--choices-button-border-radius, 0);
opacity: var(--choices-button-opacity, 0.75);
}
.choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=select-multiple] .choices__button:focus,
.choices[data-type*=text] .choices__button:hover,
.choices[data-type*=text] .choices__button:focus {
opacity: 1;
.choices:is([data-type*=select-multiple], [data-type*=text]) .choices__button:is(:hover, :focus) {
--choices-button-opacity: var(--choices-button-opacity-hover, 1);
}
.choices__inner {
display: inline-block;
vertical-align: top;
width: 100%;
background-color: #f9f9f9;
padding: 7.5px 7.5px 3.75px;
border: 1px solid #ddd;
border-radius: 2.5px;
font-size: 14px;
min-height: 44px;
width: var(--choices-width, 100%);
background-color: var(--choices-bg-color, #f9f9f9);
padding: var(--choices-inner-padding, 7.5px 7.5px 3.75px);
border: var(--choices-base-border, 1px solid) var(--choices-keyline-color, #ddd);
border-radius: var(--choices-border-radius, 2.5px);
font-size: var(--choices-font-size-md, 14px);
min-height: var(--choices-input-height, 44px);
overflow: hidden;
}
.is-focused .choices__inner, .is-open .choices__inner {
border-color: #b7b7b7;
border-color: color-mix(in srgb, var(--choices-keyline-color, #ddd) 85%, var(--choices-darken, black));
}
.is-open .choices__inner {
border-radius: 2.5px 2.5px 0 0;
border-radius: var(--choices-border-radius, 2.5px) var(--choices-border-radius, 2.5px) 0 0;
}
.is-invalid .choices__inner {
border-color: var(--choices-invalid-color, #d33141);
}
.is-flipped.is-open .choices__inner {
border-radius: 0 0 2.5px 2.5px;
border-radius: 0 0 var(--choices-border-radius, 2.5px) var(--choices-border-radius, 2.5px);
}
.choices__list {
@ -151,15 +150,15 @@
}
.choices__list--single {
display: inline-block;
padding: 4px 16px 4px 4px;
width: 100%;
padding: var(--choices-list-single-padding, 4px 16px 4px 4px);
width: var(--choices-width, 100%);
}
[dir=rtl] .choices__list--single {
padding-right: 4px;
padding-left: 16px;
}
.choices__list--single .choices__item {
width: 100%;
width: var(--choices-width, 100%);
}
.choices__list--multiple {
@ -168,15 +167,15 @@
.choices__list--multiple .choices__item {
display: inline-block;
vertical-align: middle;
border-radius: 20px;
padding: 4px 10px;
font-size: 12px;
border-radius: var(--choices-border-radius-item, 20px);
padding: var(--choices-multiple-item-padding, 4px 10px);
font-size: var(--choices-font-size-sm, 12px);
font-weight: 500;
margin-right: 3.75px;
margin-bottom: 3.75px;
background-color: #005F75;
border: 1px solid #004a5c;
color: #fff;
margin-right: var(--choices-multiple-item-margin, 3.75px);
margin-bottom: var(--choices-multiple-item-margin, 3.75px);
background-color: var(--choices-primary-color, #005F75);
border: 1px solid color-mix(in srgb, var(--choices-primary-color, #005F75) 95%, var(--choices-darken, black));
color: var(--choices-item-color, #fff);
word-break: break-all;
box-sizing: border-box;
}
@ -185,28 +184,28 @@
}
[dir=rtl] .choices__list--multiple .choices__item {
margin-right: 0;
margin-left: 3.75px;
margin-left: var(--choices-multiple-item-margin, 3.75px);
}
.choices__list--multiple .choices__item.is-highlighted {
background-color: #004a5c;
border: 1px solid #003642;
background-color: color-mix(in srgb, var(--choices-primary-color, #005F75) 95%, var(--choices-darken, black));
border: 1px solid color-mix(in srgb, var(--choices-primary-color, #005F75) 90%, var(--choices-darken, black));
}
.is-disabled .choices__list--multiple .choices__item {
background-color: #aaaaaa;
border: 1px solid #919191;
background-color: color-mix(in srgb, var(--choices-disabled-color, #eaeaea) 75%, var(--choices-darken, black));
border: 1px solid color-mix(in srgb, var(--choices-disabled-color, #eaeaea) 65%, var(--choices-darken, black));
}
.choices__list--dropdown, .choices__list[aria-expanded] {
display: none;
z-index: 1;
z-index: var(--choices-z-index, 1);
position: absolute;
width: 100%;
background-color: #fff;
border: 1px solid #ddd;
width: var(--choices-width, 100%);
background-color: var(--choices-bg-color-dropdown, #fff);
border: var(--choices-base-border, 1px solid) var(--choices-keyline-color, #ddd);
top: 100%;
margin-top: -1px;
border-bottom-left-radius: 2.5px;
border-bottom-right-radius: 2.5px;
border-bottom-left-radius: var(--choices-border-radius, 2.5px);
border-bottom-right-radius: var(--choices-border-radius, 2.5px);
overflow: hidden;
word-break: break-all;
}
@ -214,7 +213,7 @@
display: block;
}
.is-open .choices__list--dropdown, .is-open .choices__list[aria-expanded] {
border-color: #b7b7b7;
border-color: color-mix(in srgb, var(--choices-keyline-color, #ddd) 85%, var(--choices-darken, black));
}
.is-flipped .choices__list--dropdown, .is-flipped .choices__list[aria-expanded] {
top: auto;
@ -232,40 +231,39 @@
}
.choices__list--dropdown .choices__item, .choices__list[aria-expanded] .choices__item {
position: relative;
padding: 10px;
font-size: 14px;
padding: var(--choices-dropdown-item-padding, 10px);
font-size: var(--choices-font-size-md, 14px);
}
[dir=rtl] .choices__list--dropdown .choices__item, [dir=rtl] .choices__list[aria-expanded] .choices__item {
text-align: right;
}
@media (min-width: 640px) {
.choices__list--dropdown .choices__item--selectable[data-select-text], .choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
.choices__list--dropdown .choices__item--selectable.is-highlighted[data-select-text], .choices__list[aria-expanded] .choices__item--selectable.is-highlighted[data-select-text] {
padding-right: 100px;
}
.choices__list--dropdown .choices__item--selectable[data-select-text]::after, .choices__list[aria-expanded] .choices__item--selectable[data-select-text]::after {
.choices__list--dropdown .choices__item--selectable.is-highlighted[data-select-text]::after, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted[data-select-text]::after {
content: attr(data-select-text);
font-size: 12px;
opacity: 0;
font-size: var(--choices-font-size-sm, 12px);
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
}
[dir=rtl] .choices__list--dropdown .choices__item--selectable[data-select-text], [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
[dir=rtl] .choices__list--dropdown .choices__item--selectable.is-highlighted[data-select-text], [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable.is-highlighted[data-select-text] {
text-align: right;
padding-left: 100px;
padding-right: 10px;
}
[dir=rtl] .choices__list--dropdown .choices__item--selectable[data-select-text]::after, [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable[data-select-text]::after {
[dir=rtl] .choices__list--dropdown .choices__item--selectable.is-highlighted[data-select-text]::after, [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable.is-highlighted[data-select-text]::after {
right: auto;
left: 10px;
}
}
.choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
background-color: #f2f2f2;
.choices__list--dropdown .choices__item--selectable.is-selected::after, .choices__list[aria-expanded] .choices__item--selectable.is-selected::after {
content: none !important;
}
.choices__list--dropdown .choices__item--selectable.is-highlighted::after, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted::after {
opacity: 0.5;
.choices__list--dropdown .choices__item--selectable.is-selected, .choices__list[aria-expanded] .choices__item--selectable.is-selected, .choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
background-color: var(--choices-highlighted-color, #f2f2f2);
}
.choices__item {
@ -287,7 +285,7 @@
font-weight: 600;
font-size: 12px;
padding: 10px;
border-bottom: 1px solid #f7f7f7;
border-bottom: 1px solid color-mix(in srgb, var(--choices-keyline-color, #ddd) 90%, var(--choices-lighten, white));
color: gray;
}
@ -307,13 +305,13 @@
.choices__input {
display: inline-block;
vertical-align: baseline;
background-color: #f9f9f9;
font-size: 14px;
margin-bottom: 5px;
background-color: var(--choices-bg-color, #f9f9f9);
font-size: var(--choices-font-size-md, 14px);
margin-bottom: var(--choices-input-margin-bottom, 5px);
border: 0;
border-radius: 0;
max-width: 100%;
padding: 4px 0 4px 2px;
max-width: var(--choices-width, 100%);
padding: var(--choices-input-padding, 4px 0 4px 2px);
}
.choices__input:focus {
outline: 0;
@ -332,7 +330,7 @@
}
.choices__placeholder {
opacity: 0.5;
opacity: var(--choices-placeholder-opacity, 0.5);
}
/* ===== End of Choices ====== */

View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../src/styles/choices.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AA2BA;EACE;EACA;EACA,eApBkB;EAqBlB,WAxBqB;;AA0BrB;EACE;;AAGF;EACE;;AAGF;EACE;;AAIA;AAAA;EAEE,kBAlCsB;EAmCtB;EACA;;AAEF;EACE;;AAIJ;EACE;;;AAIJ;EACE;;AACA;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE,kBApDyB;EAqDzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAGJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIA;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAOJ;AAAA;EACE;;AAEF;AAAA;EACE;EACA;EACA;EACA;EACA;EACA,aA5HoB;EA6HpB;EACA;EACA,kBA9HiB;EA+HjB,iBAjIuB;EAkIvB,OAlIuB;EAmIvB;EACA;EACA;;AAEA;AAAA;AAAA;EAEE;;;AAKN;EACE;EACA;EACA;EACA,kBA1JiB;EA2JjB;EACA;EACA,eA/JsB;EAgKtB,WAnKqB;EAoKrB;EACA;;AAEA;EAEE;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;;AAOF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;;AAIJ;EACE;;AACA;EACE;EACA;EACA,eA9MyB;EA+MzB;EACA,WAnNmB;EAoNnB;EACA;EACA;EACA,kBA9MoB;EA+MpB;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA,SApOgB;EAqOhB;EACA;EACA,kBAjP0B;EAkP1B;EACA;EACA;EACA,2BAzPsB;EA0PtB,4BA1PsB;EA2PtB;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA,WA1RmB;;AA4RnB;EACE;;AAKA;EADF;IAEI;;EAEA;IACE;IACA,WAtSa;IAuSb;IACA;IACA;IACA;IACA;;EAGF;IACE;IACA;IACA;;EAEA;IACE;IACA;;;AAMR;EACE;;AAEA;EACE;;;AAUR;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA,WAzVqB;EA0VrB;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA,kBA5WiB;EA6WjB,WAlXqB;EAmXrB;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAIE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;;;AAGF","file":"choices.css"}
{"version":3,"sourceRoot":"","sources":["../../../src/styles/choices.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAiDA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAIA;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;;;AAIJ;EACE;;AACA;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIA;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAMJ;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;;AAOF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;;AAIJ;EACE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEA;EACE;;AAKA;EADF;IAEI;;EAEA;IACE;IACA;IACA;IACA;IACA;IACA;;EAGF;IACE;IACA;IACA;;EAEA;IACE;IACA;;;AAQN;EACE;;AAIJ;EAEE;;;AASN;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA,WArXqB;EAsXrB;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAIE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;;;AAGF","file":"choices.css"}

File diff suppressed because one or more lines are too long

View file

@ -54,28 +54,17 @@
<link rel="stylesheet" href="assets/styles/choices.min.css" />
<script src="assets/scripts/choices.js"></script>
<!-- End Choices includes -->
<!--[if lt IE 9]>
<style>
.hidden-ie {
display: none;
}
.visible-ie {
display: block;
}
</style>
<![endif]-->
</head>
<body>
<div class="container">
<div class="section">
<a href="https://github.com/jshjohnson/Choices" class="logo">
<img
src="assets/images/logo.svg"
alt="Choices.js logo"
class="logo-img hidden-ie"
/>
<picture style="display: flex">
<source media="(prefers-color-scheme: dark)" srcset="assets/images/logo--dark.svg" class="logo-img source-dark">
<source media="(prefers-color-scheme: light)" srcset="assets/images/logo.svg" class="logo-img source-light">
<img src="assets/images/logo.svg" alt="Choices.js logo" class="logo-img">
</picture>
<h1 class="visible-ie">Choices.js</h1>
</a>
<p>
@ -548,6 +537,37 @@
<button type="reset">Reset</button>
</form>
<hr />
<h2>Form validation</h2>
<p>Try submitting the form first.</p>
<p>
<small>Then try setting the values as they are required!</small>
</p>
<form data-test-hook="invalid-form" style="margin-bottom:0">
<div data-test-hook="invalid-select">
<label for="invalid-select">Change me!</label>
<select class="form-control" name="reset-simple" id="invalid-select" required>
<option value selected>-</option>
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
<option value="Option 3">Option 3</option>
<option value="Option 4">Option 4</option>
<option value="Option 5">Option 5</option>
</select>
</div>
<div data-test-hook="invalid-input">
<label for="invalid-input">And me!</label>
<input
class="form-control"
id="invalid-input"
type="text"
placeholder="Enter something"
required
/>
</div>
<button type="submit">Submit</button>
</form>
</div>
</div>
<script>
@ -944,6 +964,21 @@
allowHTML: true,
removeItemButton: true,
});
var invalidText = new Choices(
document.getElementById('invalid-input'),
{
allowHTML: true,
delimiter: ',',
editItems: true,
maxItemCount: 5,
removeItemButton: true,
}
);
var invalidSelect = new Choices(document.getElementById('invalid-select'), {
allowHTML: true,
});
});
</script>

View file

@ -155,6 +155,9 @@ declare class Choices {
_displayNotice(text: string, type: NoticeType, openDropdown?: boolean): void;
_clearNotice(): void;
_renderNotice(fragment?: DocumentFragment): void;
/**
* @deprecated Use utils.getChoiceForOutput
*/
_getChoiceForOutput(choice: ChoiceFull, keyCode?: number): EventChoice;
_triggerChange(value: any): void;
_handleButtonAction(element: HTMLElement): void;
@ -193,6 +196,14 @@ declare class Choices {
_onFocus({ target }: Pick<FocusEvent, 'target'>): void;
_onBlur({ target }: Pick<FocusEvent, 'target'>): void;
_onFormReset(): void;
_onChange(event: Event & {
target: HTMLInputElement | HTMLSelectElement;
}): void;
_onInvalid(): void;
/**
* Removes any highlighted choice options
*/
_removeHighlightedChoices(): void;
_highlightChoice(el?: HTMLElement | null): void;
_addItem(item: ChoiceFull, withEvents?: boolean, userTriggered?: boolean): void;
_removeItem(item: ChoiceFull): void;

View file

@ -27,6 +27,8 @@ export default class Container {
close(): void;
addFocusState(): void;
removeFocusState(): void;
addInvalidState(): void;
removeInvalidState(): void;
enable(): void;
disable(): void;
wrap(element: HTMLElement): void;

View file

@ -1,4 +1,5 @@
import { StringUntrusted } from './string-untrusted';
import { StringPreEscaped } from './string-pre-escaped';
import { Types } from './types';
import { GroupFull } from './group-full';
export interface ChoiceFull {
@ -8,7 +9,7 @@ export interface ChoiceFull {
itemEl?: HTMLElement;
choiceEl?: HTMLElement;
labelClass?: Array<string>;
labelDescription?: string;
labelDescription?: StringPreEscaped | StringUntrusted | string;
customProperties?: Types.CustomProperties;
disabled: boolean;
active: boolean;

View file

@ -50,6 +50,8 @@ export interface ClassNames {
flippedState: string | Array<string>;
/** @default ['is-loading'] */
loadingState: string | Array<string>;
/** @default ['is-invalid'] */
invalidState: string | Array<string>;
/** @default ['choices__notice'] */
notice: string | Array<string>;
/** @default ['choices__item--selectable', 'add-choice'] */

View file

@ -1,10 +1,11 @@
import { StringUntrusted } from './string-untrusted';
import { StringPreEscaped } from './string-pre-escaped';
import { Types } from './types';
export interface InputChoice {
id?: number;
highlighted?: boolean;
labelClass?: string | Array<string>;
labelDescription?: string;
labelDescription?: StringPreEscaped | StringUntrusted | string;
customProperties?: Types.CustomProperties;
disabled?: boolean;
active?: boolean;

View file

@ -186,7 +186,7 @@ export interface Options {
*
* @default
* ```
* (value, valueRaw) => `Remove item`;
* (value, valueRaw, item) => `Remove item`;
* ```
*/
removeItemIconText: string | Types.NoticeStringFunction;
@ -200,7 +200,7 @@ export interface Options {
*
* @default
* ```
* (value, valueRaw) => `Remove item: ${value}`;
* (value, valueRaw, item) => `Remove item: ${value}`;
* ```
*/
removeItemLabelText: string | Types.NoticeStringFunction;
@ -296,6 +296,14 @@ export interface Options {
* @default true
*/
searchChoices: boolean;
/**
* Whether disabled choices should be included in search results. If `true`, disabled choices will appear in search results but still cannot be selected.
*
* **Input types affected:** select-one, select-multiple
*
* @default false
*/
searchDisabledChoices: boolean;
/**
* The minimum length a search value should be before choices are searched.
*
@ -431,6 +439,14 @@ export interface Options {
* @default 'auto';
*/
renderSelectedChoices: 'auto' | 'always' | boolean;
/**
* Whether selected choices should be removed from the list during search.
*
* **Input types affected:** select-multiple
*
* @default false;
*/
searchRenderSelectedChoices: boolean;
/**
* The text that is shown whilst choices are being populated via AJAX.
*
@ -562,5 +578,5 @@ export interface Options {
* @default null
*/
callbackOnCreateTemplates: CallbackOnCreateTemplatesFn | null;
appendGroupInSearch: false;
appendGroupInSearch: boolean;
}

View file

@ -38,7 +38,8 @@ export interface Store {
*/
get activeChoices(): ChoiceFull[];
/**
* Get choices that can be searched (excluding placeholders)
* Get choices that can be searched (excluding placeholders,
* optionally excluding disabled based on config)
*/
get searchableChoices(): ChoiceFull[];
/**

View file

@ -1,11 +1,12 @@
import { StringUntrusted } from './string-untrusted';
import { StringPreEscaped } from './string-pre-escaped';
import { EventChoice } from './event-choice';
export declare namespace Types {
type StrToEl = (str: string) => HTMLElement | HTMLInputElement | HTMLOptionElement;
type EscapeForTemplateFn = (allowHTML: boolean, s: StringUntrusted | StringPreEscaped | string) => string;
type GetClassNamesFn = (s: string | Array<string>) => string;
type StringFunction = () => string;
type NoticeStringFunction = (value: string, valueRaw: string) => string;
type NoticeStringFunction = (value: string, valueRaw: string, item?: EventChoice) => string;
type NoticeLimitFunction = (maxItemCount: number) => string;
type FilterFunction = (value: string) => boolean;
type ValueCompareFunction = (value1: string, value2: string) => boolean;

View file

@ -3,15 +3,17 @@ import { StringUntrusted } from '../interfaces/string-untrusted';
import { StringPreEscaped } from '../interfaces/string-pre-escaped';
import { ChoiceFull } from '../interfaces/choice-full';
import { Types } from '../interfaces/types';
import { EventChoice } from '../interfaces';
export declare const generateId: (element: HTMLInputElement | HTMLSelectElement, prefix: string) => string;
export declare const getAdjacentEl: (startEl: HTMLElement, selector: string, direction?: number) => HTMLElement | null;
export declare const isScrolledIntoView: (element: HTMLElement, parent: HTMLElement, direction?: number) => boolean;
export declare const sanitise: <T>(value: T | StringUntrusted | StringPreEscaped | string) => T | string;
export declare const strToEl: (str: string) => Element;
export declare const resolveNoticeFunction: (fn: Types.NoticeStringFunction | string, value: string) => string;
export declare const resolveStringFunction: (fn: Types.StringFunction | string) => string;
export declare const unwrapStringForRaw: (s?: StringUntrusted | StringPreEscaped | string) => string;
export declare const unwrapStringForEscaped: (s?: StringUntrusted | StringPreEscaped | string) => string;
export declare const getChoiceForOutput: (choice: ChoiceFull, keyCode?: number) => EventChoice;
export declare const resolveNoticeFunction: (fn: Types.NoticeStringFunction | string, value: StringUntrusted | StringPreEscaped | string, item?: EventChoice) => string;
export declare const escapeForTemplate: (allowHTML: boolean, s: StringUntrusted | StringPreEscaped | string) => string;
export declare const setElementHtml: (el: HTMLElement, allowHtml: boolean, html: StringUntrusted | StringPreEscaped | string) => void;
export declare const sortByAlpha: ({ value, label }: Types.RecordToCompare, { value: value2, label: label2 }: Types.RecordToCompare) => number;