mirror of
https://github.com/Choices-js/Choices.git
synced 2026-03-14 14:45:47 +01:00
deploy: d76abba362
This commit is contained in:
parent
758ccaae62
commit
b0911cdfd3
29 changed files with 1378 additions and 796 deletions
10
assets/images/logo--dark.svg
Normal file
10
assets/images/logo--dark.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 14 KiB |
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
4
assets/scripts/choices.min.js
vendored
4
assets/scripts/choices.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
4
assets/scripts/choices.search-basic.min.js
vendored
4
assets/scripts/choices.search-basic.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
4
assets/scripts/choices.search-kmp.min.js
vendored
4
assets/scripts/choices.search-kmp.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
4
assets/scripts/choices.search-prefix.min.js
vendored
4
assets/scripts/choices.search-prefix.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -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;
|
||||
}());
|
||||
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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"}
|
||||
2
assets/styles/base.min.css
vendored
2
assets/styles/base.min.css
vendored
|
|
@ -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}
|
||||
|
|
@ -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 ====== */
|
||||
|
|
|
|||
|
|
@ -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"}
|
||||
2
assets/styles/choices.min.css
vendored
2
assets/styles/choices.min.css
vendored
File diff suppressed because one or more lines are too long
67
index.html
67
index.html
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
11
types/src/scripts/choices.d.ts
vendored
11
types/src/scripts/choices.d.ts
vendored
|
|
@ -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;
|
||||
|
|
|
|||
2
types/src/scripts/components/container.d.ts
vendored
2
types/src/scripts/components/container.d.ts
vendored
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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'] */
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
22
types/src/scripts/interfaces/options.d.ts
vendored
22
types/src/scripts/interfaces/options.d.ts
vendored
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
3
types/src/scripts/interfaces/store.d.ts
vendored
3
types/src/scripts/interfaces/store.d.ts
vendored
|
|
@ -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[];
|
||||
/**
|
||||
|
|
|
|||
3
types/src/scripts/interfaces/types.d.ts
vendored
3
types/src/scripts/interfaces/types.d.ts
vendored
|
|
@ -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;
|
||||
|
|
|
|||
4
types/src/scripts/lib/utils.d.ts
vendored
4
types/src/scripts/lib/utils.d.ts
vendored
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue