diff --git a/cypress/e2e/perf-resize-throttle.cy.ts b/cypress/e2e/perf-resize-throttle.cy.ts new file mode 100644 index 0000000..46b0e1a --- /dev/null +++ b/cypress/e2e/perf-resize-throttle.cy.ts @@ -0,0 +1,71 @@ +/** cSpell:ignore vscomp */ + +// Tests for P1: the global window 'resize' handler used to run per-instance height +// recomputation on every resize tick, unthrottled, and threw if a wrapper had no instance. + +describe('Performance: window resize handler (P1)', () => { + const mountId = 'vs-p1-resize'; + + const mount = (win: Window) => { + const doc = win.document; + const existing = doc.getElementById(mountId); + if (existing) { + existing.remove(); + } + const $ele = doc.createElement('div'); + $ele.id = mountId; + doc.body.appendChild($ele); + // @ts-expect-error - VirtualSelect attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, options: [{ label: 'A', value: 'a' }, { label: 'B', value: 'b' }] }); + return $ele; + }; + + it('throttles resize so onResize runs far fewer times than resize events fire', () => { + cy.visit('get-started'); + cy.window().then((win) => { + mount(win); + // @ts-expect-error - instance back-reference + const instance = win.document.getElementById(mountId).virtualSelect; + cy.spy(instance, 'onResize').as('onResize'); + + for (let i = 0; i < 10; i += 1) { + win.dispatchEvent(new win.Event('resize')); + } + }); + + // allow the trailing-edge call to fire + cy.wait(250); + cy.get('@onResize').its('callCount').should('be.greaterThan', 0).and('be.lessThan', 10); + }); + + it('still updates the dropdown on resize (no regression)', () => { + cy.visit('get-started'); + cy.window().then((win) => mount(win)); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option').should('have.length.greaterThan', 0); + + cy.window().then((win) => win.dispatchEvent(new win.Event('resize'))); + cy.wait(150); + + // dropdown remains open and functional after a resize + cy.get(`#${mountId}`).find('.vscomp-ele-wrapper').should('not.have.class', 'closed'); + cy.get(`#${mountId}`).find('.vscomp-options-container').should('exist'); + }); + + it('does not throw when a wrapper has no associated instance (guard)', () => { + cy.visit('get-started'); + cy.window().then((win) => { + const doc = win.document; + const orphan = doc.createElement('div'); + orphan.innerHTML = '
'; // parent has no .virtualSelect + doc.body.appendChild(orphan); + + // would throw "Cannot read properties of undefined (reading 'onResize')" without the guard + win.dispatchEvent(new win.Event('resize')); + }); + + // if the handler threw, Cypress would have failed the test on the uncaught exception + cy.get('body').should('exist'); + }); +}); diff --git a/cypress/e2e/timer-cleanup.cy.ts b/cypress/e2e/timer-cleanup.cy.ts new file mode 100644 index 0000000..0cb4306 --- /dev/null +++ b/cypress/e2e/timer-cleanup.cy.ts @@ -0,0 +1,69 @@ +/** cSpell:ignore vscomp */ + +// Tests for P4: pending setTimeout callbacks were not cleared on destroy(), so they could run +// against a destroyed instance. Timers now go through setManagedTimeout and are cleared in destroy(). + +describe('Hardening: managed timeouts cleared on destroy (P4)', () => { + const mountId = 'vs-p4-timers'; + + const mount = (win: Window) => { + const doc = win.document; + const existing = doc.getElementById(mountId); + if (existing) { + existing.remove(); + } + const $ele = doc.createElement('div'); + $ele.id = mountId; + doc.body.appendChild($ele); + // @ts-expect-error - VirtualSelect attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, options: [{ label: 'A', value: 'a' }, { label: 'B', value: 'b' }] }); + return $ele.virtualSelect; + }; + + it('cancels a pending managed timeout when the instance is destroyed', () => { + cy.visit('get-started'); + // Use a synthetic clock so the negative assertion (timer must NOT fire) is deterministic. + // With a real-time cy.wait, CI timer-throttling could delay a still-pending 50ms callback + // past the wait window, making the test pass even if destroy() failed to clear it. + cy.clock(); + cy.window().then((win) => { + // @ts-expect-error - test marker + win.__managedTimerFired = false; + const instance = mount(win); + instance.setManagedTimeout(() => { + // @ts-expect-error - test marker + win.__managedTimerFired = true; + }, 50); + instance.destroy(); + }); + + // Advance well past the 50ms timeout; a cleared timer can never fire, a leaked one would. + cy.tick(150); + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__managedTimerFired, 'managed timeout must not fire after destroy').to.eq(false); + }); + }); + + it('does not throw when destroying right after an option select (no regression)', () => { + cy.visit('get-started'); + cy.window().then((win) => mount(win)); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="a"]').click(); + + cy.window().then((win) => { + const $ele = win.document.getElementById(mountId); + // @ts-expect-error - instance back-reference + $ele.virtualSelect.destroy(); + }); + + cy.wait(50); + cy.get('body').should('exist'); + cy.window().then((win) => { + const $ele = win.document.getElementById(mountId); + // @ts-expect-error - instance back-reference + expect($ele.virtualSelect, 'instance reference cleared on destroy').to.eq(undefined); + }); + }); +}); diff --git a/dist/virtual-select.js b/dist/virtual-select.js index 3f05bf8..49401f0 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -230,6 +230,67 @@ class Utils { static containsHTMLorJS(text) { return /<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(text); } + + /** + * Remove characters that could break out of the double-quoted class attribute + * (`"`, `<`, `>`). Valid CSS class tokens never contain these characters, so legitimate + * class names are left untouched while attribute-injection via classNames is prevented. + * @static + * @param {string} classNames + * @return {string} + * @memberof Utils + */ + static sanitizeClassNames(classNames) { + return classNames ? String(classNames).replace(/["<>]/g, '') : classNames; + } + + /** + * Rate-limit a function so it runs at most once per `wait` ms (leading + trailing edge). + * Used to keep high-frequency events (e.g. window resize) from running per-instance work + * on every tick. + * @static + * @param {Function} callback + * @param {number} wait + * @return {Function} + * @memberof Utils + */ + static throttle(callback, wait) { + /** @type {ReturnType | null} */ + let timeout = null; + /** @type {unknown[]} */ + let lastArgs = []; + /** @type {unknown} */ + let lastThis; + let previous = 0; + + /** @this {unknown} */ + return function throttled(/** @type {unknown[]} */...args) { + const now = Date.now(); + const remaining = wait - (now - previous); + lastArgs = args; + lastThis = this; + if (remaining <= 0 || remaining > wait) { + if (timeout) { + clearTimeout(timeout); + timeout = null; + } + previous = now; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + } else if (!timeout) { + timeout = setTimeout(() => { + previous = Date.now(); + timeout = null; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + }, remaining); + } + }; + } } ;// ./src/utils/dom-utils.js @@ -765,6 +826,13 @@ class VirtualSelect { } = Utils; let groupName = ''; if (markSearchResults) { + /** + * Search input is regex-escaped (no ReDoS). The (?!([^<]+)?>) lookahead avoids inserting + * inside a tag; it relies on option labels being escaped via enableSecureText. When + * enableSecureText is off, labels are rendered as raw HTML by design (the consumer opts into + * this), so this highlight does not introduce an additional injection vector beyond the raw + * HTML the consumer already chose to render. + */ searchRegex = new RegExp(`(${Utils.regexEscape(this.searchValue)})(?!([^<]+)?>)`, 'gi'); } if (this.multiple) { @@ -790,7 +858,8 @@ class VirtualSelect { const isSelected = convertToBoolean(d.isSelected); let ariaDisabledText = ''; if (d.classNames) { - optionClasses += ` ${d.classNames}`; + /** sanitize so a consumer-provided class string cannot break out of the class attribute */ + optionClasses += ` ${Utils.sanitizeClassNames(d.classNames)}`; } if (d.isFocused) { tabIndexValue = '0'; @@ -815,8 +884,17 @@ class VirtualSelect { optionClasses += ' group-option'; groupIndexText = `data-group-index="${d.groupIndex}"`; if (d.customData) { - groupName = d.customData.group_name !== undefined ? `${d.customData.group_name}, ` : ''; - optionDesc = d.customData.description !== undefined ? ` ${d.customData.description},` : ''; + /** + * customData fields are interpolated into the aria-label attribute, so they must be + * escaped the same way as label/value (via secureText). Otherwise a quote in + * group_name/description can break out of the attribute even when enableSecureText + * is on - an XSS bypass. secureText is a no-op when enableSecureText is disabled, + * keeping the existing behaviour for consumers that intentionally pass raw text. + */ + const groupNameText = this.secureText(Utils.getString(d.customData.group_name)); + const groupDescText = this.secureText(Utils.getString(d.customData.description)); + groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; + optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; } else { ariaLabel = `aria-label="${groupName}, ${d.label}"`; @@ -916,7 +994,7 @@ class VirtualSelect { this.addEvent(this.$options, 'click', 'onOptionsClick'); this.addEvent(this.$options, 'mouseover', 'onOptionsMouseOver'); this.addEvent(this.$options, 'touchmove', 'onOptionsTouchMove'); - VirtualSelect.observeDomChanges(); + this.addMutationObserver(); } addEvent($ele, events, method, capture = false) { if (!$ele) { @@ -970,6 +1048,7 @@ class VirtualSelect { if (this.$dropboxContainerTop) { this.removeEvent(this.$dropboxContainerTop, 'focus', 'onDropboxContainerTopOrBottomFocus'); } + this.removeMutationObserver(); } removeEvent($ele, events, method, capture = false) { if (!$ele) { @@ -1171,40 +1250,38 @@ class VirtualSelect { this.setOptionsContainerHeight(true); } - /** - * Single shared observer (instead of one body-wide subtree observer per instance) that - * self-destroys any VirtualSelect whose host element is removed from the DOM. This works - * in every mode - so removing the element without calling destroy() no longer leaks the - * addEvents() listeners (notably the capture-phase document click listener that retains - * the instance and its DOM). Inspecting removedNodes makes the cost proportional to the - * number of removed nodes rather than the number of live instances. - */ - static observeDomChanges() { - if (VirtualSelect.domObserver) { + /** to remove dropboxWrapper on removing vscomp-ele when it is rendered outside of vscomp-ele */ + addMutationObserver() { + if (!this.hasDropboxWrapper) { return; } - VirtualSelect.domObserver = new MutationObserver(mutations => { + const $vscompEle = this.$ele; + this.mutationObserver = new MutationObserver(mutations => { + let isAdded = false; + let isRemoved = false; mutations.forEach(mutation => { - mutation.removedNodes.forEach($node => { - if ($node.nodeType !== Node.ELEMENT_NODE) { - return; - } - const $eles = $node.classList.contains('vscomp-ele') ? [$node] : []; - $node.querySelectorAll('.vscomp-ele').forEach($ele => $eles.push($ele)); - $eles.forEach($ele => { - /** isConnected is false only when the node was genuinely detached (not moved/re-added) */ - if (!$ele.isConnected && $ele.virtualSelect) { - $ele.virtualSelect.destroy(); - } - }); - }); + if (!isAdded) { + isAdded = [...mutation.addedNodes].some($ele => !!($ele === $vscompEle || $ele.contains($vscompEle))); + } + if (!isRemoved) { + isRemoved = [...mutation.removedNodes].some($ele => !!($ele === $vscompEle || $ele.contains($vscompEle))); + } }); + if (isRemoved && !isAdded) { + this.destroy(); + } }); - VirtualSelect.domObserver.observe(document.documentElement, { + this.mutationObserver.observe(document.querySelector('body'), { childList: true, subtree: true }); } + removeMutationObserver() { + if (this.mutationObserver) { + this.mutationObserver.disconnect(); + this.mutationObserver = null; + } + } /** dom event methods - end */ /** before event methods - start */ @@ -1226,7 +1303,7 @@ class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.setSearchValue(''); this.focusSearchInput(); }, 0); @@ -1287,7 +1364,7 @@ class VirtualSelect { this.setOptionsPosition(); this.setOptionsTooltip(); if (document.activeElement !== this.$searchInput) { - setTimeout(() => { + this.setManagedTimeout(() => { const focusedOption = DomUtils.getElementsBySelector('.focused', this.$dropboxContainer)[0]; if (focusedOption !== undefined) { focusedOption.focus({ @@ -2739,8 +2816,9 @@ class VirtualSelect { DomUtils.removeClass(this.$allWrappers, 'closed'); DomUtils.changeTabIndex(this.$allWrappers, 0); if (!isSilent) { - // Force synchronous layout and style calculation - // Trigger reflow + // INTENTIONAL forced reflow (do not remove as a "no-op"): reading offsetHeight flushes + // the 'transition: none' set above so restoring the transition below does not animate the + // open from a stale layout. Scoped to a single element on open, so the cost is negligible. this.$dropboxContainer.offsetHeight; // eslint-disable-line no-unused-expressions // Restore transitions immediately after reflow this.$dropboxContainer.style.transition = originalTransition; @@ -3096,7 +3174,7 @@ class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3232,7 +3310,7 @@ class VirtualSelect { this.setValue(selectedValues); /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3468,6 +3546,28 @@ class VirtualSelect { DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); return !hasError; } + + /** + * setTimeout wrapper whose pending timers are tracked so they can be cleared on destroy(). + * Prevents callbacks from running against a destroyed instance (stale DOM access / retention). + */ + setManagedTimeout(callback, delay) { + if (!this.managedTimeouts) { + this.managedTimeouts = new Set(); + } + const id = setTimeout(() => { + this.managedTimeouts.delete(id); + callback(); + }, delay); + this.managedTimeouts.add(id); + return id; + } + clearManagedTimeouts() { + if (this.managedTimeouts) { + this.managedTimeouts.forEach(id => clearTimeout(id)); + this.managedTimeouts.clear(); + } + } destroy() { const { $ele @@ -3490,6 +3590,9 @@ class VirtualSelect { this.serverSearchTimeout = null; } + // Clear any other pending timeouts so their callbacks don't run on a destroyed instance + this.clearManagedTimeouts(); + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -3732,25 +3835,36 @@ class VirtualSelect { static toggleRequiredMethod(isRequired) { return this.virtualSelect.toggleRequired(isRequired); } + + // Stable reference to the throttled resize handler is assigned at module init time + // (see `VirtualSelect.onResizeThrottled = ...` near the global resize listener). + static onResizeMethod() { document.querySelectorAll('.vscomp-ele-wrapper').forEach($ele => { - $ele.parentElement.virtualSelect.onResize(); + /** guard against wrappers whose instance is mid-teardown / not initialised */ + const instance = $ele.parentElement && $ele.parentElement.virtualSelect; + if (instance) { + instance.onResize(); + } }); } /** static methods - end */ } document.addEventListener('reset', VirtualSelect.onFormReset); document.addEventListener('submit', VirtualSelect.onFormSubmit); -window.addEventListener('resize', VirtualSelect.onResizeMethod); +/** + * throttle resize so the per-instance height recompute runs at most ~10x/sec during a drag. + * Keep a stable reference on VirtualSelect so the listener can be removed later if needed. + */ +const onResizeThrottled = Utils.throttle(VirtualSelect.onResizeMethod, 100); +VirtualSelect.onResizeThrottled = onResizeThrottled; +window.addEventListener('resize', onResizeThrottled); attrPropsMapping = VirtualSelect.getAttrProps(); window.VirtualSelect = VirtualSelect; // Static property for tracking open dropdowns VirtualSelect.openInstances = new Set(); -// Single shared MutationObserver that self-destroys instances whose host element is removed -VirtualSelect.domObserver = null; - // Static property for tracking the last interacted instance VirtualSelect.lastInteractedInstance = null; diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 280862d..645eae4 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.2.0 * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) - */!function(){"use strict";const e=/[^\p{L}\p{N}_]/gu;class t{static getString(e){return e||0===e?e.toString():""}static convertToBoolean(e,t=!1){let s;return s=!0===e||"true"===e||!1!==e&&"false"!==e&&t,s}static isEmpty(e){let t=!1;return e?Array.isArray(e)?0===e.length&&(t=!0):"object"==typeof e&&0===Object.keys(e).length&&(t=!0):t=!0,t}static isNotEmpty(e){return!t.isEmpty(e)}static normalizeValues(e){if(Array.isArray(e)){const t=new Array(e.length);for(let s=0;s!!e):[]}static getRandomInt(e,t=0){const s=Math.ceil(t),i=Math.floor(e);return Math.floor(Math.random()*(i-s-1))+s}static regexEscape(e){return e.replace(/[-/\\^$*+?.()|[\]{}]/g,"\\$&")}static normalizeString(t){return t.normalize("NFD").replace(e,"")}static willTextOverflow(e,t){const s=document.createElement("div");s.style.position="absolute",s.style.visibility="hidden",s.style.whiteSpace="nowrap",s.style.fontSize=window.getComputedStyle(e).fontSize,s.style.fontFamily=window.getComputedStyle(e).fontFamily,s.textContent=t,document.body.appendChild(s);const i=s.clientWidth;return document.body.removeChild(s),i>e.clientWidth}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static containsHTML(e){return/<[a-z][\s\S]*>/i.test(e)}static containsHTMLorJS(e){return/<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(e)}}class s{static addClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.add(...i)})}static removeClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.remove(...i)})}static toggleClass(e,t,i){if(!e)return;let o;void 0!==i&&(o=Boolean(i)),s.getElements(e).forEach(e=>{e.classList.toggle(t,o)})}static hasClass(e,t){return!!e&&e.classList.contains(t)}static hasEllipsis(e){return!!e&&e.scrollWidth>e.offsetWidth}static getData(e,t,s){if(!e)return;let i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}static setData(e,t,s){e&&(e.dataset[t]=s)}static setAttr(e,t,s){e&&e.setAttribute(t,s)}static setAttrFromEle(e,t,s,i){const o={};s.forEach(t=>{o[t]=e.getAttribute(t)}),s.forEach(e=>{const s=o[e];(s||-1!==i.indexOf(e)&&""===s)&&t.setAttribute(e,s)})}static setStyle(e,t,s){e&&(e.style[t]=s)}static setStyles(e,t){e&&t&&Object.keys(t).forEach(s=>{e.style[s]=t[s]})}static setAria(e,t,s){if(!e)return;let i=t;"role"!==i&&(i=`aria-${i}`),e.setAttribute(i,s)}static getElements(e){return e?void 0===e.forEach?[e]:e:[]}static getElementsBySelector(e="",t=void 0){let s;const i=void 0!==t?t:document;return""!==e&&(s=i.querySelectorAll(e)),void 0!==s?Array.from(s):[]}static addEvent(e,i,o,n){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{s.getElements(e).forEach(e=>{e.addEventListener(t,o,{capture:n})})})}static dispatchEvent(e,t,i=!1){if(!e)return;const o=s.getElements(e);setTimeout(()=>{o.forEach(e=>{e.dispatchEvent(new CustomEvent(t,{bubbles:i}))})},0)}static getAttributesText(e){let t="";return e?(Object.entries(e).forEach(([e,s])=>{void 0!==s&&(t+=` ${e}="${s}" `)}),t):t}static convertPropToDataAttr(e){return e?`data-${e}`.replace(/([A-Z])/g,"-$1").toLowerCase():""}static changeTabIndex(e,t){e?s.getElements(e).forEach(e=>{e.tabIndex=t}):console.log(e,"Invalid element provided.")}static removeEvent(e,t,i,o=!1){e&&s.getElements(e).forEach(e=>{e.removeEventListener(t,i,{capture:o})})}}const i={13:"onEnterPress",38:"onUpArrowPress",40:"onDownArrowPress",46:"onBackspaceOrDeletePress",8:"onBackspaceOrDeletePress"},o=["autofocus","disabled","multiple","required"],n=["autofocus","class","disabled","id","multiple","name","placeholder","required"];let r;const a=["additionalClasses","additionalDropboxClasses","additionalDropboxContainerClasses","additionalToggleButtonClasses","aliasKey","allOptionsSelectedText","allowNewOption","alwaysShowSelectedOptionsCount","alwaysShowSelectedOptionsLabel","ariaLabelledby","ariaLabelText","ariaLabelClearButtonText","ariaLabelTagClearButtonText","ariaLabelSearchClearButtonText","autoSelectFirstOption","clearButtonText","descriptionKey","disableAllOptionsSelectedText","disableOptionGroupCheckbox","disableSelectAll","disableValidation","dropboxWidth","dropboxWrapper","emptyValue","enableSecureText","focusSelectedOptionOnOpen","hasOptionDescription","hideClearButton","hideValueTooltipOnSelectAll","keepAlwaysOpen","labelKey","markSearchResults","maxValues","maxWidth","minValues","moreText","noOfDisplayValues","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","selectAllOnlyVisible","selectAllText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let t="vscomp-wrapper",i="vscomp-toggle-button";const o=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),n=this.getTooltipAttrText(this.clearButtonText),r=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",a=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",l=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(t+=` ${this.additionalClasses}`),this.additionalToggleButtonClasses&&(i+=` ${this.additionalToggleButtonClasses}`),this.multiple&&(t+=" multiple",this.disableSelectAll||(t+=" has-select-all")),this.hideClearButton||(t+=" has-clear-button"),this.keepAlwaysOpen?(t+=" keep-always-open",p=!0):t+=" closed",this.showAsPopup&&(t+=" show-as-popup"),this.hasSearch&&(t+=" has-search-input"),this.showValueAsTags&&(t+=" show-value-as-tags"),this.textDirection&&(t+=` text-direction-${this.textDirection}`),this.popupPosition&&(t+=` popup-position-${this.popupPosition.toLowerCase()}`);const h=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:t})}\n
`;this.$ele.innerHTML=h,this.$body=document.querySelector("body"),this.$wrapper=this.$ele.querySelector(".vscomp-wrapper"),this.hasDropboxWrapper?(this.$allWrappers=[this.$wrapper,this.$dropboxWrapper],this.$dropboxContainer=this.$dropboxWrapper.querySelector(".vscomp-dropbox-container"),s.addClass(this.$dropboxContainer,"pop-comp-wrapper")):(this.$allWrappers=[this.$wrapper],this.$dropboxContainer=this.$wrapper.querySelector(".vscomp-dropbox-container")),this.$toggleButton=this.$ele.querySelector(".vscomp-toggle-button"),this.$clearButton=this.$ele.querySelector(".vscomp-clear-button"),this.$valueText=this.$ele.querySelector(".vscomp-value"),this.$hiddenInput=this.$ele.querySelector(".vscomp-hidden-input"),this.$dropbox=this.$dropboxContainer.querySelector(".vscomp-dropbox"),this.$dropboxCloseButton=this.$dropboxContainer.querySelector(".vscomp-dropbox-close-button"),this.$dropboxContainerBottom=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-bottom"),this.$dropboxContainerTop=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-top"),this.$search=this.$dropboxContainer.querySelector(".vscomp-search-wrapper"),this.$optionsContainer=this.$dropboxContainer.querySelector(".vscomp-options-container"),this.$optionsList=this.$dropboxContainer.querySelector(".vscomp-options-list"),this.$options=this.$dropboxContainer.querySelector(".vscomp-options"),this.$noOptions=this.$dropboxContainer.querySelector(".vscomp-no-options"),this.$noSearchResults=this.$dropboxContainer.querySelector(".vscomp-no-search-results"),this.afterRenderWrapper()}renderDropbox({wrapperClasses:e}){const t="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let i="vscomp-dropbox";this.additionalDropboxClasses&&(i+=` ${this.additionalDropboxClasses}`);let o="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(o+=` ${this.additionalDropboxContainerClasses}`);const n=`
\n \n
\n
\n\n
\n
\n\n
\n
\n
\n
\n\n
\n
${this.noOptionsText}
\n
${this.noSearchResultsText}
\n\n \n
\n \n
`;if(t){const i=document.createElement("div");return this.$dropboxWrapper=i,this.hasDropboxWrapper=!0,i.innerHTML=n,t.appendChild(i),s.addClass(i,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(i,"tabindex","-1"),s.setAria(i,"hidden",!0)),""}return this.hasDropboxWrapper=!1,n}renderOptions(){this.calculateAriaMetadata();let e="";const s=this.getVisibleOptions();let i="",o="";const n=!(!this.markSearchResults||!this.searchValue);let r;const{labelRenderer:a,disableOptionGroupCheckbox:l,uniqueId:p,searchGroup:h}=this,c="function"==typeof a,{convertToBoolean:u}=t;let d="";if(n&&(r=new RegExp(`(${t.regexEscape(this.searchValue)})(?!([^<]+)?>)`,"gi")),this.multiple&&(i=''),this.allowNewOption){const e=this.getTooltipAttrText("New Option");o=``}s.forEach(t=>{const{index:s}=t;let v,b="vscomp-option";const f=this.getTooltipAttrText("",!0,!0);let m=i,g="",O="",y="",x="",S="-1";const $=u(t.isSelected);let C="";if(t.classNames&&(b+=` ${t.classNames}`),t.isFocused&&(S="0",b+=" focused"),t.isDisabled&&(b+=" disabled",C='aria-disabled="true"'),t.isGroupTitle&&(d=t.label,b+=" group-title",l&&(m="")),$&&(b+=" selected"),t.isGroupOption){let e="";b+=" group-option",y=`data-group-index="${t.groupIndex}"`,t.customData?(d=void 0!==t.customData.group_name?`${t.customData.group_name}, `:"",e=void 0!==t.customData.description?` ${t.customData.description},`:"",x=`aria-label="${d} ${t.label}, ${e}"`):x=`aria-label="${d}, ${t.label}"`}v=c?a(t):t.label,t.description&&(O=`
${t.description}
`),t.isCurrentNew?(b+=" current-new",g+=o):!n||t.isGroupTitle&&!h||(v=v.replace(r,"$1"));let w="";this.ariaSetSize>0&&(w=`aria-setsize="${this.ariaSetSize}"`,t.filteredIndex&&(w+=` aria-posinset="${t.filteredIndex}"`)),e+=`
\n ${m}\n \n ${v}\n \n ${O}\n ${g}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",t="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${this.ariaLabelSearchClearButtonText}"`:"";t=`\n \n ×`}const s=`
\n ${e}\n ${t}\n
`;this.$search.innerHTML=s,this.$searchInput=this.$dropboxContainer.querySelector(".vscomp-search-input"),this.$searchClear=this.$dropboxContainer.querySelector(".vscomp-search-clear"),this.$toggleAllButton=this.$dropboxContainer.querySelector(".vscomp-toggle-all-button"),this.$toggleAllCheckbox=this.$dropboxContainer.querySelector(".vscomp-toggle-all-checkbox"),this.addEvent(this.$searchInput,"input","onSearch"),this.addEvent(this.$searchInput,"change","preventPropagation"),this.addEvent(this.$searchClear,"click keydown","onSearchClear"),this.addEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.addEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.addEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}addEvents(){this.addEvent(document,"click","onDocumentClick",!0),this.addEvent(this.$allWrappers,"keydown","onKeyDown"),this.addEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.addEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.addEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.addEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.addEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.addEvent(this.$options,"click","onOptionsClick"),this.addEvent(this.$options,"mouseover","onOptionsMouseOver"),this.addEvent(this.$options,"touchmove","onOptionsTouchMove"),l.observeDomChanges()}addEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`;let r=this.events[i];r||(r=this[o].bind(this),this.events[i]=r),s.addEvent(e,t,r,n)})}removeEvents(){this.removeEvent(document,"click","onDocumentClick",!0),this.removeEvent(this.$allWrappers,"keydown","onKeyDown"),this.removeEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.removeEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.removeEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.removeEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.removeEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.removeEvent(this.$options,"click","onOptionsClick"),this.removeEvent(this.$options,"mouseover","onOptionsMouseOver"),this.removeEvent(this.$options,"touchmove","onOptionsTouchMove"),this.$searchInput&&(this.removeEvent(this.$searchInput,"input","onSearch"),this.removeEvent(this.$searchInput,"change","preventPropagation"),this.$searchClear&&(this.removeEvent(this.$searchClear,"click","onSearchClear"),this.removeEvent(this.$searchClear,"keydown","onSearchClear"))),this.$toggleAllButton&&this.removeEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.$dropboxContainerBottom&&this.removeEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.$dropboxContainerTop&&this.removeEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}removeEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`,r=this.events[i];r&&s.removeEvent(e,t,r,n)})}onDocumentClick(e){const t=e.target.closest(".vscomp-wrapper");if(!t)return void l.openInstances.forEach(e=>{const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox()});const s=t.parentElement.virtualSelect;s&&s!==this&&this.isOpened()&&!this.keepAlwaysOpen&&(this.shouldFocusWrapperOnClose=!1,this.closeDropbox())}onKeyDown(e){const t=e.which||e.keyCode,s=i[t];if(document.activeElement!==this.$searchInput||e.shiftKey||9!==t||this.multiple||(e.preventDefault(),this.focusFirstVisibleOption()),document.activeElement!==this.$toggleAllButton||13!==t){if(27===t||"Escape"===e.key){const e=this.showAsPopup?this.$wrapper:this.$dropboxWrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}else this.toggleAllOptions()}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}onDownArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"next"}):this.openDropbox())}onUpArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"previous"}):this.openDropbox())}onBackspaceOrDeletePress(e){e.target===this.$wrapper&&(e.preventDefault(),this.selectedValues.length>0&&this.reset())}onToggleButtonPress(e){if("keydown"===e.type){if("Enter"!==e.code&&"Space"!==e.code)return;e.preventDefault()}const t=e.target;if(t.closest(".vscomp-value-tag-clear-button"))return e.stopPropagation(),void this.removeValue(t.closest(".vscomp-value-tag"));t.closest(".toggle-button-child")||this.toggleDropbox()}onClearButtonClick(e){"click"===e.type?this.reset():"keydown"!==e.type||"Enter"!==e.code&&"Space"!==e.code||(e.stopPropagation(),this.reset())}onOptionsScroll(){this.setVisibleOptions(!0)}onOptionsClick(e){const t=e.target.closest(".vscomp-option");t&&!s.hasClass(t,"disabled")&&(s.hasClass(t,"group-title")?this.onGroupTitleClick(t):this.selectOption(t,{event:e}))}onGroupTitleClick(e){if(!e||!this.multiple||this.disableOptionGroupCheckbox)return;const t=!s.hasClass(e,"selected");this.toggleGroupTitleCheckbox(e,t),this.toggleGroupOptions(e,t)}onDropboxContainerClick(e){e.target.closest(".vscomp-dropbox")||this.closeDropbox()}onDropboxCloseButtonClick(){this.closeDropbox()}onOptionsMouseOver(e){const t=e.target.closest(".vscomp-option");t&&this.isOpened()&&(s.hasClass(t,"disabled")||s.hasClass(t,"group-title")?this.removeOptionFocus():this.focusOption({$option:t}))}onOptionsTouchMove(){this.removeOptionFocus()}onSearch(e){e.stopPropagation(),this.setSearchValue(e.target.value,!0)}preventPropagation(e){e.stopPropagation()}onSearchClear(e){e.stopPropagation(),"Enter"!==e.code&&"Space"!==e.code&&"click"!==e.type||(this.setSearchValue(""),this.focusSearchInput())}onToggleAllOptions(){this.toggleAllOptions()}onDropboxContainerTopOrBottomFocus(){this.closeDropbox()}onResize(){this.setOptionsContainerHeight(!0)}static observeDomChanges(){l.domObserver||(l.domObserver=new MutationObserver(e=>{e.forEach(e=>{e.removedNodes.forEach(e=>{if(e.nodeType!==Node.ELEMENT_NODE)return;const t=e.classList.contains("vscomp-ele")?[e]:[];e.querySelectorAll(".vscomp-ele").forEach(e=>t.push(e)),t.forEach(e=>{!e.isConnected&&e.virtualSelect&&e.virtualSelect.destroy()})})})}),l.domObserver.observe(document.documentElement,{childList:!0,subtree:!0}))}beforeValueSet(e){this.toggleAllOptionsClass(!e&&void 0)}beforeSelectNewValue(e){const t=this.getNewOption();if(t){const e=t.index;this.newValues.push(t.value),this.setOptionProp(e,"isCurrentNew",!1),this.setOptionProp(e,"isNew",!0)}else e&&(this.setNewOption(e),this.toggleSelectedProp(this.lastOptionIndex,!0));setTimeout(()=>{this.setSearchValue(""),this.focusSearchInput()},0)}afterRenderWrapper(){s.addClass(this.$ele,"vscomp-ele"),this.renderSearch(),this.setEleStyles(),this.setDropboxStyles(),this.setVisibleOptionsCount(),this.setOptionsContainerHeight(),this.addEvents(),this.setEleProps(),this.keepAlwaysOpen||this.showAsPopup||this.initDropboxPopover(),this.initialSelectedValue?this.setValueMethod(this.initialSelectedValue,this.silentInitialValueSet):this.autoSelectFirstOption&&this.visibleOptions.length&&this.setValueMethod(this.visibleOptions[0].value,this.silentInitialValueSet),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),this.initialDisabled&&this.disable(),this.autofocus&&this.focus()}afterRenderOptions(){const e=this.getVisibleOptions(),t=!this.options.length&&!this.hasServerSearch,i=!t&&!e.length;(!this.allowNewOption||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(s.toggleClass(this.$allWrappers,"has-no-search-results",i),i?(s.setAttr(this.$noSearchResults,"tabindex","0"),s.setAttr(this.$noSearchResults,"aria-hidden","false")):(s.setAttr(this.$noSearchResults,"tabindex","-1"),s.setAttr(this.$noSearchResults,"aria-hidden","true"))),s.toggleClass(this.$allWrappers,"has-no-options",t),t?(s.setAttr(this.$noOptions,"tabindex","0"),s.setAttr(this.$noOptions,"aria-hidden","false")):(s.setAttr(this.$noOptions,"tabindex","-1"),s.setAttr(this.$noOptions,"aria-hidden","true")),this.setOptionAttr(),this.setOptionsPosition(),this.setOptionsTooltip(),document.activeElement!==this.$searchInput&&setTimeout(()=>{const e=s.getElementsBySelector(".focused",this.$dropboxContainer)[0];void 0!==e&&e.focus({preventScroll:!0})},20)}afterSetOptionsContainerHeight(e){e&&this.showAsPopup&&this.setVisibleOptions()}afterSetSearchValue(){this.hasServerSearch?(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=setTimeout(()=>{this.serverSearch()},this.searchDelay)):this.setVisibleOptionsCount(),this.selectAllOnlyVisible&&this.toggleAllOptionsClass(),this.focusOption({focusFirst:!0})}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),e||this.reset()}setProps(e){const s=this.setDefaultProps(e);this.setPropsFromElementAttr(s);const{convertToBoolean:i}=t;this.$ele=s.ele,this.dropboxWrapper=s.dropboxWrapper,this.valueKey=s.valueKey,this.labelKey=s.labelKey,this.descriptionKey=s.descriptionKey,this.aliasKey=s.aliasKey,this.optionHeightText=s.optionHeight,this.optionHeight=parseFloat(this.optionHeightText),this.multiple=i(s.multiple),this.hasSearch=i(s.search),this.searchByStartsWith=i(s.searchByStartsWith),this.searchGroup=i(s.searchGroup),this.hideClearButton=i(s.hideClearButton),this.autoSelectFirstOption=i(s.autoSelectFirstOption),this.hasOptionDescription=i(s.hasOptionDescription),this.silentInitialValueSet=i(s.silentInitialValueSet),this.allowNewOption=i(s.allowNewOption),this.markSearchResults=i(s.markSearchResults),this.showSelectedOptionsFirst=i(s.showSelectedOptionsFirst),this.disableSelectAll=i(s.disableSelectAll),this.keepAlwaysOpen=i(s.keepAlwaysOpen),this.showDropboxAsPopup=i(s.showDropboxAsPopup),this.hideValueTooltipOnSelectAll=i(s.hideValueTooltipOnSelectAll),this.showOptionsOnlyOnSearch=i(s.showOptionsOnlyOnSearch),this.selectAllOnlyVisible=i(s.selectAllOnlyVisible),this.alwaysShowSelectedOptionsCount=i(s.alwaysShowSelectedOptionsCount),this.alwaysShowSelectedOptionsLabel=i(s.alwaysShowSelectedOptionsLabel),this.disableAllOptionsSelectedText=i(s.disableAllOptionsSelectedText),this.showValueAsTags=i(s.showValueAsTags),this.disableOptionGroupCheckbox=i(s.disableOptionGroupCheckbox),this.enableSecureText=i(s.enableSecureText),this.setValueAsArray=i(s.setValueAsArray),this.disableValidation=i(s.disableValidation),this.initialDisabled=i(s.disabled),this.required=i(s.required),this.autofocus=i(s.autofocus),this.useGroupValue=i(s.useGroupValue),this.focusSelectedOptionOnOpen=i(s.focusSelectedOptionOnOpen),this.noOptionsText=s.noOptionsText,this.noSearchResultsText=s.noSearchResultsText,this.selectAllText=s.selectAllText,this.searchNormalize=s.searchNormalize,this.searchPlaceholderText=s.searchPlaceholderText,this.searchFormLabel=s.searchFormLabel,this.optionsSelectedText=s.optionsSelectedText,this.optionSelectedText=s.optionSelectedText,this.allOptionsSelectedText=s.allOptionsSelectedText,this.clearButtonText=s.clearButtonText,this.moreText=s.moreText,this.placeholder=s.placeholder,this.position=s.position,this.textDirection=s.textDirection,this.dropboxWidth=s.dropboxWidth,this.tooltipFontSize=s.tooltipFontSize,this.tooltipAlignment=s.tooltipAlignment,this.tooltipMaxWidth=s.tooltipMaxWidth,this.updatePositionThrottle=s.updatePositionThrottle,this.noOfDisplayValues=parseInt(s.noOfDisplayValues),this.zIndex=parseInt(s.zIndex),this.maxValues=parseInt(s.maxValues),this.minValues=parseInt(s.minValues),this.name=this.secureText(s.name),this.additionalClasses=s.additionalClasses,this.additionalDropboxClasses=s.additionalDropboxClasses,this.additionalDropboxContainerClasses=s.additionalDropboxContainerClasses,this.additionalToggleButtonClasses=s.additionalToggleButtonClasses,this.popupDropboxBreakpoint=s.popupDropboxBreakpoint,this.popupPosition=s.popupPosition,this.onServerSearch=s.onServerSearch,this.labelRenderer=s.labelRenderer,this.selectedLabelRenderer=s.selectedLabelRenderer,this.initialSelectedValue=0===s.selectedValue?"0":s.selectedValue,this.emptyValue=s.emptyValue,this.ariaLabelText=s.ariaLabelText,this.ariaLabelledby=s.ariaLabelledby,this.ariaLabelClearButtonText=s.ariaLabelClearButtonText,this.ariaLabelTagClearButtonText=s.ariaLabelTagClearButtonText,this.ariaLabelSearchClearButtonText=s.ariaLabelSearchClearButtonText,this.maxWidth=s.maxWidth,this.searchDelay=s.searchDelay,this.showDuration=parseInt(s.showDuration),this.hideDuration=parseInt(s.hideDuration),this.selectedValues=[],this.selectedOptions=[],this.newValues=[],this.events={},this.tooltipEnterDelay=200,this.searchValue="",this.searchValueOriginal="",this.isAllSelected=!1,(void 0===s.search&&this.multiple||this.allowNewOption||this.showOptionsOnlyOnSearch)&&(this.hasSearch=!0),this.hasServerSearch="function"==typeof this.onServerSearch,(this.maxValues||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(this.disableSelectAll=!0,this.disableOptionGroupCheckbox=!0),this.keepAlwaysOpen&&(this.dropboxWrapper="self"),this.showAsPopup=this.showDropboxAsPopup&&!this.keepAlwaysOpen&&window.innerWidth<=parseFloat(this.popupDropboxBreakpoint),this.hasSearchContainer=this.hasSearch||this.multiple&&!this.disableSelectAll,this.optionsCount=this.getOptionsCount(s.optionsCount),this.halfOptionsCount=Math.ceil(this.optionsCount/2),this.optionsHeight=this.getOptionsHeight(),this.uniqueId=this.getUniqueId(),this.shouldFocusWrapperOnClose=!0,this.ariaSetSize=0}setDefaultProps(e){const t={dropboxWrapper:"self",valueKey:"value",labelKey:"label",descriptionKey:"description",aliasKey:"alias",ariaLabelText:"Options list",ariaLabelClearButtonText:"Clear button",ariaLabelTagClearButtonText:"Remove option",ariaLabelSearchClearButtonText:"Clear search input",optionsCount:5,noOfDisplayValues:50,optionHeight:"40px",noOptionsText:"No options found",noSearchResultsText:"No results found",selectAllText:"Select All",searchNormalize:!1,searchPlaceholderText:"Search...",searchFormLabel:"Search",clearButtonText:"Clear",moreText:"more...",optionsSelectedText:"options selected",optionSelectedText:"option selected",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:e.keepAlwaysOpen?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return e.hasOptionDescription&&(t.optionsCount=4,t.optionHeight="50px"),Object.assign(t,e)}setPropsFromElementAttr(e){const t=e.ele;Object.keys(r).forEach(s=>{let i=t.getAttribute(s);-1===o.indexOf(s)||""!==i&&"true"!==i||(i=!0),i&&(e[r[s]]=i)})}setEleProps(){const{$ele:e}=this;e.virtualSelect=this,e.value=this.multiple?[]:"",e.name=this.name,e.disabled=!1,e.required=this.required,e.autofocus=this.autofocus,e.multiple=this.multiple,e.form=e.closest("form"),e.reset=l.reset,e.setValue=l.setValueMethod,e.setOptions=l.setOptionsMethod,e.setDisabledOptions=l.setDisabledOptionsMethod,e.setEnabledOptions=l.setEnabledOptionsMethod,e.toggleSelectAll=l.toggleSelectAll,e.isAllSelected=l.isAllSelected,e.addOption=l.addOptionMethod,e.getNewValue=l.getNewValueMethod,e.getDisplayValue=l.getDisplayValueMethod,e.getSelectedOptions=l.getSelectedOptionsMethod,e.getDisabledOptions=l.getDisabledOptionsMethod,e.open=l.openMethod,e.close=l.closeMethod,e.focus=l.focusMethod,e.enable=l.enableMethod,e.disable=l.disableMethod,e.destroy=l.destroyMethod,e.validate=l.validateMethod,e.toggleRequired=l.toggleRequiredMethod,this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=this)}setValueMethod(e,s){const i={},o={};let n=[];const r=this.multiple;let a=t.normalizeValues(e);if(a){if(Array.isArray(a)||(a=[a]),r){const{maxValues:e}=this;e&&a.length>e&&a.splice(e)}else a.length>1&&(a=[a[0]]);this.useGroupValue&&(a=this.setGroupOptionsValue(a)),a.forEach((e,t)=>{i[e]=!0,o[e]=t}),this.allowNewOption&&a&&this.setNewOptionsFromValue(a)}this.options.forEach(e=>{const s=t.normalizeValues(e.value);!0!==i[s]||e.isDisabled||e.isGroupTitle?e.isSelected=!1:(e.isSelected=!0,n.push(e.value))}),r?(this.hasOptionGroup&&this.setGroupsSelectedProp(),n.sort((e,s)=>o[t.normalizeValues(e)]-o[t.normalizeValues(s)])):[n]=n,this.beforeValueSet(),this.setValue(n,{disableEvent:s}),this.afterValueSet()}setGroupOptionsValue(e){const t=[],s={},i={};return e.forEach(e=>{i[e]=!0}),this.options.forEach(e=>{const{value:o}=e,n=!0===i[o];e.isGroupTitle?n&&(s[e.index]=!0):(n||s[e.groupIndex])&&t.push(o)}),t}setGroupsSelectedProp(){const e=this.isAllGroupOptionsSelected.bind(this);this.options.forEach(t=>{t.isGroupTitle&&(t.isSelected=e(t.index))})}setOptionsMethod(e,t){this.setOptions(e),this.afterSetOptions(t)}setDisabledOptionsMethod(e,t=!1){this.setDisabledOptions(e,!0),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setDisabledOptions(e,t=!1){let s=[];if(e)if(!0===e)t&&this.options.forEach(e=>(e.isDisabled=!0,s.push(e.value),e));else{s=e.map(e=>e.toString());const i={};s.forEach(e=>{i[e]=!0}),t&&this.options.forEach(e=>(e.isDisabled=!0===i[e.value],e))}else t&&this.options.forEach(e=>(e.isDisabled=!1,e));this.disabledOptions=s}setEnabledOptionsMethod(e,t=!1){this.setEnabledOptions(e),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setEnabledOptions(e){if(void 0===e)return;const t=[];if(!0===e)this.options.forEach(e=>(e.isDisabled=!1,e));else{const s={};e.forEach(e=>{s[e]=!0}),this.options.forEach(e=>{const i=!0!==s[e.value];return e.isDisabled=i,i&&t.push(e.value),e})}this.disabledOptions=t}setOptions(e=[]){const s=[],i=this.disabledOptions.length,{valueKey:o,labelKey:n,descriptionKey:r,aliasKey:a,hasOptionDescription:l}=this,{getString:p,convertToBoolean:h}=t,c=this.secureText.bind(this),u=this.getAlias.bind(this);let d=0,v=!1;const b={};let f=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const m=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const g=c(p(e[o])),O=c(p(e[n])),y=e.options,x=!!y,S={index:d,value:g,valueNormalized:g.toLowerCase(),label:O,labelNormalized:this.searchNormalize&&""!==O.trim()?t.normalizeString(O).toLowerCase():O.toLowerCase(),alias:u(e[a]),isVisible:h(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:x,classNames:e.classNames};if(f||""!==g||(f=!0),i&&(S.isDisabled=!0===b[g]),e.isGroupOption&&(S.isGroupOption=!0,S.groupIndex=e.groupIndex),l){const s=c(p(e[r]));S.description=s,S.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(S.customData=e.customData),s.push(S),d+=1,x){const e=S.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,m(t)})}};Array.isArray(e)&&e.forEach(m);const g=s.length,{$ele:O}=this;O.options=s,O.length=g,this.options=s,this.visibleOptionsCount=g,this.lastOptionIndex=g-1,this.newValues=[],this.hasOptionGroup=v,this.hasEmptyValueOption=f,this.setSortedOptions()}setServerOptions(e=[]){this.setOptionsMethod(e,!0);const{selectedOptions:t}=this,i=this.options;let o=!1;if(t.length){const e={};o=!0,i.forEach(t=>{e[t.value]=!0}),t.forEach(t=>{!0!==e[t.value]&&(t.isVisible=!1,i.push(t))}),this.setOptionsMethod(i,!0)}this.allowNewOption&&this.searchValue&&(i.some(e=>e.label.toLowerCase()===this.searchValue)||(o=!0,this.setNewOption())),o?(this.setVisibleOptionsCount(),this.multiple&&this.toggleAllOptionsClass(),this.setValueText()):this.updatePosition(),this.setVisibleOptionsCount(),s.removeClass(this.$allWrappers,"server-searching")}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){let e=[...this.options];this.showSelectedOptionsFirst&&this.selectedValues.length&&(e=this.hasOptionGroup?this.sortOptionsGroup(e):this.sortOptions(e)),this.sortedOptions=e}setVisibleOptions(){let e=[...this.sortedOptions];const t=2*this.optionsCount,s=this.getVisibleStartIndex(),i=this.getNewOption(),o=s+t-1;let n=0;i&&(i.visibleIndex=n,n+=1),e=e.filter(e=>{let t=!1;return e.isVisible&&!e.isCurrentNew&&(t=n>=s&&n<=o,e.visibleIndex=n,n+=1),t}),i&&(e=[i,...e]),this.visibleOptions=e,this.visibleOptionsCount=e.length,this.renderOptions()}setOptionsPosition(e){const t=parseInt((e||this.getVisibleStartIndex())*this.optionHeight);this.$options.style.transform=`translate3d(0, ${t}px, 0)`,s.setData(this.$options,"top",t)}setOptionsTooltip(){const e=this.getVisibleOptions(),{hasOptionDescription:t}=this;e.forEach(e=>{const i=this.$dropboxContainer.querySelector(`.vscomp-option[data-index="${e.index}"]`);s.setData(i.querySelector(".vscomp-option-text"),"tooltip",e.label),t&&s.setData(i.querySelector(".vscomp-option-description"),"tooltip",e.description)})}setValue(e,{disableEvent:i=!1,disableValidation:o=!1}={}){const n=t.normalizeValues(e);this.hasEmptyValueOption&&""===n||n?Array.isArray(n)?this.selectedValues=[...n]:this.selectedValues=[n]:this.selectedValues=[];const r=this.getValue();this.$ele.value=r,this.$hiddenInput.value=this.getInputValue(r),this.isMaxValuesSelected=!!(this.maxValues&&this.maxValues<=this.selectedValues.length),this.toggleAllOptionsClass(),this.setValueText();const a=t.isNotEmpty(this.selectedValues);s.toggleClass(this.$allWrappers,"has-value",a),s.toggleClass(this.$allWrappers,"max-value-selected",this.isMaxValuesSelected),s.setAttr(this.$clearButton,"tabindex",a?"0":"-1"),s.setAria(this.$clearButton,"hidden",!1===a),o||this.validate(),i||s.dispatchEvent(this.$ele,"change",!0)}setValueText(){const{multiple:e,selectedValues:i,noOfDisplayValues:o,showValueAsTags:n,$valueText:r,selectedLabelRenderer:a}=this,l=[];let p=[];const h=i.length;let c=0;const u=this.isAllSelected&&!this.hasServerSearch&&!this.disableAllOptionsSelectedText&&!n;if(u&&this.hideValueTooltipOnSelectAll)r.innerHTML=`${this.allOptionsSelectedText} (${h})`;else{this.getSelectedOptions({fullDetails:!0,keepSelectionOrder:!0}).some(e=>{if(e.isCurrentNew)return!1;if(c>=o)return!0;let{label:s}=e;if("function"==typeof a&&(s=a(e)),l.push(s),c+=1,n){const i=t.willTextOverflow(r.parentElement,s)?this.getTooltipAttrText(s,!1,!0):"";let o="";this.ariaLabelTagClearButtonText&&(o=`aria-label="${s.replace(/<[^>]+>/gi,"").trim()}, ${this.ariaLabelTagClearButtonText}"`);const n=`\n ${s}\n \n \n \n `;p.push(n)}else p.push(s);return!1});const i=h-o;i>0&&p.push(`+ ${i} ${this.moreText}`);const d=l.join(", ");if(""===d)r.innerHTML=this.placeholder;else if(r.innerHTML=d,e){const{maxValues:e}=this;if(this.alwaysShowSelectedOptionsCount||s.hasEllipsis(r)||e||n){let t=`${h}`;if(e&&(t+=` / ${e}`),u)r.innerHTML=`${this.allOptionsSelectedText} (${h})`;else if(n)r.innerHTML=p.join(""),this.$valueTags=r.querySelectorAll(".vscomp-value-tag"),this.setValueTagAttr();else if(!this.alwaysShowSelectedOptionsLabel){const e=1===h?this.optionSelectedText:this.optionsSelectedText;r.innerHTML=`${t} ${e}`}}else p=[]}}let d="";0===h?d=this.placeholder:n||(d=p.join(", ")),n||s.setData(r,"tooltip",d),e&&(n?this.updatePosition():s.setData(r,"tooltipEllipsisOnly",0===h))}setSearchValue(e,t=!1,i=!1){if(e===this.searchValueOriginal&&!i)return;t||(this.$searchInput.value=e);const o=e.replace(/\\/g,"").toLowerCase().trim();this.searchValue=o,this.searchValueOriginal=e,s.toggleClass(this.$allWrappers,"has-search-value",e),s.setAttr(this.$searchClear,"tabindex",""!==e?"0":"-1"),s.setAria(this.$searchClear,"hidden",""===e),this.afterSetSearchValue()}setVisibleOptionsCount(){let e,s=0,i=!1;const{searchGroup:o,showOptionsOnlyOnSearch:n,searchByStartsWith:r}=this;let{searchValue:a}=this;a=this.searchNormalize&&""!==a.trim()?t.normalizeString(a):a;const l=this.isOptionVisible.bind(this);this.hasOptionGroup&&(e=this.getVisibleOptionGroupsMapping(a)),this.options.forEach(t=>{if(t.isCurrentNew)return;let p;n&&!a?(t.isVisible=!1,p={isVisible:!1,hasExactOption:!1}):p=l({data:t,searchValue:a,hasExactOption:i,visibleOptionGroupsMapping:e,searchGroup:o,searchByStartsWith:r}),p.isVisible&&(s+=1),i||(i=p.hasExactOption)}),this.allowNewOption&&(a&&!i?(this.setNewOption(),s+=1):this.removeNewOption()),this.visibleOptionsCount=s,this.afterSetVisibleOptionsCount()}calculateAriaMetadata(){let e=0,t=0;if((this.sortedOptions&&this.sortedOptions.length?this.sortedOptions:this.options).forEach(s=>{if(s.isCurrentNew)s.filteredIndex=void 0;else if(!0===s.isVisible){const i=s.isGroupTitle&&this.multiple&&!this.disableOptionGroupCheckbox;!s.isGroupTitle||i?(t+=1,e+=1,s.filteredIndex=t):s.filteredIndex=void 0}else s.filteredIndex=void 0}),this.allowNewOption){const s=this.getNewOption();s&&!0===s.isVisible?(t+=1,e+=1,s.filteredIndex=t):s&&(s.filteredIndex=void 0)}this.ariaSetSize=e}setOptionProp(e,t,s){this.options[e]&&(this.options[e][t]=s)}setOptionsHeight(){this.$optionsList.style.height=this.optionHeight*this.visibleOptionsCount+"px"}setOptionsContainerHeight(e){let t;e?this.showAsPopup&&(this.optionsCount=this.getOptionsCount(),this.halfOptionsCount=Math.ceil(this.optionsCount/2),t=this.getOptionsHeight(),this.optionsHeight=t):(t=this.optionsHeight,this.keepAlwaysOpen&&(s.setStyle(this.$noOptions,"height",t),s.setStyle(this.$noSearchResults,"height",t))),s.setStyle(this.$optionsContainer,"max-height",t),this.afterSetOptionsContainerHeight(e)}setNewOption(e){const t=e||this.searchValueOriginal.trim();if(!t)return;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",this.secureText(t)),this.setOptionProp(e,"label",this.secureText(t))}else{const s={value:t,label:t};e?(s.isNew=!0,this.newValues.push(t)):s.isCurrentNew=!0,this.addOption(s)}}setSelectedProp(){const e={};this.selectedValues.forEach(t=>{e[t]=!0}),this.options.forEach(t=>{!0===e[t.value]&&(t.isSelected=!0)})}setNewOptionsFromValue(e){if(!e)return;const t=this.setNewOption.bind(this),s={};this.options.forEach(e=>{s[e.value]=!0}),e.forEach(e=>{e&&!0!==s[e]&&t(e)})}setDropboxWrapperWidth(){if(this.showAsPopup)return;const e=this.dropboxWidth||`${this.$wrapper.offsetWidth}px`;s.setStyle(this.$dropboxContainer,"max-width",e)}setEleStyles(){const{maxWidth:e}=this,t={};e&&(t["max-width"]=e),s.setStyles(this.$ele,t)}setDropboxStyles(){const{dropboxWidth:e}=this,t={},i={"z-index":this.zIndex};e&&(this.showAsPopup?t["max-width"]=e:i.width=e),s.setStyles(this.$dropboxContainer,i),s.setStyles(this.$dropbox,t)}setOptionAttr(){const{$visibleOptions:e}=this,{options:t}=this,i=`${this.optionHeight}px`,{setStyle:o,getData:n,setData:r}=s;e&&e.length&&e.forEach(e=>{const s=t[n(e,"index")];o(e,"height",i),r(e,"value",s.value)})}setValueTagAttr(){const{$valueTags:e}=this;if(!e||!e.length)return;const{getData:t,setData:i}=s,{options:o}=this;e.forEach(e=>{const s=t(e,"index");if(void 0!==s){const t=o[s];i(e,"value",t.value)}})}setScrollTop(){const{selectedValues:e}=this;if(this.showSelectedOptionsFirst||!this.focusSelectedOptionOnOpen||0===e.length)return;const t={};let s;e.forEach(e=>{t[e]=!0}),this.options.some(e=>!!t[e.value]&&(s=e.visibleIndex,!0)),s&&(this.$optionsContainer.scrollTop=this.optionHeight*s)}getVisibleOptions(){return this.visibleOptions||[]}getValue(){let e;return e=this.multiple?this.useGroupValue?this.getGroupValue():this.selectedValues:this.selectedValues[0]||"",t.normalizeValues(e)}getGroupValue(){const e=[],t={};return this.options.forEach(s=>{if(!s.isSelected)return;const{value:i}=s;s.isGroupTitle?i&&(t[s.index]=!0,e.push(i)):!0!==t[s.groupIndex]&&e.push(i)}),e}getInputValue(e){let t=e;return t&&t.length?this.setValueAsArray&&this.multiple&&(t=JSON.stringify(t)):t=this.emptyValue,t}getFirstVisibleOptionIndex(){return Math.ceil(this.$optionsContainer.scrollTop/this.optionHeight)}getVisibleStartIndex(){let e=this.getFirstVisibleOptionIndex()-this.halfOptionsCount;return e<0&&(e=0),e}getTooltipAttrText(e,i=!1,o=!1){const n={"data-tooltip":(t.containsHTML(e)?t.replaceDoubleQuotesWithHTML(e):e)||"","data-tooltip-enter-delay":this.tooltipEnterDelay,"data-tooltip-z-index":this.zIndex,"data-tooltip-font-size":this.tooltipFontSize,"data-tooltip-alignment":this.tooltipAlignment,"data-tooltip-max-width":this.tooltipMaxWidth,"data-tooltip-ellipsis-only":i,"data-tooltip-allow-html":o};return s.getAttributesText(n)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=i(s(e.value)),n=i(s(e.label)),r=i(s(e.description));return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:n,labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:r,descriptionNormalized:this.searchNormalize&&""!==r.trim()?t.normalizeString(r).toLowerCase():r.toLowerCase(),alias:this.getAlias(e.alias),isCurrentNew:e.isCurrentNew||!1,isNew:e.isNew||!1,isVisible:!0}}getNewOption(){const e=this.options[this.lastOptionIndex];if(e&&e.isCurrentNew)return e}getOptionIndex(e){let t;return this.options.some(s=>s.value===e&&(t=s.index,!0)),t}getNewValue(){const e={};this.newValues.forEach(t=>{e[t]=!0});const t=this.selectedValues.filter(t=>!0===e[t]);return this.multiple?t:t[0]}getAlias(e){let t=e;return t&&(t=Array.isArray(t)?t.join(","):t.toString().trim(),t=t.toLowerCase()),t||""}getDisplayValue(){const e=[];return this.options.forEach(t=>{t.isSelected&&e.push(t.label)}),this.multiple?e:e[0]||""}getSelectedOptions({fullDetails:e=!1,keepSelectionOrder:t=!1}={}){const{valueKey:s,labelKey:i,selectedValues:o}=this,n=[];if(this.options.forEach(t=>{if(t.isSelected&&!t.isGroupTitle)if(e)n.push(t);else{const e={[s]:t.value,[i]:t.label};t.isNew&&(e.isNew=!0),t.customData&&(e.customData=t.customData),n.push(e)}}),t){const e={};o.forEach((t,s)=>{e[t]=s}),n.sort((t,s)=>e[t.value]-e[s.value])}return this.multiple||e?n:n[0]}getDisabledOptions(){const{valueKey:e,labelKey:t,disabledOptions:s}=this,i={},o=[];return s.forEach(e=>{i[e]=!0}),this.options.forEach(({value:s,label:n})=>{i[s]&&o.push({[e]:s,[t]:n})}),o}getVisibleOptionGroupsMapping(e){let{options:t}=this;const s={},i=this.isOptionVisible.bind(this);return t=this.structureOptionGroup(t),t.forEach(t=>{s[t.index]=t.options.some(t=>i({data:t,searchValue:e}).isVisible)}),s}getOptionsCount(e){let t;if(this.showAsPopup){let e=80*window.innerHeight/100-48;this.hasSearchContainer&&(e-=40),t=Math.floor(e/this.optionHeight)}else t=parseInt(e);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}getSibling(e,t){const i="next"===t?"nextElementSibling":"previousElementSibling";let o=e;do{o&&(o=o[i])}while(s.hasClass(o,"disabled")||s.hasClass(o,"group-title"));return o}getUniqueId(){const e=t.getRandomInt(1e4);return document.querySelector(`#vscomp-ele-wrapper-${e}`)?this.getUniqueId():e}initDropboxPopover(){const e={ele:this.$ele,target:this.$dropboxContainer,position:this.position,zIndex:this.zIndex,margin:4,transitionDistance:30,hideArrowIcon:!0,disableManualAction:!0,disableUpdatePosition:!this.hasDropboxWrapper,updatePositionThrottle:this.updatePositionThrottle,showDuration:this.showDuration,hideDuration:this.hideDuration,afterShow:this.afterShowPopper.bind(this),afterHide:this.afterHidePopper.bind(this)};this.dropboxPopover=new PopoverComponent(e)}openDropbox(e){l.lastInteractedInstance=this;let t="";e||(t=this.$dropboxContainer.style.transition,this.$dropboxContainer.style.transition="none"),this.isSilentOpen=e,l.openInstances.forEach(e=>{if(e!==this){const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox(!0)}}),l.openInstances.add(this),s.setAttr(this.$dropboxWrapper,"tabindex","0"),s.setAria(this.$dropboxWrapper,"hidden",!1),s.setAttr(this.$dropboxContainerTop,"tabindex","0"),s.setAria(this.$dropboxContainerTop,"hidden",!1),s.setAttr(this.$dropboxContainerBottom,"tabindex","0"),s.setAria(this.$dropboxContainerBottom,"hidden",!1),e?s.setStyle(this.$dropboxContainer,"display","inline-flex"):(s.dispatchEvent(this.$ele,"beforeOpen"),s.setAria(this.$wrapper,"expanded",!0)),this.setDropboxWrapperWidth(),s.removeClass(this.$allWrappers,"closed"),s.changeTabIndex(this.$allWrappers,0),e||(this.$dropboxContainer.offsetHeight,this.$dropboxContainer.style.transition=t),this.dropboxPopover&&!e?this.dropboxPopover.show():this.afterShowPopper()}afterShowPopper(){const e=this.isSilentOpen;this.isSilentOpen=!1,e||(this.moveSelectedOptionsFirst(),this.setScrollTop(),s.addClass(this.$allWrappers,"focused"),this.showAsPopup?(s.addClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!0):this.focusElementOnOpen(),s.dispatchEvent(this.$ele,"afterOpen"))}closeDropbox(e){if(this.isSilentClose=e,l.openInstances.delete(this),!1===this.isOpened())return;if(this.keepAlwaysOpen)return void this.removeOptionFocus();const t=document.activeElement,i=t&&this.$wrapper.contains(t)||this.hasDropboxWrapper&&t&&this.$dropboxWrapper.contains(t);this.shouldFocusWrapperOnClose&&l.lastInteractedInstance===this&&!e&&(null===t||t===document.body||i)&&this.$wrapper.focus(),e?s.setStyle(this.$dropboxContainer,"display",""):(s.dispatchEvent(this.$ele,"beforeClose"),s.setAria(this.$wrapper,"expanded",!1),s.setAria(this.$wrapper,"activedescendant",""),s.setAria(this.$dropboxContainer,"activedescendant","")),this.dropboxPopover&&!e?(this.dropboxPopover.hide(),s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)):this.afterHidePopper(),this.setSearchValue("")}afterHidePopper(){const e=this.isSilentClose;this.isSilentClose=!1,s.removeClass(this.$allWrappers,"focused"),this.removeOptionFocus(),!e&&this.isPopupActive&&(s.removeClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!1),s.addClass(this.$allWrappers,"closed"),e||s.dispatchEvent(this.$ele,"afterClose"),this.shouldFocusWrapperOnClose=!0,s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)}moveSelectedOptionsFirst(){this.$optionsContainer.scrollTop&&this.selectedValues.length||this.setVisibleOptions(),this.showSelectedOptionsFirst&&(this.setSortedOptions(),this.scrollToTop(),this.setVisibleOptions())}toggleDropbox(){l.lastInteractedInstance=this,this.isOpened()?this.closeDropbox():this.openDropbox()}updatePosition(){this.dropboxPopover&&this.isOpened()&&this.$ele.updatePosition()}isOpened(){return!s.hasClass(this.$wrapper,"closed")}focusSearchInput(){const e=this.$searchInput;e&&e.focus()}focusElementOnOpen(){const e=this.$searchInput,t=!this.options.length&&!this.hasServerSearch;if(e)t&&!this.allowNewOption?(s.setAttr(e,"disabled",""),this.$noOptions.focus()):(e.removeAttribute("disabled"),e.focus());else{const e=this.$dropbox.querySelector('[tabindex="0"]');void 0!==s.getData(e,"index")?this.focusOption({direction:"next"}):e?e.focus():this.focusFirstVisibleOption()}}focusFirstVisibleOption(){let e=this.$optionsContainer.querySelector(`[data-index='${this.getFirstVisibleOptionIndex()}']`);e?(s.hasClass(e,"group-title")&&(e=this.getSibling(e,"next")),s.setAttr(e,"tabindex","0"),this.$optionsContainer.scrollTop=this.optionHeight*this.getFirstVisibleOptionIndex(),this.focusOption({focusFirst:!0}),e.focus()):(e=this.$dropbox.querySelector('[tabindex="0"]'),e&&e.focus())}focusOption({direction:e,$option:t,focusFirst:i}={}){const o=this.$dropboxContainer.querySelector(".vscomp-option.focused");let n;if(t)n=t;else if(!o||i){const e=this.getFirstVisibleOptionIndex();n=this.$dropboxContainer.querySelector(`.vscomp-option[data-visible-index="${e}"]`),(s.hasClass(n,"disabled")||s.hasClass(n,"group-title"))&&(n=this.getSibling(n,"next"))}else n=this.getSibling(o,e);n&&n!==o&&(o&&this.toggleOptionFocusedState(o,!1),this.toggleOptionFocusedState(n,!0),this.toggleFocusedProp(s.getData(n,"index"),!0),this.moveFocusedOptionToView(n))}moveFocusedOptionToView(e){const t=e||this.$dropboxContainer.querySelector(".vscomp-option.focused");if(!t)return;let i;const o=this.$optionsContainer.getBoundingClientRect(),n=t.getBoundingClientRect(),r=o.top,a=o.bottom,l=o.height,p=n.top,h=n.bottom,c=n.height,u=t.offsetTop,d=s.getData(this.$options,"top","number");r>p?i=u+d:a{if(e.isDisabled||e.isGroupTitle||!e.isVisible||e.isSelected)return;const{index:t}=e;if(t>o&&t{e(parseInt(t))})}setTimeout(()=>{this.renderOptions()},0)}toggleAllOptions(e){if(!this.multiple||this.disableSelectAll)return;const t="boolean"==typeof isSelected?e:!s.hasClass(this.$toggleAllCheckbox,"checked"),i=[],{selectAllOnlyVisible:o}=this;this.options.forEach(e=>{const s=e;if(s.isDisabled||s.isCurrentNew)return;const{isVisible:n,isSelected:r}=s;!t&&(!o||n||!r)||t&&o&&!n&&!r?s.isSelected=!1:(s.isSelected=!0,s.isGroupTitle||i.push(s.value))}),this.toggleAllOptionsClass(t),this.setValue(i),this.renderOptions()}toggleAllOptionsClass(e){if(!this.multiple)return;let t=!1;"boolean"==typeof e||(e=this.isAllOptionsSelected()),!e&&this.selectAllOnlyVisible&&""!==this.searchValue&&(this.visibleOptionsCount>0||""===this.searchValue)&&(t=this.isAllOptionsSelected(!0)),s.toggleClass(this.$toggleAllCheckbox,"checked",e||t),this.isAllSelected=e}isAllOptionsSelected(e){let t=!1;return this.options.length&&this.selectedValues.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&(!e||t.isVisible))),t}isAllGroupOptionsSelected(e){let t=!1;return this.options.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&t.groupIndex===e)),t}toggleGroupOptionsParent(e,t){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;let i=s.getData(e,"groupIndex");void 0!==i&&(i=parseInt(i));const o=this.$options.querySelector(`.vscomp-option[data-index="${i}"]`),n="boolean"==typeof t?t:this.isAllGroupOptionsSelected(i);this.toggleGroupTitleCheckbox(o,n),this.toggleGroupTitleProp(i,n)}toggleGroupTitleProp(e,t){const s="boolean"==typeof t?t:this.isAllGroupOptionsSelected(e);this.toggleSelectedProp(e,s)}toggleGroupOptions(e,i){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;const o=s.getData(e,"index","number"),{selectedValues:n,selectAllOnlyVisible:r}=this,a={},{removeItemFromArray:l}=t;n.forEach(e=>{a[e]=!0}),this.options.forEach(e=>{if(e.isDisabled||e.groupIndex!==o)return;const{value:t}=e;!i||r&&!e.isVisible?(e.isSelected=!1,a[t]&&l(n,t)):(e.isSelected=!0,a[t]||n.push(t))}),this.toggleAllOptionsClass(!!i&&null),this.setValue(n),setTimeout(()=>{this.renderOptions()},0)}toggleGroupTitleCheckbox(e,t){if(!e)return;const i=s.getData(e,"index","number");this.toggleSelectedProp(i,t),this.toggleOptionSelectedState(e,t)}toggleFocusedProp(e,t=!1){this.focusedOptionIndex&&this.setOptionProp(this.focusedOptionIndex,"isFocused",!1),this.setOptionProp(e,"isFocused",t),this.focusedOptionIndex=e}toggleSelectedProp(e,t=!1){this.setOptionProp(e,"isSelected",t)}scrollToTop(){const{scrollTop:e}=this.$optionsContainer;e>0&&(this.$optionsContainer.scrollTop=0)}reset(e=!1,t=!1){this.options.forEach(e=>{e.isSelected=!1}),this.beforeValueSet(!0),this.setValue(null,{disableEvent:t,disableValidation:e}),this.afterValueSet(),e&&s.removeClass(this.$allWrappers,"has-error"),s.dispatchEvent(this.$ele,"reset")}addOption(e,t){if(!e)return;this.lastOptionIndex+=1;const s=this.getOptionObj({...e,index:this.lastOptionIndex});this.options.push(s),this.sortedOptions.push(s),t&&(this.visibleOptionsCount+=1,this.afterSetOptions())}removeOption(e){(e||0===e)&&(this.options.splice(e,1),this.lastOptionIndex-=1)}removeNewOption(){const e=this.getNewOption();e&&this.removeOption(e.index)}sortOptions(e){return e.sort((e,t)=>{const s=e.isSelected||e.isAnySelected,i=t.isSelected||t.isAnySelected;return s||i?s&&(!i||e.index{const s=e.options;e.isAnySelected=s.some(e=>e.isSelected),e.isAnySelected&&t(s)}),t(s),this.destructureOptionGroup(s)}isOptionVisible({data:e,searchValue:s,hasExactOption:i,visibleOptionGroupsMapping:o,searchGroup:n,searchByStartsWith:r}){const a=null!=e.valueNormalized?e.valueNormalized:e.value.toLowerCase();let l=e.labelNormalized;if(null==l){const s=(e.label||"").trim();l=this.searchNormalize&&""!==s?t.normalizeString(s).toLowerCase():s.toLowerCase()}const{description:p,alias:h}=e;let{descriptionNormalized:c}=e;if(null==c){const e=p||"";c=this.searchNormalize&&""!==e.trim()?t.normalizeString(e).toLowerCase():e.toLowerCase()}let u=r?l.startsWith(s):l.includes(s);return!e.isGroupTitle||n&&u||(u=o[e.index]),r||!h||u||(u=h.includes(s)),r||!c||u||(u=c.includes(s)),e.isVisible=u,i||(i=l===s||a===s),{isVisible:u,hasExactOption:i}}structureOptionGroup(e){const t=[],s={};return e.forEach(e=>{if(e.isGroupTitle){const i=[];e.options=i,s[e.index]=i,t.push(e)}}),e.forEach(e=>{e.isGroupOption&&s[e.groupIndex].push(e)}),t}destructureOptionGroup(e){let t=[];return e.forEach(e=>{t.push(e),t=t.concat(e.options)}),t}serverSearch(){s.removeClass(this.$allWrappers,"has-no-search-results"),s.addClass(this.$allWrappers,"server-searching"),this.setSelectedOptions(),this.onServerSearch(this.searchValue,this)}removeValue(e){const{selectedValues:i}=this,o=s.getData(e,"value");t.removeItemFromArray(i,o),this.setValueMethod(i)}focus(){this.$wrapper.focus()}enable(){this.$ele.disabled=!1,this.$ele.removeAttribute("disabled"),this.$hiddenInput.removeAttribute("disabled"),s.setAria(this.$wrapper,"disabled",!1),s.changeTabIndex(this.$wrapper,0)}disable(){this.$ele.disabled=!0,this.$ele.setAttribute("disabled",""),this.$hiddenInput.setAttribute("disabled",""),s.setAria(this.$wrapper,"disabled",!0),s.changeTabIndex(this.$wrapper,-1),this.$wrapper.blur()}validate(){if(this.disableValidation)return!0;let e=!1;const{selectedValues:i,minValues:o}=this;return this.required&&(t.isEmpty(i)||this.multiple&&o&&i.length{t.virtualSelect?i.push(t.virtualSelect):(e.ele=t,"SELECT"===t.tagName&&l.setPropsFromSelect(e),i.push(new l(e)))}),s?i[0]:i}static getAttrProps(){const{convertPropToDataAttr:e}=s,t={};return n.forEach(e=>{t[e]=e}),a.forEach(s=>{t[e(s)]=s}),t}static setPropsFromSelect(e){const t=e.ele,i=[],n=[],a=e=>{const t=[];return Array.from(e.children).forEach(e=>{const{value:s}=e,o={value:s};"OPTGROUP"===e.tagName?(o.label=e.getAttribute("label"),o.options=a(e)):o.label=e.innerHTML,t.push(o),e.disabled&&i.push(s),e.selected&&n.push(s)}),t},l=a(t),p=document.createElement("div");s.setAttrFromEle(t,p,Object.keys(r),o),t.parentNode.insertBefore(p,t),t.remove(),e.ele=p,e.options=l,e.disabledOptions=i,e.selectedValue=n}static onFormReset(e){const t=e.target.closest("form");t&&t.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.reset(!0)})}static onFormSubmit(e){l.validate(e.target.closest("form"))||e.preventDefault()}static validate(e){if(!e)return!0;let t=!1;return e.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const s=e.parentElement.virtualSelect.validate();t||s||(t=!0)}),!t}static reset(e=!1,t=!1){this.virtualSelect.reset(e,t)}static setValueMethod(...e){this.virtualSelect.setValueMethod(...e)}static setOptionsMethod(...e){this.virtualSelect.setOptionsMethod(...e)}static setDisabledOptionsMethod(...e){this.virtualSelect.setDisabledOptionsMethod(...e)}static setEnabledOptionsMethod(...e){this.virtualSelect.setEnabledOptionsMethod(...e)}static toggleSelectAll(e){this.virtualSelect.toggleAllOptions(e)}static isAllSelected(){return this.virtualSelect.isAllSelected}static addOptionMethod(e){this.virtualSelect.addOption(e,!0)}static getNewValueMethod(){return this.virtualSelect.getNewValue()}static getDisplayValueMethod(){return this.virtualSelect.getDisplayValue()}static getSelectedOptionsMethod(e){return this.virtualSelect.getSelectedOptions(e)}static getDisabledOptionsMethod(){return this.virtualSelect.getDisabledOptions()}static openMethod(){return this.virtualSelect.openDropbox()}static closeMethod(){return this.virtualSelect.closeDropbox()}static focusMethod(){return this.virtualSelect.focus()}static enableMethod(){return this.virtualSelect.enable()}static disableMethod(){return this.virtualSelect.disable()}static destroyMethod(){return this.virtualSelect.destroy()}static validateMethod(){return this.virtualSelect.validate()}static toggleRequiredMethod(e){return this.virtualSelect.toggleRequired(e)}static onResizeMethod(){document.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.onResize()})}}document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeMethod),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.lastInteractedInstance=null,"undefined"!=typeof NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach)}(),function(){"use strict";function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,s){if(e){if("string"==typeof e)return t(e,s);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,s):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var s=0,i=new Array(t);ss-o-t.width?"left":"right",vertical:n>i-n-t.height?"top":"bottom"}}},{key:"getAbsoluteCoords",value:function(e){if(e){var t=e.getBoundingClientRect(),s=window.pageXOffset,i=window.pageYOffset;return{width:t.width,height:t.height,top:t.top+i,right:t.right+s,bottom:t.bottom+i,left:t.left+s}}}},{key:"getCoords",value:function(e){return e?e.getBoundingClientRect():{}}},{key:"getData",value:function(e,t,s){if(e){var i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}}},{key:"setData",value:function(e,t,s){e&&(e.dataset[t]=s)}},{key:"setStyle",value:function(e,t,s){e&&(e.style[t]=s)}},{key:"show",value:function(e){var s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.setStyle(e,"display",s)}},{key:"hide",value:function(e){t.setStyle(e,"display","none")}},{key:"getHideableParent",value:function(e){for(var t,s=e.parentElement;s;){var i=getComputedStyle(s).overflow;if(-1!==i.indexOf("scroll")||-1!==i.indexOf("auto")){t=s;break}s=s.parentElement}return t}}],s&&function(e,t){for(var s=0;sO?O-b:L:C+h>M&&("right"===E?n="left":C=M+by?y-u:P:w+c>I&&("bottom"===E?n="top":w=I+uh-j&&(G=h-j):"left"!==E&&"right"!==E||((H=m/2+g-R)c-j&&(H=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(H),"px, 0) ").concat(K))}s.hide(this.$popperEle)}},{key:"resetPosition",value:function(){s.setStyle(this.$popperEle,"transform","none"),this.setPosition()}},{key:"show",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.resetPosition,o=t.data;clearTimeout(this.exitDelayTimeout),clearTimeout(this.hideDurationTimeout),i&&this.resetPosition(),this.enterDelayTimeout=setTimeout(function(){var t=s.getData(e.$popperEle,"left"),i=s.getData(e.$popperEle,"top"),n="translate3d(".concat(parseInt(t),"px, ").concat(parseInt(i),"px, 0)"),r=e.showDuration;s.show(e.$popperEle,"inline-flex"),s.getCoords(e.$popperEle),s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",1),e.showDurationTimeout=setTimeout(function(){"function"==typeof e.afterShowCallback&&e.afterShowCallback(o)},r)},this.enterDelay)}},{key:"hide",value:function(){var e=this,t=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}).data;clearTimeout(this.enterDelayTimeout),clearTimeout(this.showDurationTimeout),this.exitDelayTimeout=setTimeout(function(){if(e.$popperEle){var i=parseInt(s.getData(e.$popperEle,"fromLeft")),o=parseInt(s.getData(e.$popperEle,"fromTop")),n="translate3d(".concat(i,"px, ").concat(o,"px, 0)"),r=e.hideDuration;s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",0),e.hideDurationTimeout=setTimeout(function(){s.hide(e.$popperEle),"function"==typeof e.afterHideCallback&&e.afterHideCallback(t)},r)}},this.exitDelay)}},{key:"updatePosition",value:function(){s.setStyle(this.$popperEle,"transitionDuration","0ms"),this.resetPosition();var e=parseInt(s.getData(this.$popperEle,"left")),t=parseInt(s.getData(this.$popperEle,"top"));s.show(this.$popperEle,"inline-flex"),s.setStyle(this.$popperEle,"transform","translate3d(".concat(e,"px, ").concat(t,"px, 0)"))}}],t&&function(e,t){for(var s=0;s1&&void 0!==arguments[1]&&arguments[1]}},{key:"removeArrayEmpty",value:function(e){return Array.isArray(e)&&e.length?e.filter(function(e){return!!e}):[]}},{key:"throttle",value:function(e,t){var s,i=0;return function(){for(var o=arguments.length,n=new Array(o),r=0;re.length)&&(t=e.length);for(var s=0,i=new Array(t);s'),e=this.$popover.querySelector(".pop-comp-arrow")),this.$arrowEle=e}}},{key:"destroy",value:function(){this.removeEvents()}}])&&c(t.prototype,s),o&&c(t,o),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,s,o}();d=f.getAttrProps(),window.PopoverComponent=f}(); \ No newline at end of file + */!function(){"use strict";const e=/[^\p{L}\p{N}_]/gu;class t{static getString(e){return e||0===e?e.toString():""}static convertToBoolean(e,t=!1){let s;return s=!0===e||"true"===e||!1!==e&&"false"!==e&&t,s}static isEmpty(e){let t=!1;return e?Array.isArray(e)?0===e.length&&(t=!0):"object"==typeof e&&0===Object.keys(e).length&&(t=!0):t=!0,t}static isNotEmpty(e){return!t.isEmpty(e)}static normalizeValues(e){if(Array.isArray(e)){const t=new Array(e.length);for(let s=0;s!!e):[]}static getRandomInt(e,t=0){const s=Math.ceil(t),i=Math.floor(e);return Math.floor(Math.random()*(i-s-1))+s}static regexEscape(e){return e.replace(/[-/\\^$*+?.()|[\]{}]/g,"\\$&")}static normalizeString(t){return t.normalize("NFD").replace(e,"")}static willTextOverflow(e,t){const s=document.createElement("div");s.style.position="absolute",s.style.visibility="hidden",s.style.whiteSpace="nowrap",s.style.fontSize=window.getComputedStyle(e).fontSize,s.style.fontFamily=window.getComputedStyle(e).fontFamily,s.textContent=t,document.body.appendChild(s);const i=s.clientWidth;return document.body.removeChild(s),i>e.clientWidth}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static containsHTML(e){return/<[a-z][\s\S]*>/i.test(e)}static containsHTMLorJS(e){return/<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(e)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;return function(...r){const a=Date.now(),l=t-(a-n);o=r,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,e.apply(s,o),o=[],s=void 0):i||(i=setTimeout(()=>{n=Date.now(),i=null,e.apply(s,o),o=[],s=void 0},l))}}}class s{static addClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.add(...i)})}static removeClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.remove(...i)})}static toggleClass(e,t,i){if(!e)return;let o;void 0!==i&&(o=Boolean(i)),s.getElements(e).forEach(e=>{e.classList.toggle(t,o)})}static hasClass(e,t){return!!e&&e.classList.contains(t)}static hasEllipsis(e){return!!e&&e.scrollWidth>e.offsetWidth}static getData(e,t,s){if(!e)return;let i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}static setData(e,t,s){e&&(e.dataset[t]=s)}static setAttr(e,t,s){e&&e.setAttribute(t,s)}static setAttrFromEle(e,t,s,i){const o={};s.forEach(t=>{o[t]=e.getAttribute(t)}),s.forEach(e=>{const s=o[e];(s||-1!==i.indexOf(e)&&""===s)&&t.setAttribute(e,s)})}static setStyle(e,t,s){e&&(e.style[t]=s)}static setStyles(e,t){e&&t&&Object.keys(t).forEach(s=>{e.style[s]=t[s]})}static setAria(e,t,s){if(!e)return;let i=t;"role"!==i&&(i=`aria-${i}`),e.setAttribute(i,s)}static getElements(e){return e?void 0===e.forEach?[e]:e:[]}static getElementsBySelector(e="",t=void 0){let s;const i=void 0!==t?t:document;return""!==e&&(s=i.querySelectorAll(e)),void 0!==s?Array.from(s):[]}static addEvent(e,i,o,n){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{s.getElements(e).forEach(e=>{e.addEventListener(t,o,{capture:n})})})}static dispatchEvent(e,t,i=!1){if(!e)return;const o=s.getElements(e);setTimeout(()=>{o.forEach(e=>{e.dispatchEvent(new CustomEvent(t,{bubbles:i}))})},0)}static getAttributesText(e){let t="";return e?(Object.entries(e).forEach(([e,s])=>{void 0!==s&&(t+=` ${e}="${s}" `)}),t):t}static convertPropToDataAttr(e){return e?`data-${e}`.replace(/([A-Z])/g,"-$1").toLowerCase():""}static changeTabIndex(e,t){e?s.getElements(e).forEach(e=>{e.tabIndex=t}):console.log(e,"Invalid element provided.")}static removeEvent(e,t,i,o=!1){e&&s.getElements(e).forEach(e=>{e.removeEventListener(t,i,{capture:o})})}}const i={13:"onEnterPress",38:"onUpArrowPress",40:"onDownArrowPress",46:"onBackspaceOrDeletePress",8:"onBackspaceOrDeletePress"},o=["autofocus","disabled","multiple","required"],n=["autofocus","class","disabled","id","multiple","name","placeholder","required"];let r;const a=["additionalClasses","additionalDropboxClasses","additionalDropboxContainerClasses","additionalToggleButtonClasses","aliasKey","allOptionsSelectedText","allowNewOption","alwaysShowSelectedOptionsCount","alwaysShowSelectedOptionsLabel","ariaLabelledby","ariaLabelText","ariaLabelClearButtonText","ariaLabelTagClearButtonText","ariaLabelSearchClearButtonText","autoSelectFirstOption","clearButtonText","descriptionKey","disableAllOptionsSelectedText","disableOptionGroupCheckbox","disableSelectAll","disableValidation","dropboxWidth","dropboxWrapper","emptyValue","enableSecureText","focusSelectedOptionOnOpen","hasOptionDescription","hideClearButton","hideValueTooltipOnSelectAll","keepAlwaysOpen","labelKey","markSearchResults","maxValues","maxWidth","minValues","moreText","noOfDisplayValues","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","selectAllOnlyVisible","selectAllText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let t="vscomp-wrapper",i="vscomp-toggle-button";const o=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),n=this.getTooltipAttrText(this.clearButtonText),r=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",a=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",l=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let h=!1;this.additionalClasses&&(t+=` ${this.additionalClasses}`),this.additionalToggleButtonClasses&&(i+=` ${this.additionalToggleButtonClasses}`),this.multiple&&(t+=" multiple",this.disableSelectAll||(t+=" has-select-all")),this.hideClearButton||(t+=" has-clear-button"),this.keepAlwaysOpen?(t+=" keep-always-open",h=!0):t+=" closed",this.showAsPopup&&(t+=" show-as-popup"),this.hasSearch&&(t+=" has-search-input"),this.showValueAsTags&&(t+=" show-value-as-tags"),this.textDirection&&(t+=` text-direction-${this.textDirection}`),this.popupPosition&&(t+=` popup-position-${this.popupPosition.toLowerCase()}`);const p=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:t})}\n
`;this.$ele.innerHTML=p,this.$body=document.querySelector("body"),this.$wrapper=this.$ele.querySelector(".vscomp-wrapper"),this.hasDropboxWrapper?(this.$allWrappers=[this.$wrapper,this.$dropboxWrapper],this.$dropboxContainer=this.$dropboxWrapper.querySelector(".vscomp-dropbox-container"),s.addClass(this.$dropboxContainer,"pop-comp-wrapper")):(this.$allWrappers=[this.$wrapper],this.$dropboxContainer=this.$wrapper.querySelector(".vscomp-dropbox-container")),this.$toggleButton=this.$ele.querySelector(".vscomp-toggle-button"),this.$clearButton=this.$ele.querySelector(".vscomp-clear-button"),this.$valueText=this.$ele.querySelector(".vscomp-value"),this.$hiddenInput=this.$ele.querySelector(".vscomp-hidden-input"),this.$dropbox=this.$dropboxContainer.querySelector(".vscomp-dropbox"),this.$dropboxCloseButton=this.$dropboxContainer.querySelector(".vscomp-dropbox-close-button"),this.$dropboxContainerBottom=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-bottom"),this.$dropboxContainerTop=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-top"),this.$search=this.$dropboxContainer.querySelector(".vscomp-search-wrapper"),this.$optionsContainer=this.$dropboxContainer.querySelector(".vscomp-options-container"),this.$optionsList=this.$dropboxContainer.querySelector(".vscomp-options-list"),this.$options=this.$dropboxContainer.querySelector(".vscomp-options"),this.$noOptions=this.$dropboxContainer.querySelector(".vscomp-no-options"),this.$noSearchResults=this.$dropboxContainer.querySelector(".vscomp-no-search-results"),this.afterRenderWrapper()}renderDropbox({wrapperClasses:e}){const t="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let i="vscomp-dropbox";this.additionalDropboxClasses&&(i+=` ${this.additionalDropboxClasses}`);let o="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(o+=` ${this.additionalDropboxContainerClasses}`);const n=`
\n \n
\n
\n\n
\n
\n\n
\n
\n
\n
\n\n
\n
${this.noOptionsText}
\n
${this.noSearchResultsText}
\n\n \n
\n \n
`;if(t){const i=document.createElement("div");return this.$dropboxWrapper=i,this.hasDropboxWrapper=!0,i.innerHTML=n,t.appendChild(i),s.addClass(i,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(i,"tabindex","-1"),s.setAria(i,"hidden",!0)),""}return this.hasDropboxWrapper=!1,n}renderOptions(){this.calculateAriaMetadata();let e="";const s=this.getVisibleOptions();let i="",o="";const n=!(!this.markSearchResults||!this.searchValue);let r;const{labelRenderer:a,disableOptionGroupCheckbox:l,uniqueId:h,searchGroup:p}=this,c="function"==typeof a,{convertToBoolean:u}=t;let d="";if(n&&(r=new RegExp(`(${t.regexEscape(this.searchValue)})(?!([^<]+)?>)`,"gi")),this.multiple&&(i=''),this.allowNewOption){const e=this.getTooltipAttrText("New Option");o=``}s.forEach(s=>{const{index:v}=s;let b,m="vscomp-option";const f=this.getTooltipAttrText("",!0,!0);let g=i,O="",y="",x="",S="",$="-1";const w=u(s.isSelected);let C="";if(s.classNames&&(m+=` ${t.sanitizeClassNames(s.classNames)}`),s.isFocused&&($="0",m+=" focused"),s.isDisabled&&(m+=" disabled",C='aria-disabled="true"'),s.isGroupTitle&&(d=s.label,m+=" group-title",l&&(g="")),w&&(m+=" selected"),s.isGroupOption){let e="";if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const i=this.secureText(t.getString(s.customData.group_name)),o=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${i}, `:"",e=void 0!==s.customData.description?` ${o},`:"",S=`aria-label="${d} ${s.label}, ${e}"`}else S=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(y=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",O+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let E="";this.ariaSetSize>0&&(E=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(E+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${y}\n ${O}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",t="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${this.ariaLabelSearchClearButtonText}"`:"";t=`\n \n ×`}const s=`
\n ${e}\n ${t}\n
`;this.$search.innerHTML=s,this.$searchInput=this.$dropboxContainer.querySelector(".vscomp-search-input"),this.$searchClear=this.$dropboxContainer.querySelector(".vscomp-search-clear"),this.$toggleAllButton=this.$dropboxContainer.querySelector(".vscomp-toggle-all-button"),this.$toggleAllCheckbox=this.$dropboxContainer.querySelector(".vscomp-toggle-all-checkbox"),this.addEvent(this.$searchInput,"input","onSearch"),this.addEvent(this.$searchInput,"change","preventPropagation"),this.addEvent(this.$searchClear,"click keydown","onSearchClear"),this.addEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.addEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.addEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}addEvents(){this.addEvent(document,"click","onDocumentClick",!0),this.addEvent(this.$allWrappers,"keydown","onKeyDown"),this.addEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.addEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.addEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.addEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.addEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.addEvent(this.$options,"click","onOptionsClick"),this.addEvent(this.$options,"mouseover","onOptionsMouseOver"),this.addEvent(this.$options,"touchmove","onOptionsTouchMove"),this.addMutationObserver()}addEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`;let r=this.events[i];r||(r=this[o].bind(this),this.events[i]=r),s.addEvent(e,t,r,n)})}removeEvents(){this.removeEvent(document,"click","onDocumentClick",!0),this.removeEvent(this.$allWrappers,"keydown","onKeyDown"),this.removeEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.removeEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.removeEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.removeEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.removeEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.removeEvent(this.$options,"click","onOptionsClick"),this.removeEvent(this.$options,"mouseover","onOptionsMouseOver"),this.removeEvent(this.$options,"touchmove","onOptionsTouchMove"),this.$searchInput&&(this.removeEvent(this.$searchInput,"input","onSearch"),this.removeEvent(this.$searchInput,"change","preventPropagation"),this.$searchClear&&(this.removeEvent(this.$searchClear,"click","onSearchClear"),this.removeEvent(this.$searchClear,"keydown","onSearchClear"))),this.$toggleAllButton&&this.removeEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.$dropboxContainerBottom&&this.removeEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.$dropboxContainerTop&&this.removeEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus"),this.removeMutationObserver()}removeEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`,r=this.events[i];r&&s.removeEvent(e,t,r,n)})}onDocumentClick(e){const t=e.target.closest(".vscomp-wrapper");if(!t)return void l.openInstances.forEach(e=>{const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox()});const s=t.parentElement.virtualSelect;s&&s!==this&&this.isOpened()&&!this.keepAlwaysOpen&&(this.shouldFocusWrapperOnClose=!1,this.closeDropbox())}onKeyDown(e){const t=e.which||e.keyCode,s=i[t];if(document.activeElement!==this.$searchInput||e.shiftKey||9!==t||this.multiple||(e.preventDefault(),this.focusFirstVisibleOption()),document.activeElement!==this.$toggleAllButton||13!==t){if(27===t||"Escape"===e.key){const e=this.showAsPopup?this.$wrapper:this.$dropboxWrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}else this.toggleAllOptions()}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}onDownArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"next"}):this.openDropbox())}onUpArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"previous"}):this.openDropbox())}onBackspaceOrDeletePress(e){e.target===this.$wrapper&&(e.preventDefault(),this.selectedValues.length>0&&this.reset())}onToggleButtonPress(e){if("keydown"===e.type){if("Enter"!==e.code&&"Space"!==e.code)return;e.preventDefault()}const t=e.target;if(t.closest(".vscomp-value-tag-clear-button"))return e.stopPropagation(),void this.removeValue(t.closest(".vscomp-value-tag"));t.closest(".toggle-button-child")||this.toggleDropbox()}onClearButtonClick(e){"click"===e.type?this.reset():"keydown"!==e.type||"Enter"!==e.code&&"Space"!==e.code||(e.stopPropagation(),this.reset())}onOptionsScroll(){this.setVisibleOptions(!0)}onOptionsClick(e){const t=e.target.closest(".vscomp-option");t&&!s.hasClass(t,"disabled")&&(s.hasClass(t,"group-title")?this.onGroupTitleClick(t):this.selectOption(t,{event:e}))}onGroupTitleClick(e){if(!e||!this.multiple||this.disableOptionGroupCheckbox)return;const t=!s.hasClass(e,"selected");this.toggleGroupTitleCheckbox(e,t),this.toggleGroupOptions(e,t)}onDropboxContainerClick(e){e.target.closest(".vscomp-dropbox")||this.closeDropbox()}onDropboxCloseButtonClick(){this.closeDropbox()}onOptionsMouseOver(e){const t=e.target.closest(".vscomp-option");t&&this.isOpened()&&(s.hasClass(t,"disabled")||s.hasClass(t,"group-title")?this.removeOptionFocus():this.focusOption({$option:t}))}onOptionsTouchMove(){this.removeOptionFocus()}onSearch(e){e.stopPropagation(),this.setSearchValue(e.target.value,!0)}preventPropagation(e){e.stopPropagation()}onSearchClear(e){e.stopPropagation(),"Enter"!==e.code&&"Space"!==e.code&&"click"!==e.type||(this.setSearchValue(""),this.focusSearchInput())}onToggleAllOptions(){this.toggleAllOptions()}onDropboxContainerTopOrBottomFocus(){this.closeDropbox()}onResize(){this.setOptionsContainerHeight(!0)}addMutationObserver(){if(!this.hasDropboxWrapper)return;const e=this.$ele;this.mutationObserver=new MutationObserver(t=>{let s=!1,i=!1;t.forEach(t=>{s||(s=[...t.addedNodes].some(t=>!(t!==e&&!t.contains(e)))),i||(i=[...t.removedNodes].some(t=>!(t!==e&&!t.contains(e))))}),i&&!s&&this.destroy()}),this.mutationObserver.observe(document.querySelector("body"),{childList:!0,subtree:!0})}removeMutationObserver(){this.mutationObserver&&(this.mutationObserver.disconnect(),this.mutationObserver=null)}beforeValueSet(e){this.toggleAllOptionsClass(!e&&void 0)}beforeSelectNewValue(e){const t=this.getNewOption();if(t){const e=t.index;this.newValues.push(t.value),this.setOptionProp(e,"isCurrentNew",!1),this.setOptionProp(e,"isNew",!0)}else e&&(this.setNewOption(e),this.toggleSelectedProp(this.lastOptionIndex,!0));this.setManagedTimeout(()=>{this.setSearchValue(""),this.focusSearchInput()},0)}afterRenderWrapper(){s.addClass(this.$ele,"vscomp-ele"),this.renderSearch(),this.setEleStyles(),this.setDropboxStyles(),this.setVisibleOptionsCount(),this.setOptionsContainerHeight(),this.addEvents(),this.setEleProps(),this.keepAlwaysOpen||this.showAsPopup||this.initDropboxPopover(),this.initialSelectedValue?this.setValueMethod(this.initialSelectedValue,this.silentInitialValueSet):this.autoSelectFirstOption&&this.visibleOptions.length&&this.setValueMethod(this.visibleOptions[0].value,this.silentInitialValueSet),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),this.initialDisabled&&this.disable(),this.autofocus&&this.focus()}afterRenderOptions(){const e=this.getVisibleOptions(),t=!this.options.length&&!this.hasServerSearch,i=!t&&!e.length;(!this.allowNewOption||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(s.toggleClass(this.$allWrappers,"has-no-search-results",i),i?(s.setAttr(this.$noSearchResults,"tabindex","0"),s.setAttr(this.$noSearchResults,"aria-hidden","false")):(s.setAttr(this.$noSearchResults,"tabindex","-1"),s.setAttr(this.$noSearchResults,"aria-hidden","true"))),s.toggleClass(this.$allWrappers,"has-no-options",t),t?(s.setAttr(this.$noOptions,"tabindex","0"),s.setAttr(this.$noOptions,"aria-hidden","false")):(s.setAttr(this.$noOptions,"tabindex","-1"),s.setAttr(this.$noOptions,"aria-hidden","true")),this.setOptionAttr(),this.setOptionsPosition(),this.setOptionsTooltip(),document.activeElement!==this.$searchInput&&this.setManagedTimeout(()=>{const e=s.getElementsBySelector(".focused",this.$dropboxContainer)[0];void 0!==e&&e.focus({preventScroll:!0})},20)}afterSetOptionsContainerHeight(e){e&&this.showAsPopup&&this.setVisibleOptions()}afterSetSearchValue(){this.hasServerSearch?(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=setTimeout(()=>{this.serverSearch()},this.searchDelay)):this.setVisibleOptionsCount(),this.selectAllOnlyVisible&&this.toggleAllOptionsClass(),this.focusOption({focusFirst:!0})}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),e||this.reset()}setProps(e){const s=this.setDefaultProps(e);this.setPropsFromElementAttr(s);const{convertToBoolean:i}=t;this.$ele=s.ele,this.dropboxWrapper=s.dropboxWrapper,this.valueKey=s.valueKey,this.labelKey=s.labelKey,this.descriptionKey=s.descriptionKey,this.aliasKey=s.aliasKey,this.optionHeightText=s.optionHeight,this.optionHeight=parseFloat(this.optionHeightText),this.multiple=i(s.multiple),this.hasSearch=i(s.search),this.searchByStartsWith=i(s.searchByStartsWith),this.searchGroup=i(s.searchGroup),this.hideClearButton=i(s.hideClearButton),this.autoSelectFirstOption=i(s.autoSelectFirstOption),this.hasOptionDescription=i(s.hasOptionDescription),this.silentInitialValueSet=i(s.silentInitialValueSet),this.allowNewOption=i(s.allowNewOption),this.markSearchResults=i(s.markSearchResults),this.showSelectedOptionsFirst=i(s.showSelectedOptionsFirst),this.disableSelectAll=i(s.disableSelectAll),this.keepAlwaysOpen=i(s.keepAlwaysOpen),this.showDropboxAsPopup=i(s.showDropboxAsPopup),this.hideValueTooltipOnSelectAll=i(s.hideValueTooltipOnSelectAll),this.showOptionsOnlyOnSearch=i(s.showOptionsOnlyOnSearch),this.selectAllOnlyVisible=i(s.selectAllOnlyVisible),this.alwaysShowSelectedOptionsCount=i(s.alwaysShowSelectedOptionsCount),this.alwaysShowSelectedOptionsLabel=i(s.alwaysShowSelectedOptionsLabel),this.disableAllOptionsSelectedText=i(s.disableAllOptionsSelectedText),this.showValueAsTags=i(s.showValueAsTags),this.disableOptionGroupCheckbox=i(s.disableOptionGroupCheckbox),this.enableSecureText=i(s.enableSecureText),this.setValueAsArray=i(s.setValueAsArray),this.disableValidation=i(s.disableValidation),this.initialDisabled=i(s.disabled),this.required=i(s.required),this.autofocus=i(s.autofocus),this.useGroupValue=i(s.useGroupValue),this.focusSelectedOptionOnOpen=i(s.focusSelectedOptionOnOpen),this.noOptionsText=s.noOptionsText,this.noSearchResultsText=s.noSearchResultsText,this.selectAllText=s.selectAllText,this.searchNormalize=s.searchNormalize,this.searchPlaceholderText=s.searchPlaceholderText,this.searchFormLabel=s.searchFormLabel,this.optionsSelectedText=s.optionsSelectedText,this.optionSelectedText=s.optionSelectedText,this.allOptionsSelectedText=s.allOptionsSelectedText,this.clearButtonText=s.clearButtonText,this.moreText=s.moreText,this.placeholder=s.placeholder,this.position=s.position,this.textDirection=s.textDirection,this.dropboxWidth=s.dropboxWidth,this.tooltipFontSize=s.tooltipFontSize,this.tooltipAlignment=s.tooltipAlignment,this.tooltipMaxWidth=s.tooltipMaxWidth,this.updatePositionThrottle=s.updatePositionThrottle,this.noOfDisplayValues=parseInt(s.noOfDisplayValues),this.zIndex=parseInt(s.zIndex),this.maxValues=parseInt(s.maxValues),this.minValues=parseInt(s.minValues),this.name=this.secureText(s.name),this.additionalClasses=s.additionalClasses,this.additionalDropboxClasses=s.additionalDropboxClasses,this.additionalDropboxContainerClasses=s.additionalDropboxContainerClasses,this.additionalToggleButtonClasses=s.additionalToggleButtonClasses,this.popupDropboxBreakpoint=s.popupDropboxBreakpoint,this.popupPosition=s.popupPosition,this.onServerSearch=s.onServerSearch,this.labelRenderer=s.labelRenderer,this.selectedLabelRenderer=s.selectedLabelRenderer,this.initialSelectedValue=0===s.selectedValue?"0":s.selectedValue,this.emptyValue=s.emptyValue,this.ariaLabelText=s.ariaLabelText,this.ariaLabelledby=s.ariaLabelledby,this.ariaLabelClearButtonText=s.ariaLabelClearButtonText,this.ariaLabelTagClearButtonText=s.ariaLabelTagClearButtonText,this.ariaLabelSearchClearButtonText=s.ariaLabelSearchClearButtonText,this.maxWidth=s.maxWidth,this.searchDelay=s.searchDelay,this.showDuration=parseInt(s.showDuration),this.hideDuration=parseInt(s.hideDuration),this.selectedValues=[],this.selectedOptions=[],this.newValues=[],this.events={},this.tooltipEnterDelay=200,this.searchValue="",this.searchValueOriginal="",this.isAllSelected=!1,(void 0===s.search&&this.multiple||this.allowNewOption||this.showOptionsOnlyOnSearch)&&(this.hasSearch=!0),this.hasServerSearch="function"==typeof this.onServerSearch,(this.maxValues||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(this.disableSelectAll=!0,this.disableOptionGroupCheckbox=!0),this.keepAlwaysOpen&&(this.dropboxWrapper="self"),this.showAsPopup=this.showDropboxAsPopup&&!this.keepAlwaysOpen&&window.innerWidth<=parseFloat(this.popupDropboxBreakpoint),this.hasSearchContainer=this.hasSearch||this.multiple&&!this.disableSelectAll,this.optionsCount=this.getOptionsCount(s.optionsCount),this.halfOptionsCount=Math.ceil(this.optionsCount/2),this.optionsHeight=this.getOptionsHeight(),this.uniqueId=this.getUniqueId(),this.shouldFocusWrapperOnClose=!0,this.ariaSetSize=0}setDefaultProps(e){const t={dropboxWrapper:"self",valueKey:"value",labelKey:"label",descriptionKey:"description",aliasKey:"alias",ariaLabelText:"Options list",ariaLabelClearButtonText:"Clear button",ariaLabelTagClearButtonText:"Remove option",ariaLabelSearchClearButtonText:"Clear search input",optionsCount:5,noOfDisplayValues:50,optionHeight:"40px",noOptionsText:"No options found",noSearchResultsText:"No results found",selectAllText:"Select All",searchNormalize:!1,searchPlaceholderText:"Search...",searchFormLabel:"Search",clearButtonText:"Clear",moreText:"more...",optionsSelectedText:"options selected",optionSelectedText:"option selected",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:e.keepAlwaysOpen?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return e.hasOptionDescription&&(t.optionsCount=4,t.optionHeight="50px"),Object.assign(t,e)}setPropsFromElementAttr(e){const t=e.ele;Object.keys(r).forEach(s=>{let i=t.getAttribute(s);-1===o.indexOf(s)||""!==i&&"true"!==i||(i=!0),i&&(e[r[s]]=i)})}setEleProps(){const{$ele:e}=this;e.virtualSelect=this,e.value=this.multiple?[]:"",e.name=this.name,e.disabled=!1,e.required=this.required,e.autofocus=this.autofocus,e.multiple=this.multiple,e.form=e.closest("form"),e.reset=l.reset,e.setValue=l.setValueMethod,e.setOptions=l.setOptionsMethod,e.setDisabledOptions=l.setDisabledOptionsMethod,e.setEnabledOptions=l.setEnabledOptionsMethod,e.toggleSelectAll=l.toggleSelectAll,e.isAllSelected=l.isAllSelected,e.addOption=l.addOptionMethod,e.getNewValue=l.getNewValueMethod,e.getDisplayValue=l.getDisplayValueMethod,e.getSelectedOptions=l.getSelectedOptionsMethod,e.getDisabledOptions=l.getDisabledOptionsMethod,e.open=l.openMethod,e.close=l.closeMethod,e.focus=l.focusMethod,e.enable=l.enableMethod,e.disable=l.disableMethod,e.destroy=l.destroyMethod,e.validate=l.validateMethod,e.toggleRequired=l.toggleRequiredMethod,this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=this)}setValueMethod(e,s){const i={},o={};let n=[];const r=this.multiple;let a=t.normalizeValues(e);if(a){if(Array.isArray(a)||(a=[a]),r){const{maxValues:e}=this;e&&a.length>e&&a.splice(e)}else a.length>1&&(a=[a[0]]);this.useGroupValue&&(a=this.setGroupOptionsValue(a)),a.forEach((e,t)=>{i[e]=!0,o[e]=t}),this.allowNewOption&&a&&this.setNewOptionsFromValue(a)}this.options.forEach(e=>{const s=t.normalizeValues(e.value);!0!==i[s]||e.isDisabled||e.isGroupTitle?e.isSelected=!1:(e.isSelected=!0,n.push(e.value))}),r?(this.hasOptionGroup&&this.setGroupsSelectedProp(),n.sort((e,s)=>o[t.normalizeValues(e)]-o[t.normalizeValues(s)])):[n]=n,this.beforeValueSet(),this.setValue(n,{disableEvent:s}),this.afterValueSet()}setGroupOptionsValue(e){const t=[],s={},i={};return e.forEach(e=>{i[e]=!0}),this.options.forEach(e=>{const{value:o}=e,n=!0===i[o];e.isGroupTitle?n&&(s[e.index]=!0):(n||s[e.groupIndex])&&t.push(o)}),t}setGroupsSelectedProp(){const e=this.isAllGroupOptionsSelected.bind(this);this.options.forEach(t=>{t.isGroupTitle&&(t.isSelected=e(t.index))})}setOptionsMethod(e,t){this.setOptions(e),this.afterSetOptions(t)}setDisabledOptionsMethod(e,t=!1){this.setDisabledOptions(e,!0),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setDisabledOptions(e,t=!1){let s=[];if(e)if(!0===e)t&&this.options.forEach(e=>(e.isDisabled=!0,s.push(e.value),e));else{s=e.map(e=>e.toString());const i={};s.forEach(e=>{i[e]=!0}),t&&this.options.forEach(e=>(e.isDisabled=!0===i[e.value],e))}else t&&this.options.forEach(e=>(e.isDisabled=!1,e));this.disabledOptions=s}setEnabledOptionsMethod(e,t=!1){this.setEnabledOptions(e),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setEnabledOptions(e){if(void 0===e)return;const t=[];if(!0===e)this.options.forEach(e=>(e.isDisabled=!1,e));else{const s={};e.forEach(e=>{s[e]=!0}),this.options.forEach(e=>{const i=!0!==s[e.value];return e.isDisabled=i,i&&t.push(e.value),e})}this.disabledOptions=t}setOptions(e=[]){const s=[],i=this.disabledOptions.length,{valueKey:o,labelKey:n,descriptionKey:r,aliasKey:a,hasOptionDescription:l}=this,{getString:h,convertToBoolean:p}=t,c=this.secureText.bind(this),u=this.getAlias.bind(this);let d=0,v=!1;const b={};let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const f=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const g=c(h(e[o])),O=c(h(e[n])),y=e.options,x=!!y,S={index:d,value:g,valueNormalized:g.toLowerCase(),label:O,labelNormalized:this.searchNormalize&&""!==O.trim()?t.normalizeString(O).toLowerCase():O.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:x,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(S.isDisabled=!0===b[g]),e.isGroupOption&&(S.isGroupOption=!0,S.groupIndex=e.groupIndex),l){const s=c(h(e[r]));S.description=s,S.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(S.customData=e.customData),s.push(S),d+=1,x){const e=S.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:O}=this;O.options=s,O.length=g,this.options=s,this.visibleOptionsCount=g,this.lastOptionIndex=g-1,this.newValues=[],this.hasOptionGroup=v,this.hasEmptyValueOption=m,this.setSortedOptions()}setServerOptions(e=[]){this.setOptionsMethod(e,!0);const{selectedOptions:t}=this,i=this.options;let o=!1;if(t.length){const e={};o=!0,i.forEach(t=>{e[t.value]=!0}),t.forEach(t=>{!0!==e[t.value]&&(t.isVisible=!1,i.push(t))}),this.setOptionsMethod(i,!0)}this.allowNewOption&&this.searchValue&&(i.some(e=>e.label.toLowerCase()===this.searchValue)||(o=!0,this.setNewOption())),o?(this.setVisibleOptionsCount(),this.multiple&&this.toggleAllOptionsClass(),this.setValueText()):this.updatePosition(),this.setVisibleOptionsCount(),s.removeClass(this.$allWrappers,"server-searching")}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){let e=[...this.options];this.showSelectedOptionsFirst&&this.selectedValues.length&&(e=this.hasOptionGroup?this.sortOptionsGroup(e):this.sortOptions(e)),this.sortedOptions=e}setVisibleOptions(){let e=[...this.sortedOptions];const t=2*this.optionsCount,s=this.getVisibleStartIndex(),i=this.getNewOption(),o=s+t-1;let n=0;i&&(i.visibleIndex=n,n+=1),e=e.filter(e=>{let t=!1;return e.isVisible&&!e.isCurrentNew&&(t=n>=s&&n<=o,e.visibleIndex=n,n+=1),t}),i&&(e=[i,...e]),this.visibleOptions=e,this.visibleOptionsCount=e.length,this.renderOptions()}setOptionsPosition(e){const t=parseInt((e||this.getVisibleStartIndex())*this.optionHeight);this.$options.style.transform=`translate3d(0, ${t}px, 0)`,s.setData(this.$options,"top",t)}setOptionsTooltip(){const e=this.getVisibleOptions(),{hasOptionDescription:t}=this;e.forEach(e=>{const i=this.$dropboxContainer.querySelector(`.vscomp-option[data-index="${e.index}"]`);s.setData(i.querySelector(".vscomp-option-text"),"tooltip",e.label),t&&s.setData(i.querySelector(".vscomp-option-description"),"tooltip",e.description)})}setValue(e,{disableEvent:i=!1,disableValidation:o=!1}={}){const n=t.normalizeValues(e);this.hasEmptyValueOption&&""===n||n?Array.isArray(n)?this.selectedValues=[...n]:this.selectedValues=[n]:this.selectedValues=[];const r=this.getValue();this.$ele.value=r,this.$hiddenInput.value=this.getInputValue(r),this.isMaxValuesSelected=!!(this.maxValues&&this.maxValues<=this.selectedValues.length),this.toggleAllOptionsClass(),this.setValueText();const a=t.isNotEmpty(this.selectedValues);s.toggleClass(this.$allWrappers,"has-value",a),s.toggleClass(this.$allWrappers,"max-value-selected",this.isMaxValuesSelected),s.setAttr(this.$clearButton,"tabindex",a?"0":"-1"),s.setAria(this.$clearButton,"hidden",!1===a),o||this.validate(),i||s.dispatchEvent(this.$ele,"change",!0)}setValueText(){const{multiple:e,selectedValues:i,noOfDisplayValues:o,showValueAsTags:n,$valueText:r,selectedLabelRenderer:a}=this,l=[];let h=[];const p=i.length;let c=0;const u=this.isAllSelected&&!this.hasServerSearch&&!this.disableAllOptionsSelectedText&&!n;if(u&&this.hideValueTooltipOnSelectAll)r.innerHTML=`${this.allOptionsSelectedText} (${p})`;else{this.getSelectedOptions({fullDetails:!0,keepSelectionOrder:!0}).some(e=>{if(e.isCurrentNew)return!1;if(c>=o)return!0;let{label:s}=e;if("function"==typeof a&&(s=a(e)),l.push(s),c+=1,n){const i=t.willTextOverflow(r.parentElement,s)?this.getTooltipAttrText(s,!1,!0):"";let o="";this.ariaLabelTagClearButtonText&&(o=`aria-label="${s.replace(/<[^>]+>/gi,"").trim()}, ${this.ariaLabelTagClearButtonText}"`);const n=`\n ${s}\n \n \n \n `;h.push(n)}else h.push(s);return!1});const i=p-o;i>0&&h.push(`+ ${i} ${this.moreText}`);const d=l.join(", ");if(""===d)r.innerHTML=this.placeholder;else if(r.innerHTML=d,e){const{maxValues:e}=this;if(this.alwaysShowSelectedOptionsCount||s.hasEllipsis(r)||e||n){let t=`${p}`;if(e&&(t+=` / ${e}`),u)r.innerHTML=`${this.allOptionsSelectedText} (${p})`;else if(n)r.innerHTML=h.join(""),this.$valueTags=r.querySelectorAll(".vscomp-value-tag"),this.setValueTagAttr();else if(!this.alwaysShowSelectedOptionsLabel){const e=1===p?this.optionSelectedText:this.optionsSelectedText;r.innerHTML=`${t} ${e}`}}else h=[]}}let d="";0===p?d=this.placeholder:n||(d=h.join(", ")),n||s.setData(r,"tooltip",d),e&&(n?this.updatePosition():s.setData(r,"tooltipEllipsisOnly",0===p))}setSearchValue(e,t=!1,i=!1){if(e===this.searchValueOriginal&&!i)return;t||(this.$searchInput.value=e);const o=e.replace(/\\/g,"").toLowerCase().trim();this.searchValue=o,this.searchValueOriginal=e,s.toggleClass(this.$allWrappers,"has-search-value",e),s.setAttr(this.$searchClear,"tabindex",""!==e?"0":"-1"),s.setAria(this.$searchClear,"hidden",""===e),this.afterSetSearchValue()}setVisibleOptionsCount(){let e,s=0,i=!1;const{searchGroup:o,showOptionsOnlyOnSearch:n,searchByStartsWith:r}=this;let{searchValue:a}=this;a=this.searchNormalize&&""!==a.trim()?t.normalizeString(a):a;const l=this.isOptionVisible.bind(this);this.hasOptionGroup&&(e=this.getVisibleOptionGroupsMapping(a)),this.options.forEach(t=>{if(t.isCurrentNew)return;let h;n&&!a?(t.isVisible=!1,h={isVisible:!1,hasExactOption:!1}):h=l({data:t,searchValue:a,hasExactOption:i,visibleOptionGroupsMapping:e,searchGroup:o,searchByStartsWith:r}),h.isVisible&&(s+=1),i||(i=h.hasExactOption)}),this.allowNewOption&&(a&&!i?(this.setNewOption(),s+=1):this.removeNewOption()),this.visibleOptionsCount=s,this.afterSetVisibleOptionsCount()}calculateAriaMetadata(){let e=0,t=0;if((this.sortedOptions&&this.sortedOptions.length?this.sortedOptions:this.options).forEach(s=>{if(s.isCurrentNew)s.filteredIndex=void 0;else if(!0===s.isVisible){const i=s.isGroupTitle&&this.multiple&&!this.disableOptionGroupCheckbox;!s.isGroupTitle||i?(t+=1,e+=1,s.filteredIndex=t):s.filteredIndex=void 0}else s.filteredIndex=void 0}),this.allowNewOption){const s=this.getNewOption();s&&!0===s.isVisible?(t+=1,e+=1,s.filteredIndex=t):s&&(s.filteredIndex=void 0)}this.ariaSetSize=e}setOptionProp(e,t,s){this.options[e]&&(this.options[e][t]=s)}setOptionsHeight(){this.$optionsList.style.height=this.optionHeight*this.visibleOptionsCount+"px"}setOptionsContainerHeight(e){let t;e?this.showAsPopup&&(this.optionsCount=this.getOptionsCount(),this.halfOptionsCount=Math.ceil(this.optionsCount/2),t=this.getOptionsHeight(),this.optionsHeight=t):(t=this.optionsHeight,this.keepAlwaysOpen&&(s.setStyle(this.$noOptions,"height",t),s.setStyle(this.$noSearchResults,"height",t))),s.setStyle(this.$optionsContainer,"max-height",t),this.afterSetOptionsContainerHeight(e)}setNewOption(e){const t=e||this.searchValueOriginal.trim();if(!t)return;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",this.secureText(t)),this.setOptionProp(e,"label",this.secureText(t))}else{const s={value:t,label:t};e?(s.isNew=!0,this.newValues.push(t)):s.isCurrentNew=!0,this.addOption(s)}}setSelectedProp(){const e={};this.selectedValues.forEach(t=>{e[t]=!0}),this.options.forEach(t=>{!0===e[t.value]&&(t.isSelected=!0)})}setNewOptionsFromValue(e){if(!e)return;const t=this.setNewOption.bind(this),s={};this.options.forEach(e=>{s[e.value]=!0}),e.forEach(e=>{e&&!0!==s[e]&&t(e)})}setDropboxWrapperWidth(){if(this.showAsPopup)return;const e=this.dropboxWidth||`${this.$wrapper.offsetWidth}px`;s.setStyle(this.$dropboxContainer,"max-width",e)}setEleStyles(){const{maxWidth:e}=this,t={};e&&(t["max-width"]=e),s.setStyles(this.$ele,t)}setDropboxStyles(){const{dropboxWidth:e}=this,t={},i={"z-index":this.zIndex};e&&(this.showAsPopup?t["max-width"]=e:i.width=e),s.setStyles(this.$dropboxContainer,i),s.setStyles(this.$dropbox,t)}setOptionAttr(){const{$visibleOptions:e}=this,{options:t}=this,i=`${this.optionHeight}px`,{setStyle:o,getData:n,setData:r}=s;e&&e.length&&e.forEach(e=>{const s=t[n(e,"index")];o(e,"height",i),r(e,"value",s.value)})}setValueTagAttr(){const{$valueTags:e}=this;if(!e||!e.length)return;const{getData:t,setData:i}=s,{options:o}=this;e.forEach(e=>{const s=t(e,"index");if(void 0!==s){const t=o[s];i(e,"value",t.value)}})}setScrollTop(){const{selectedValues:e}=this;if(this.showSelectedOptionsFirst||!this.focusSelectedOptionOnOpen||0===e.length)return;const t={};let s;e.forEach(e=>{t[e]=!0}),this.options.some(e=>!!t[e.value]&&(s=e.visibleIndex,!0)),s&&(this.$optionsContainer.scrollTop=this.optionHeight*s)}getVisibleOptions(){return this.visibleOptions||[]}getValue(){let e;return e=this.multiple?this.useGroupValue?this.getGroupValue():this.selectedValues:this.selectedValues[0]||"",t.normalizeValues(e)}getGroupValue(){const e=[],t={};return this.options.forEach(s=>{if(!s.isSelected)return;const{value:i}=s;s.isGroupTitle?i&&(t[s.index]=!0,e.push(i)):!0!==t[s.groupIndex]&&e.push(i)}),e}getInputValue(e){let t=e;return t&&t.length?this.setValueAsArray&&this.multiple&&(t=JSON.stringify(t)):t=this.emptyValue,t}getFirstVisibleOptionIndex(){return Math.ceil(this.$optionsContainer.scrollTop/this.optionHeight)}getVisibleStartIndex(){let e=this.getFirstVisibleOptionIndex()-this.halfOptionsCount;return e<0&&(e=0),e}getTooltipAttrText(e,i=!1,o=!1){const n={"data-tooltip":(t.containsHTML(e)?t.replaceDoubleQuotesWithHTML(e):e)||"","data-tooltip-enter-delay":this.tooltipEnterDelay,"data-tooltip-z-index":this.zIndex,"data-tooltip-font-size":this.tooltipFontSize,"data-tooltip-alignment":this.tooltipAlignment,"data-tooltip-max-width":this.tooltipMaxWidth,"data-tooltip-ellipsis-only":i,"data-tooltip-allow-html":o};return s.getAttributesText(n)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=i(s(e.value)),n=i(s(e.label)),r=i(s(e.description));return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:n,labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:r,descriptionNormalized:this.searchNormalize&&""!==r.trim()?t.normalizeString(r).toLowerCase():r.toLowerCase(),alias:this.getAlias(e.alias),isCurrentNew:e.isCurrentNew||!1,isNew:e.isNew||!1,isVisible:!0}}getNewOption(){const e=this.options[this.lastOptionIndex];if(e&&e.isCurrentNew)return e}getOptionIndex(e){let t;return this.options.some(s=>s.value===e&&(t=s.index,!0)),t}getNewValue(){const e={};this.newValues.forEach(t=>{e[t]=!0});const t=this.selectedValues.filter(t=>!0===e[t]);return this.multiple?t:t[0]}getAlias(e){let t=e;return t&&(t=Array.isArray(t)?t.join(","):t.toString().trim(),t=t.toLowerCase()),t||""}getDisplayValue(){const e=[];return this.options.forEach(t=>{t.isSelected&&e.push(t.label)}),this.multiple?e:e[0]||""}getSelectedOptions({fullDetails:e=!1,keepSelectionOrder:t=!1}={}){const{valueKey:s,labelKey:i,selectedValues:o}=this,n=[];if(this.options.forEach(t=>{if(t.isSelected&&!t.isGroupTitle)if(e)n.push(t);else{const e={[s]:t.value,[i]:t.label};t.isNew&&(e.isNew=!0),t.customData&&(e.customData=t.customData),n.push(e)}}),t){const e={};o.forEach((t,s)=>{e[t]=s}),n.sort((t,s)=>e[t.value]-e[s.value])}return this.multiple||e?n:n[0]}getDisabledOptions(){const{valueKey:e,labelKey:t,disabledOptions:s}=this,i={},o=[];return s.forEach(e=>{i[e]=!0}),this.options.forEach(({value:s,label:n})=>{i[s]&&o.push({[e]:s,[t]:n})}),o}getVisibleOptionGroupsMapping(e){let{options:t}=this;const s={},i=this.isOptionVisible.bind(this);return t=this.structureOptionGroup(t),t.forEach(t=>{s[t.index]=t.options.some(t=>i({data:t,searchValue:e}).isVisible)}),s}getOptionsCount(e){let t;if(this.showAsPopup){let e=80*window.innerHeight/100-48;this.hasSearchContainer&&(e-=40),t=Math.floor(e/this.optionHeight)}else t=parseInt(e);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}getSibling(e,t){const i="next"===t?"nextElementSibling":"previousElementSibling";let o=e;do{o&&(o=o[i])}while(s.hasClass(o,"disabled")||s.hasClass(o,"group-title"));return o}getUniqueId(){const e=t.getRandomInt(1e4);return document.querySelector(`#vscomp-ele-wrapper-${e}`)?this.getUniqueId():e}initDropboxPopover(){const e={ele:this.$ele,target:this.$dropboxContainer,position:this.position,zIndex:this.zIndex,margin:4,transitionDistance:30,hideArrowIcon:!0,disableManualAction:!0,disableUpdatePosition:!this.hasDropboxWrapper,updatePositionThrottle:this.updatePositionThrottle,showDuration:this.showDuration,hideDuration:this.hideDuration,afterShow:this.afterShowPopper.bind(this),afterHide:this.afterHidePopper.bind(this)};this.dropboxPopover=new PopoverComponent(e)}openDropbox(e){l.lastInteractedInstance=this;let t="";e||(t=this.$dropboxContainer.style.transition,this.$dropboxContainer.style.transition="none"),this.isSilentOpen=e,l.openInstances.forEach(e=>{if(e!==this){const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox(!0)}}),l.openInstances.add(this),s.setAttr(this.$dropboxWrapper,"tabindex","0"),s.setAria(this.$dropboxWrapper,"hidden",!1),s.setAttr(this.$dropboxContainerTop,"tabindex","0"),s.setAria(this.$dropboxContainerTop,"hidden",!1),s.setAttr(this.$dropboxContainerBottom,"tabindex","0"),s.setAria(this.$dropboxContainerBottom,"hidden",!1),e?s.setStyle(this.$dropboxContainer,"display","inline-flex"):(s.dispatchEvent(this.$ele,"beforeOpen"),s.setAria(this.$wrapper,"expanded",!0)),this.setDropboxWrapperWidth(),s.removeClass(this.$allWrappers,"closed"),s.changeTabIndex(this.$allWrappers,0),e||(this.$dropboxContainer.offsetHeight,this.$dropboxContainer.style.transition=t),this.dropboxPopover&&!e?this.dropboxPopover.show():this.afterShowPopper()}afterShowPopper(){const e=this.isSilentOpen;this.isSilentOpen=!1,e||(this.moveSelectedOptionsFirst(),this.setScrollTop(),s.addClass(this.$allWrappers,"focused"),this.showAsPopup?(s.addClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!0):this.focusElementOnOpen(),s.dispatchEvent(this.$ele,"afterOpen"))}closeDropbox(e){if(this.isSilentClose=e,l.openInstances.delete(this),!1===this.isOpened())return;if(this.keepAlwaysOpen)return void this.removeOptionFocus();const t=document.activeElement,i=t&&this.$wrapper.contains(t)||this.hasDropboxWrapper&&t&&this.$dropboxWrapper.contains(t);this.shouldFocusWrapperOnClose&&l.lastInteractedInstance===this&&!e&&(null===t||t===document.body||i)&&this.$wrapper.focus(),e?s.setStyle(this.$dropboxContainer,"display",""):(s.dispatchEvent(this.$ele,"beforeClose"),s.setAria(this.$wrapper,"expanded",!1),s.setAria(this.$wrapper,"activedescendant",""),s.setAria(this.$dropboxContainer,"activedescendant","")),this.dropboxPopover&&!e?(this.dropboxPopover.hide(),s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)):this.afterHidePopper(),this.setSearchValue("")}afterHidePopper(){const e=this.isSilentClose;this.isSilentClose=!1,s.removeClass(this.$allWrappers,"focused"),this.removeOptionFocus(),!e&&this.isPopupActive&&(s.removeClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!1),s.addClass(this.$allWrappers,"closed"),e||s.dispatchEvent(this.$ele,"afterClose"),this.shouldFocusWrapperOnClose=!0,s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)}moveSelectedOptionsFirst(){this.$optionsContainer.scrollTop&&this.selectedValues.length||this.setVisibleOptions(),this.showSelectedOptionsFirst&&(this.setSortedOptions(),this.scrollToTop(),this.setVisibleOptions())}toggleDropbox(){l.lastInteractedInstance=this,this.isOpened()?this.closeDropbox():this.openDropbox()}updatePosition(){this.dropboxPopover&&this.isOpened()&&this.$ele.updatePosition()}isOpened(){return!s.hasClass(this.$wrapper,"closed")}focusSearchInput(){const e=this.$searchInput;e&&e.focus()}focusElementOnOpen(){const e=this.$searchInput,t=!this.options.length&&!this.hasServerSearch;if(e)t&&!this.allowNewOption?(s.setAttr(e,"disabled",""),this.$noOptions.focus()):(e.removeAttribute("disabled"),e.focus());else{const e=this.$dropbox.querySelector('[tabindex="0"]');void 0!==s.getData(e,"index")?this.focusOption({direction:"next"}):e?e.focus():this.focusFirstVisibleOption()}}focusFirstVisibleOption(){let e=this.$optionsContainer.querySelector(`[data-index='${this.getFirstVisibleOptionIndex()}']`);e?(s.hasClass(e,"group-title")&&(e=this.getSibling(e,"next")),s.setAttr(e,"tabindex","0"),this.$optionsContainer.scrollTop=this.optionHeight*this.getFirstVisibleOptionIndex(),this.focusOption({focusFirst:!0}),e.focus()):(e=this.$dropbox.querySelector('[tabindex="0"]'),e&&e.focus())}focusOption({direction:e,$option:t,focusFirst:i}={}){const o=this.$dropboxContainer.querySelector(".vscomp-option.focused");let n;if(t)n=t;else if(!o||i){const e=this.getFirstVisibleOptionIndex();n=this.$dropboxContainer.querySelector(`.vscomp-option[data-visible-index="${e}"]`),(s.hasClass(n,"disabled")||s.hasClass(n,"group-title"))&&(n=this.getSibling(n,"next"))}else n=this.getSibling(o,e);n&&n!==o&&(o&&this.toggleOptionFocusedState(o,!1),this.toggleOptionFocusedState(n,!0),this.toggleFocusedProp(s.getData(n,"index"),!0),this.moveFocusedOptionToView(n))}moveFocusedOptionToView(e){const t=e||this.$dropboxContainer.querySelector(".vscomp-option.focused");if(!t)return;let i;const o=this.$optionsContainer.getBoundingClientRect(),n=t.getBoundingClientRect(),r=o.top,a=o.bottom,l=o.height,h=n.top,p=n.bottom,c=n.height,u=t.offsetTop,d=s.getData(this.$options,"top","number");r>h?i=u+d:a{if(e.isDisabled||e.isGroupTitle||!e.isVisible||e.isSelected)return;const{index:t}=e;if(t>o&&t{e(parseInt(t))})}this.setManagedTimeout(()=>{this.renderOptions()},0)}toggleAllOptions(e){if(!this.multiple||this.disableSelectAll)return;const t="boolean"==typeof isSelected?e:!s.hasClass(this.$toggleAllCheckbox,"checked"),i=[],{selectAllOnlyVisible:o}=this;this.options.forEach(e=>{const s=e;if(s.isDisabled||s.isCurrentNew)return;const{isVisible:n,isSelected:r}=s;!t&&(!o||n||!r)||t&&o&&!n&&!r?s.isSelected=!1:(s.isSelected=!0,s.isGroupTitle||i.push(s.value))}),this.toggleAllOptionsClass(t),this.setValue(i),this.renderOptions()}toggleAllOptionsClass(e){if(!this.multiple)return;let t=!1;"boolean"==typeof e||(e=this.isAllOptionsSelected()),!e&&this.selectAllOnlyVisible&&""!==this.searchValue&&(this.visibleOptionsCount>0||""===this.searchValue)&&(t=this.isAllOptionsSelected(!0)),s.toggleClass(this.$toggleAllCheckbox,"checked",e||t),this.isAllSelected=e}isAllOptionsSelected(e){let t=!1;return this.options.length&&this.selectedValues.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&(!e||t.isVisible))),t}isAllGroupOptionsSelected(e){let t=!1;return this.options.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&t.groupIndex===e)),t}toggleGroupOptionsParent(e,t){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;let i=s.getData(e,"groupIndex");void 0!==i&&(i=parseInt(i));const o=this.$options.querySelector(`.vscomp-option[data-index="${i}"]`),n="boolean"==typeof t?t:this.isAllGroupOptionsSelected(i);this.toggleGroupTitleCheckbox(o,n),this.toggleGroupTitleProp(i,n)}toggleGroupTitleProp(e,t){const s="boolean"==typeof t?t:this.isAllGroupOptionsSelected(e);this.toggleSelectedProp(e,s)}toggleGroupOptions(e,i){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;const o=s.getData(e,"index","number"),{selectedValues:n,selectAllOnlyVisible:r}=this,a={},{removeItemFromArray:l}=t;n.forEach(e=>{a[e]=!0}),this.options.forEach(e=>{if(e.isDisabled||e.groupIndex!==o)return;const{value:t}=e;!i||r&&!e.isVisible?(e.isSelected=!1,a[t]&&l(n,t)):(e.isSelected=!0,a[t]||n.push(t))}),this.toggleAllOptionsClass(!!i&&null),this.setValue(n),this.setManagedTimeout(()=>{this.renderOptions()},0)}toggleGroupTitleCheckbox(e,t){if(!e)return;const i=s.getData(e,"index","number");this.toggleSelectedProp(i,t),this.toggleOptionSelectedState(e,t)}toggleFocusedProp(e,t=!1){this.focusedOptionIndex&&this.setOptionProp(this.focusedOptionIndex,"isFocused",!1),this.setOptionProp(e,"isFocused",t),this.focusedOptionIndex=e}toggleSelectedProp(e,t=!1){this.setOptionProp(e,"isSelected",t)}scrollToTop(){const{scrollTop:e}=this.$optionsContainer;e>0&&(this.$optionsContainer.scrollTop=0)}reset(e=!1,t=!1){this.options.forEach(e=>{e.isSelected=!1}),this.beforeValueSet(!0),this.setValue(null,{disableEvent:t,disableValidation:e}),this.afterValueSet(),e&&s.removeClass(this.$allWrappers,"has-error"),s.dispatchEvent(this.$ele,"reset")}addOption(e,t){if(!e)return;this.lastOptionIndex+=1;const s=this.getOptionObj({...e,index:this.lastOptionIndex});this.options.push(s),this.sortedOptions.push(s),t&&(this.visibleOptionsCount+=1,this.afterSetOptions())}removeOption(e){(e||0===e)&&(this.options.splice(e,1),this.lastOptionIndex-=1)}removeNewOption(){const e=this.getNewOption();e&&this.removeOption(e.index)}sortOptions(e){return e.sort((e,t)=>{const s=e.isSelected||e.isAnySelected,i=t.isSelected||t.isAnySelected;return s||i?s&&(!i||e.index{const s=e.options;e.isAnySelected=s.some(e=>e.isSelected),e.isAnySelected&&t(s)}),t(s),this.destructureOptionGroup(s)}isOptionVisible({data:e,searchValue:s,hasExactOption:i,visibleOptionGroupsMapping:o,searchGroup:n,searchByStartsWith:r}){const a=null!=e.valueNormalized?e.valueNormalized:e.value.toLowerCase();let l=e.labelNormalized;if(null==l){const s=(e.label||"").trim();l=this.searchNormalize&&""!==s?t.normalizeString(s).toLowerCase():s.toLowerCase()}const{description:h,alias:p}=e;let{descriptionNormalized:c}=e;if(null==c){const e=h||"";c=this.searchNormalize&&""!==e.trim()?t.normalizeString(e).toLowerCase():e.toLowerCase()}let u=r?l.startsWith(s):l.includes(s);return!e.isGroupTitle||n&&u||(u=o[e.index]),r||!p||u||(u=p.includes(s)),r||!c||u||(u=c.includes(s)),e.isVisible=u,i||(i=l===s||a===s),{isVisible:u,hasExactOption:i}}structureOptionGroup(e){const t=[],s={};return e.forEach(e=>{if(e.isGroupTitle){const i=[];e.options=i,s[e.index]=i,t.push(e)}}),e.forEach(e=>{e.isGroupOption&&s[e.groupIndex].push(e)}),t}destructureOptionGroup(e){let t=[];return e.forEach(e=>{t.push(e),t=t.concat(e.options)}),t}serverSearch(){s.removeClass(this.$allWrappers,"has-no-search-results"),s.addClass(this.$allWrappers,"server-searching"),this.setSelectedOptions(),this.onServerSearch(this.searchValue,this)}removeValue(e){const{selectedValues:i}=this,o=s.getData(e,"value");t.removeItemFromArray(i,o),this.setValueMethod(i)}focus(){this.$wrapper.focus()}enable(){this.$ele.disabled=!1,this.$ele.removeAttribute("disabled"),this.$hiddenInput.removeAttribute("disabled"),s.setAria(this.$wrapper,"disabled",!1),s.changeTabIndex(this.$wrapper,0)}disable(){this.$ele.disabled=!0,this.$ele.setAttribute("disabled",""),this.$hiddenInput.setAttribute("disabled",""),s.setAria(this.$wrapper,"disabled",!0),s.changeTabIndex(this.$wrapper,-1),this.$wrapper.blur()}validate(){if(this.disableValidation)return!0;let e=!1;const{selectedValues:i,minValues:o}=this;return this.required&&(t.isEmpty(i)||this.multiple&&o&&i.length{this.managedTimeouts.delete(s),e()},t);return this.managedTimeouts.add(s),s}clearManagedTimeouts(){this.managedTimeouts&&(this.managedTimeouts.forEach(e=>clearTimeout(e)),this.managedTimeouts.clear())}destroy(){const{$ele:e}=this;e.virtualSelect=void 0,e.value=void 0,e.innerHTML="",l.openInstances.delete(this),this===l.lastInteractedInstance&&(l.lastInteractedInstance=null),this.serverSearchTimeout&&(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=null),this.clearManagedTimeouts(),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={}}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=t.replaceDoubleQuotesWithHTML(e),this.$secureDiv.innerHTML):e}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required}toggleOptionSelectedState(e,t){let i=t;void 0===i&&(i=!s.hasClass(e,"selected")),s.toggleClass(e,"selected",i),s.setAria(e,"selected",i)}toggleOptionFocusedState(e,t){e&&(s.toggleClass(e,"focused",t),s.setAttr(e,"tabindex",t?"0":"-1"),document.activeElement!==this.$searchInput&&e.focus(),t&&(s.setAria(this.$wrapper,"activedescendant",e.id),s.setAria(this.$dropboxContainer,"activedescendant",e.id)))}static init(e){let t=e.ele;if(!t)return;let s=!1;if("string"==typeof t){t=document.querySelectorAll(t);const e=t.length;if(0===e)return;1===e&&(s=!0)}void 0!==t.length&&void 0!==t.forEach||(t=[t],s=!0);const i=[];return t.forEach(t=>{t.virtualSelect?i.push(t.virtualSelect):(e.ele=t,"SELECT"===t.tagName&&l.setPropsFromSelect(e),i.push(new l(e)))}),s?i[0]:i}static getAttrProps(){const{convertPropToDataAttr:e}=s,t={};return n.forEach(e=>{t[e]=e}),a.forEach(s=>{t[e(s)]=s}),t}static setPropsFromSelect(e){const t=e.ele,i=[],n=[],a=e=>{const t=[];return Array.from(e.children).forEach(e=>{const{value:s}=e,o={value:s};"OPTGROUP"===e.tagName?(o.label=e.getAttribute("label"),o.options=a(e)):o.label=e.innerHTML,t.push(o),e.disabled&&i.push(s),e.selected&&n.push(s)}),t},l=a(t),h=document.createElement("div");s.setAttrFromEle(t,h,Object.keys(r),o),t.parentNode.insertBefore(h,t),t.remove(),e.ele=h,e.options=l,e.disabledOptions=i,e.selectedValue=n}static onFormReset(e){const t=e.target.closest("form");t&&t.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.reset(!0)})}static onFormSubmit(e){l.validate(e.target.closest("form"))||e.preventDefault()}static validate(e){if(!e)return!0;let t=!1;return e.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const s=e.parentElement.virtualSelect.validate();t||s||(t=!0)}),!t}static reset(e=!1,t=!1){this.virtualSelect.reset(e,t)}static setValueMethod(...e){this.virtualSelect.setValueMethod(...e)}static setOptionsMethod(...e){this.virtualSelect.setOptionsMethod(...e)}static setDisabledOptionsMethod(...e){this.virtualSelect.setDisabledOptionsMethod(...e)}static setEnabledOptionsMethod(...e){this.virtualSelect.setEnabledOptionsMethod(...e)}static toggleSelectAll(e){this.virtualSelect.toggleAllOptions(e)}static isAllSelected(){return this.virtualSelect.isAllSelected}static addOptionMethod(e){this.virtualSelect.addOption(e,!0)}static getNewValueMethod(){return this.virtualSelect.getNewValue()}static getDisplayValueMethod(){return this.virtualSelect.getDisplayValue()}static getSelectedOptionsMethod(e){return this.virtualSelect.getSelectedOptions(e)}static getDisabledOptionsMethod(){return this.virtualSelect.getDisabledOptions()}static openMethod(){return this.virtualSelect.openDropbox()}static closeMethod(){return this.virtualSelect.closeDropbox()}static focusMethod(){return this.virtualSelect.focus()}static enableMethod(){return this.virtualSelect.enable()}static disableMethod(){return this.virtualSelect.disable()}static destroyMethod(){return this.virtualSelect.destroy()}static validateMethod(){return this.virtualSelect.validate()}static toggleRequiredMethod(e){return this.virtualSelect.toggleRequired(e)}static onResizeMethod(){document.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const t=e.parentElement&&e.parentElement.virtualSelect;t&&t.onResize()})}}document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit);const h=t.throttle(l.onResizeMethod,100);l.onResizeThrottled=h,window.addEventListener("resize",h),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.lastInteractedInstance=null,"undefined"!=typeof NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach)}(),function(){"use strict";function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,s){if(e){if("string"==typeof e)return t(e,s);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,s):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var s=0,i=new Array(t);ss-o-t.width?"left":"right",vertical:n>i-n-t.height?"top":"bottom"}}},{key:"getAbsoluteCoords",value:function(e){if(e){var t=e.getBoundingClientRect(),s=window.pageXOffset,i=window.pageYOffset;return{width:t.width,height:t.height,top:t.top+i,right:t.right+s,bottom:t.bottom+i,left:t.left+s}}}},{key:"getCoords",value:function(e){return e?e.getBoundingClientRect():{}}},{key:"getData",value:function(e,t,s){if(e){var i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}}},{key:"setData",value:function(e,t,s){e&&(e.dataset[t]=s)}},{key:"setStyle",value:function(e,t,s){e&&(e.style[t]=s)}},{key:"show",value:function(e){var s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.setStyle(e,"display",s)}},{key:"hide",value:function(e){t.setStyle(e,"display","none")}},{key:"getHideableParent",value:function(e){for(var t,s=e.parentElement;s;){var i=getComputedStyle(s).overflow;if(-1!==i.indexOf("scroll")||-1!==i.indexOf("auto")){t=s;break}s=s.parentElement}return t}}],s&&function(e,t){for(var s=0;sO?O-b:M:w+p>L&&("right"===E?n="left":w=L+by?y-u:P:C+c>I&&("bottom"===E?n="top":C=I+up-j&&(G=p-j):"left"!==E&&"right"!==E||((H=f/2+g-R)c-j&&(H=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(H),"px, 0) ").concat(K))}s.hide(this.$popperEle)}},{key:"resetPosition",value:function(){s.setStyle(this.$popperEle,"transform","none"),this.setPosition()}},{key:"show",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.resetPosition,o=t.data;clearTimeout(this.exitDelayTimeout),clearTimeout(this.hideDurationTimeout),i&&this.resetPosition(),this.enterDelayTimeout=setTimeout(function(){var t=s.getData(e.$popperEle,"left"),i=s.getData(e.$popperEle,"top"),n="translate3d(".concat(parseInt(t),"px, ").concat(parseInt(i),"px, 0)"),r=e.showDuration;s.show(e.$popperEle,"inline-flex"),s.getCoords(e.$popperEle),s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",1),e.showDurationTimeout=setTimeout(function(){"function"==typeof e.afterShowCallback&&e.afterShowCallback(o)},r)},this.enterDelay)}},{key:"hide",value:function(){var e=this,t=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}).data;clearTimeout(this.enterDelayTimeout),clearTimeout(this.showDurationTimeout),this.exitDelayTimeout=setTimeout(function(){if(e.$popperEle){var i=parseInt(s.getData(e.$popperEle,"fromLeft")),o=parseInt(s.getData(e.$popperEle,"fromTop")),n="translate3d(".concat(i,"px, ").concat(o,"px, 0)"),r=e.hideDuration;s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",0),e.hideDurationTimeout=setTimeout(function(){s.hide(e.$popperEle),"function"==typeof e.afterHideCallback&&e.afterHideCallback(t)},r)}},this.exitDelay)}},{key:"updatePosition",value:function(){s.setStyle(this.$popperEle,"transitionDuration","0ms"),this.resetPosition();var e=parseInt(s.getData(this.$popperEle,"left")),t=parseInt(s.getData(this.$popperEle,"top"));s.show(this.$popperEle,"inline-flex"),s.setStyle(this.$popperEle,"transform","translate3d(".concat(e,"px, ").concat(t,"px, 0)"))}}],t&&function(e,t){for(var s=0;s1&&void 0!==arguments[1]&&arguments[1]}},{key:"removeArrayEmpty",value:function(e){return Array.isArray(e)&&e.length?e.filter(function(e){return!!e}):[]}},{key:"throttle",value:function(e,t){var s,i=0;return function(){for(var o=arguments.length,n=new Array(o),r=0;re.length)&&(t=e.length);for(var s=0,i=new Array(t);s'),e=this.$popover.querySelector(".pop-comp-arrow")),this.$arrowEle=e}}},{key:"destroy",value:function(){this.removeEvents()}}])&&c(t.prototype,s),o&&c(t,o),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,s,o}();d=m.getAttrProps(),window.PopoverComponent=m}(); \ No newline at end of file diff --git a/docs/assets/virtual-select.js b/docs/assets/virtual-select.js index 3f05bf8..49401f0 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -230,6 +230,67 @@ class Utils { static containsHTMLorJS(text) { return /<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(text); } + + /** + * Remove characters that could break out of the double-quoted class attribute + * (`"`, `<`, `>`). Valid CSS class tokens never contain these characters, so legitimate + * class names are left untouched while attribute-injection via classNames is prevented. + * @static + * @param {string} classNames + * @return {string} + * @memberof Utils + */ + static sanitizeClassNames(classNames) { + return classNames ? String(classNames).replace(/["<>]/g, '') : classNames; + } + + /** + * Rate-limit a function so it runs at most once per `wait` ms (leading + trailing edge). + * Used to keep high-frequency events (e.g. window resize) from running per-instance work + * on every tick. + * @static + * @param {Function} callback + * @param {number} wait + * @return {Function} + * @memberof Utils + */ + static throttle(callback, wait) { + /** @type {ReturnType | null} */ + let timeout = null; + /** @type {unknown[]} */ + let lastArgs = []; + /** @type {unknown} */ + let lastThis; + let previous = 0; + + /** @this {unknown} */ + return function throttled(/** @type {unknown[]} */...args) { + const now = Date.now(); + const remaining = wait - (now - previous); + lastArgs = args; + lastThis = this; + if (remaining <= 0 || remaining > wait) { + if (timeout) { + clearTimeout(timeout); + timeout = null; + } + previous = now; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + } else if (!timeout) { + timeout = setTimeout(() => { + previous = Date.now(); + timeout = null; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + }, remaining); + } + }; + } } ;// ./src/utils/dom-utils.js @@ -765,6 +826,13 @@ class VirtualSelect { } = Utils; let groupName = ''; if (markSearchResults) { + /** + * Search input is regex-escaped (no ReDoS). The (?!([^<]+)?>) lookahead avoids inserting + * inside a tag; it relies on option labels being escaped via enableSecureText. When + * enableSecureText is off, labels are rendered as raw HTML by design (the consumer opts into + * this), so this highlight does not introduce an additional injection vector beyond the raw + * HTML the consumer already chose to render. + */ searchRegex = new RegExp(`(${Utils.regexEscape(this.searchValue)})(?!([^<]+)?>)`, 'gi'); } if (this.multiple) { @@ -790,7 +858,8 @@ class VirtualSelect { const isSelected = convertToBoolean(d.isSelected); let ariaDisabledText = ''; if (d.classNames) { - optionClasses += ` ${d.classNames}`; + /** sanitize so a consumer-provided class string cannot break out of the class attribute */ + optionClasses += ` ${Utils.sanitizeClassNames(d.classNames)}`; } if (d.isFocused) { tabIndexValue = '0'; @@ -815,8 +884,17 @@ class VirtualSelect { optionClasses += ' group-option'; groupIndexText = `data-group-index="${d.groupIndex}"`; if (d.customData) { - groupName = d.customData.group_name !== undefined ? `${d.customData.group_name}, ` : ''; - optionDesc = d.customData.description !== undefined ? ` ${d.customData.description},` : ''; + /** + * customData fields are interpolated into the aria-label attribute, so they must be + * escaped the same way as label/value (via secureText). Otherwise a quote in + * group_name/description can break out of the attribute even when enableSecureText + * is on - an XSS bypass. secureText is a no-op when enableSecureText is disabled, + * keeping the existing behaviour for consumers that intentionally pass raw text. + */ + const groupNameText = this.secureText(Utils.getString(d.customData.group_name)); + const groupDescText = this.secureText(Utils.getString(d.customData.description)); + groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; + optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; } else { ariaLabel = `aria-label="${groupName}, ${d.label}"`; @@ -916,7 +994,7 @@ class VirtualSelect { this.addEvent(this.$options, 'click', 'onOptionsClick'); this.addEvent(this.$options, 'mouseover', 'onOptionsMouseOver'); this.addEvent(this.$options, 'touchmove', 'onOptionsTouchMove'); - VirtualSelect.observeDomChanges(); + this.addMutationObserver(); } addEvent($ele, events, method, capture = false) { if (!$ele) { @@ -970,6 +1048,7 @@ class VirtualSelect { if (this.$dropboxContainerTop) { this.removeEvent(this.$dropboxContainerTop, 'focus', 'onDropboxContainerTopOrBottomFocus'); } + this.removeMutationObserver(); } removeEvent($ele, events, method, capture = false) { if (!$ele) { @@ -1171,40 +1250,38 @@ class VirtualSelect { this.setOptionsContainerHeight(true); } - /** - * Single shared observer (instead of one body-wide subtree observer per instance) that - * self-destroys any VirtualSelect whose host element is removed from the DOM. This works - * in every mode - so removing the element without calling destroy() no longer leaks the - * addEvents() listeners (notably the capture-phase document click listener that retains - * the instance and its DOM). Inspecting removedNodes makes the cost proportional to the - * number of removed nodes rather than the number of live instances. - */ - static observeDomChanges() { - if (VirtualSelect.domObserver) { + /** to remove dropboxWrapper on removing vscomp-ele when it is rendered outside of vscomp-ele */ + addMutationObserver() { + if (!this.hasDropboxWrapper) { return; } - VirtualSelect.domObserver = new MutationObserver(mutations => { + const $vscompEle = this.$ele; + this.mutationObserver = new MutationObserver(mutations => { + let isAdded = false; + let isRemoved = false; mutations.forEach(mutation => { - mutation.removedNodes.forEach($node => { - if ($node.nodeType !== Node.ELEMENT_NODE) { - return; - } - const $eles = $node.classList.contains('vscomp-ele') ? [$node] : []; - $node.querySelectorAll('.vscomp-ele').forEach($ele => $eles.push($ele)); - $eles.forEach($ele => { - /** isConnected is false only when the node was genuinely detached (not moved/re-added) */ - if (!$ele.isConnected && $ele.virtualSelect) { - $ele.virtualSelect.destroy(); - } - }); - }); + if (!isAdded) { + isAdded = [...mutation.addedNodes].some($ele => !!($ele === $vscompEle || $ele.contains($vscompEle))); + } + if (!isRemoved) { + isRemoved = [...mutation.removedNodes].some($ele => !!($ele === $vscompEle || $ele.contains($vscompEle))); + } }); + if (isRemoved && !isAdded) { + this.destroy(); + } }); - VirtualSelect.domObserver.observe(document.documentElement, { + this.mutationObserver.observe(document.querySelector('body'), { childList: true, subtree: true }); } + removeMutationObserver() { + if (this.mutationObserver) { + this.mutationObserver.disconnect(); + this.mutationObserver = null; + } + } /** dom event methods - end */ /** before event methods - start */ @@ -1226,7 +1303,7 @@ class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.setSearchValue(''); this.focusSearchInput(); }, 0); @@ -1287,7 +1364,7 @@ class VirtualSelect { this.setOptionsPosition(); this.setOptionsTooltip(); if (document.activeElement !== this.$searchInput) { - setTimeout(() => { + this.setManagedTimeout(() => { const focusedOption = DomUtils.getElementsBySelector('.focused', this.$dropboxContainer)[0]; if (focusedOption !== undefined) { focusedOption.focus({ @@ -2739,8 +2816,9 @@ class VirtualSelect { DomUtils.removeClass(this.$allWrappers, 'closed'); DomUtils.changeTabIndex(this.$allWrappers, 0); if (!isSilent) { - // Force synchronous layout and style calculation - // Trigger reflow + // INTENTIONAL forced reflow (do not remove as a "no-op"): reading offsetHeight flushes + // the 'transition: none' set above so restoring the transition below does not animate the + // open from a stale layout. Scoped to a single element on open, so the cost is negligible. this.$dropboxContainer.offsetHeight; // eslint-disable-line no-unused-expressions // Restore transitions immediately after reflow this.$dropboxContainer.style.transition = originalTransition; @@ -3096,7 +3174,7 @@ class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3232,7 +3310,7 @@ class VirtualSelect { this.setValue(selectedValues); /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3468,6 +3546,28 @@ class VirtualSelect { DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); return !hasError; } + + /** + * setTimeout wrapper whose pending timers are tracked so they can be cleared on destroy(). + * Prevents callbacks from running against a destroyed instance (stale DOM access / retention). + */ + setManagedTimeout(callback, delay) { + if (!this.managedTimeouts) { + this.managedTimeouts = new Set(); + } + const id = setTimeout(() => { + this.managedTimeouts.delete(id); + callback(); + }, delay); + this.managedTimeouts.add(id); + return id; + } + clearManagedTimeouts() { + if (this.managedTimeouts) { + this.managedTimeouts.forEach(id => clearTimeout(id)); + this.managedTimeouts.clear(); + } + } destroy() { const { $ele @@ -3490,6 +3590,9 @@ class VirtualSelect { this.serverSearchTimeout = null; } + // Clear any other pending timeouts so their callbacks don't run on a destroyed instance + this.clearManagedTimeouts(); + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -3732,25 +3835,36 @@ class VirtualSelect { static toggleRequiredMethod(isRequired) { return this.virtualSelect.toggleRequired(isRequired); } + + // Stable reference to the throttled resize handler is assigned at module init time + // (see `VirtualSelect.onResizeThrottled = ...` near the global resize listener). + static onResizeMethod() { document.querySelectorAll('.vscomp-ele-wrapper').forEach($ele => { - $ele.parentElement.virtualSelect.onResize(); + /** guard against wrappers whose instance is mid-teardown / not initialised */ + const instance = $ele.parentElement && $ele.parentElement.virtualSelect; + if (instance) { + instance.onResize(); + } }); } /** static methods - end */ } document.addEventListener('reset', VirtualSelect.onFormReset); document.addEventListener('submit', VirtualSelect.onFormSubmit); -window.addEventListener('resize', VirtualSelect.onResizeMethod); +/** + * throttle resize so the per-instance height recompute runs at most ~10x/sec during a drag. + * Keep a stable reference on VirtualSelect so the listener can be removed later if needed. + */ +const onResizeThrottled = Utils.throttle(VirtualSelect.onResizeMethod, 100); +VirtualSelect.onResizeThrottled = onResizeThrottled; +window.addEventListener('resize', onResizeThrottled); attrPropsMapping = VirtualSelect.getAttrProps(); window.VirtualSelect = VirtualSelect; // Static property for tracking open dropdowns VirtualSelect.openInstances = new Set(); -// Single shared MutationObserver that self-destroys instances whose host element is removed -VirtualSelect.domObserver = null; - // Static property for tracking the last interacted instance VirtualSelect.lastInteractedInstance = null; diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 280862d..645eae4 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.2.0 * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) - */!function(){"use strict";const e=/[^\p{L}\p{N}_]/gu;class t{static getString(e){return e||0===e?e.toString():""}static convertToBoolean(e,t=!1){let s;return s=!0===e||"true"===e||!1!==e&&"false"!==e&&t,s}static isEmpty(e){let t=!1;return e?Array.isArray(e)?0===e.length&&(t=!0):"object"==typeof e&&0===Object.keys(e).length&&(t=!0):t=!0,t}static isNotEmpty(e){return!t.isEmpty(e)}static normalizeValues(e){if(Array.isArray(e)){const t=new Array(e.length);for(let s=0;s!!e):[]}static getRandomInt(e,t=0){const s=Math.ceil(t),i=Math.floor(e);return Math.floor(Math.random()*(i-s-1))+s}static regexEscape(e){return e.replace(/[-/\\^$*+?.()|[\]{}]/g,"\\$&")}static normalizeString(t){return t.normalize("NFD").replace(e,"")}static willTextOverflow(e,t){const s=document.createElement("div");s.style.position="absolute",s.style.visibility="hidden",s.style.whiteSpace="nowrap",s.style.fontSize=window.getComputedStyle(e).fontSize,s.style.fontFamily=window.getComputedStyle(e).fontFamily,s.textContent=t,document.body.appendChild(s);const i=s.clientWidth;return document.body.removeChild(s),i>e.clientWidth}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static containsHTML(e){return/<[a-z][\s\S]*>/i.test(e)}static containsHTMLorJS(e){return/<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(e)}}class s{static addClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.add(...i)})}static removeClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.remove(...i)})}static toggleClass(e,t,i){if(!e)return;let o;void 0!==i&&(o=Boolean(i)),s.getElements(e).forEach(e=>{e.classList.toggle(t,o)})}static hasClass(e,t){return!!e&&e.classList.contains(t)}static hasEllipsis(e){return!!e&&e.scrollWidth>e.offsetWidth}static getData(e,t,s){if(!e)return;let i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}static setData(e,t,s){e&&(e.dataset[t]=s)}static setAttr(e,t,s){e&&e.setAttribute(t,s)}static setAttrFromEle(e,t,s,i){const o={};s.forEach(t=>{o[t]=e.getAttribute(t)}),s.forEach(e=>{const s=o[e];(s||-1!==i.indexOf(e)&&""===s)&&t.setAttribute(e,s)})}static setStyle(e,t,s){e&&(e.style[t]=s)}static setStyles(e,t){e&&t&&Object.keys(t).forEach(s=>{e.style[s]=t[s]})}static setAria(e,t,s){if(!e)return;let i=t;"role"!==i&&(i=`aria-${i}`),e.setAttribute(i,s)}static getElements(e){return e?void 0===e.forEach?[e]:e:[]}static getElementsBySelector(e="",t=void 0){let s;const i=void 0!==t?t:document;return""!==e&&(s=i.querySelectorAll(e)),void 0!==s?Array.from(s):[]}static addEvent(e,i,o,n){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{s.getElements(e).forEach(e=>{e.addEventListener(t,o,{capture:n})})})}static dispatchEvent(e,t,i=!1){if(!e)return;const o=s.getElements(e);setTimeout(()=>{o.forEach(e=>{e.dispatchEvent(new CustomEvent(t,{bubbles:i}))})},0)}static getAttributesText(e){let t="";return e?(Object.entries(e).forEach(([e,s])=>{void 0!==s&&(t+=` ${e}="${s}" `)}),t):t}static convertPropToDataAttr(e){return e?`data-${e}`.replace(/([A-Z])/g,"-$1").toLowerCase():""}static changeTabIndex(e,t){e?s.getElements(e).forEach(e=>{e.tabIndex=t}):console.log(e,"Invalid element provided.")}static removeEvent(e,t,i,o=!1){e&&s.getElements(e).forEach(e=>{e.removeEventListener(t,i,{capture:o})})}}const i={13:"onEnterPress",38:"onUpArrowPress",40:"onDownArrowPress",46:"onBackspaceOrDeletePress",8:"onBackspaceOrDeletePress"},o=["autofocus","disabled","multiple","required"],n=["autofocus","class","disabled","id","multiple","name","placeholder","required"];let r;const a=["additionalClasses","additionalDropboxClasses","additionalDropboxContainerClasses","additionalToggleButtonClasses","aliasKey","allOptionsSelectedText","allowNewOption","alwaysShowSelectedOptionsCount","alwaysShowSelectedOptionsLabel","ariaLabelledby","ariaLabelText","ariaLabelClearButtonText","ariaLabelTagClearButtonText","ariaLabelSearchClearButtonText","autoSelectFirstOption","clearButtonText","descriptionKey","disableAllOptionsSelectedText","disableOptionGroupCheckbox","disableSelectAll","disableValidation","dropboxWidth","dropboxWrapper","emptyValue","enableSecureText","focusSelectedOptionOnOpen","hasOptionDescription","hideClearButton","hideValueTooltipOnSelectAll","keepAlwaysOpen","labelKey","markSearchResults","maxValues","maxWidth","minValues","moreText","noOfDisplayValues","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","selectAllOnlyVisible","selectAllText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let t="vscomp-wrapper",i="vscomp-toggle-button";const o=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),n=this.getTooltipAttrText(this.clearButtonText),r=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",a=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",l=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(t+=` ${this.additionalClasses}`),this.additionalToggleButtonClasses&&(i+=` ${this.additionalToggleButtonClasses}`),this.multiple&&(t+=" multiple",this.disableSelectAll||(t+=" has-select-all")),this.hideClearButton||(t+=" has-clear-button"),this.keepAlwaysOpen?(t+=" keep-always-open",p=!0):t+=" closed",this.showAsPopup&&(t+=" show-as-popup"),this.hasSearch&&(t+=" has-search-input"),this.showValueAsTags&&(t+=" show-value-as-tags"),this.textDirection&&(t+=` text-direction-${this.textDirection}`),this.popupPosition&&(t+=` popup-position-${this.popupPosition.toLowerCase()}`);const h=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:t})}\n
`;this.$ele.innerHTML=h,this.$body=document.querySelector("body"),this.$wrapper=this.$ele.querySelector(".vscomp-wrapper"),this.hasDropboxWrapper?(this.$allWrappers=[this.$wrapper,this.$dropboxWrapper],this.$dropboxContainer=this.$dropboxWrapper.querySelector(".vscomp-dropbox-container"),s.addClass(this.$dropboxContainer,"pop-comp-wrapper")):(this.$allWrappers=[this.$wrapper],this.$dropboxContainer=this.$wrapper.querySelector(".vscomp-dropbox-container")),this.$toggleButton=this.$ele.querySelector(".vscomp-toggle-button"),this.$clearButton=this.$ele.querySelector(".vscomp-clear-button"),this.$valueText=this.$ele.querySelector(".vscomp-value"),this.$hiddenInput=this.$ele.querySelector(".vscomp-hidden-input"),this.$dropbox=this.$dropboxContainer.querySelector(".vscomp-dropbox"),this.$dropboxCloseButton=this.$dropboxContainer.querySelector(".vscomp-dropbox-close-button"),this.$dropboxContainerBottom=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-bottom"),this.$dropboxContainerTop=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-top"),this.$search=this.$dropboxContainer.querySelector(".vscomp-search-wrapper"),this.$optionsContainer=this.$dropboxContainer.querySelector(".vscomp-options-container"),this.$optionsList=this.$dropboxContainer.querySelector(".vscomp-options-list"),this.$options=this.$dropboxContainer.querySelector(".vscomp-options"),this.$noOptions=this.$dropboxContainer.querySelector(".vscomp-no-options"),this.$noSearchResults=this.$dropboxContainer.querySelector(".vscomp-no-search-results"),this.afterRenderWrapper()}renderDropbox({wrapperClasses:e}){const t="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let i="vscomp-dropbox";this.additionalDropboxClasses&&(i+=` ${this.additionalDropboxClasses}`);let o="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(o+=` ${this.additionalDropboxContainerClasses}`);const n=`
\n \n
\n
\n\n
\n
\n\n
\n
\n
\n
\n\n
\n
${this.noOptionsText}
\n
${this.noSearchResultsText}
\n\n \n
\n \n
`;if(t){const i=document.createElement("div");return this.$dropboxWrapper=i,this.hasDropboxWrapper=!0,i.innerHTML=n,t.appendChild(i),s.addClass(i,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(i,"tabindex","-1"),s.setAria(i,"hidden",!0)),""}return this.hasDropboxWrapper=!1,n}renderOptions(){this.calculateAriaMetadata();let e="";const s=this.getVisibleOptions();let i="",o="";const n=!(!this.markSearchResults||!this.searchValue);let r;const{labelRenderer:a,disableOptionGroupCheckbox:l,uniqueId:p,searchGroup:h}=this,c="function"==typeof a,{convertToBoolean:u}=t;let d="";if(n&&(r=new RegExp(`(${t.regexEscape(this.searchValue)})(?!([^<]+)?>)`,"gi")),this.multiple&&(i=''),this.allowNewOption){const e=this.getTooltipAttrText("New Option");o=``}s.forEach(t=>{const{index:s}=t;let v,b="vscomp-option";const f=this.getTooltipAttrText("",!0,!0);let m=i,g="",O="",y="",x="",S="-1";const $=u(t.isSelected);let C="";if(t.classNames&&(b+=` ${t.classNames}`),t.isFocused&&(S="0",b+=" focused"),t.isDisabled&&(b+=" disabled",C='aria-disabled="true"'),t.isGroupTitle&&(d=t.label,b+=" group-title",l&&(m="")),$&&(b+=" selected"),t.isGroupOption){let e="";b+=" group-option",y=`data-group-index="${t.groupIndex}"`,t.customData?(d=void 0!==t.customData.group_name?`${t.customData.group_name}, `:"",e=void 0!==t.customData.description?` ${t.customData.description},`:"",x=`aria-label="${d} ${t.label}, ${e}"`):x=`aria-label="${d}, ${t.label}"`}v=c?a(t):t.label,t.description&&(O=`
${t.description}
`),t.isCurrentNew?(b+=" current-new",g+=o):!n||t.isGroupTitle&&!h||(v=v.replace(r,"$1"));let w="";this.ariaSetSize>0&&(w=`aria-setsize="${this.ariaSetSize}"`,t.filteredIndex&&(w+=` aria-posinset="${t.filteredIndex}"`)),e+=`
\n ${m}\n \n ${v}\n \n ${O}\n ${g}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",t="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${this.ariaLabelSearchClearButtonText}"`:"";t=`\n \n ×`}const s=`
\n ${e}\n ${t}\n
`;this.$search.innerHTML=s,this.$searchInput=this.$dropboxContainer.querySelector(".vscomp-search-input"),this.$searchClear=this.$dropboxContainer.querySelector(".vscomp-search-clear"),this.$toggleAllButton=this.$dropboxContainer.querySelector(".vscomp-toggle-all-button"),this.$toggleAllCheckbox=this.$dropboxContainer.querySelector(".vscomp-toggle-all-checkbox"),this.addEvent(this.$searchInput,"input","onSearch"),this.addEvent(this.$searchInput,"change","preventPropagation"),this.addEvent(this.$searchClear,"click keydown","onSearchClear"),this.addEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.addEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.addEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}addEvents(){this.addEvent(document,"click","onDocumentClick",!0),this.addEvent(this.$allWrappers,"keydown","onKeyDown"),this.addEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.addEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.addEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.addEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.addEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.addEvent(this.$options,"click","onOptionsClick"),this.addEvent(this.$options,"mouseover","onOptionsMouseOver"),this.addEvent(this.$options,"touchmove","onOptionsTouchMove"),l.observeDomChanges()}addEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`;let r=this.events[i];r||(r=this[o].bind(this),this.events[i]=r),s.addEvent(e,t,r,n)})}removeEvents(){this.removeEvent(document,"click","onDocumentClick",!0),this.removeEvent(this.$allWrappers,"keydown","onKeyDown"),this.removeEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.removeEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.removeEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.removeEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.removeEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.removeEvent(this.$options,"click","onOptionsClick"),this.removeEvent(this.$options,"mouseover","onOptionsMouseOver"),this.removeEvent(this.$options,"touchmove","onOptionsTouchMove"),this.$searchInput&&(this.removeEvent(this.$searchInput,"input","onSearch"),this.removeEvent(this.$searchInput,"change","preventPropagation"),this.$searchClear&&(this.removeEvent(this.$searchClear,"click","onSearchClear"),this.removeEvent(this.$searchClear,"keydown","onSearchClear"))),this.$toggleAllButton&&this.removeEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.$dropboxContainerBottom&&this.removeEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.$dropboxContainerTop&&this.removeEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}removeEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`,r=this.events[i];r&&s.removeEvent(e,t,r,n)})}onDocumentClick(e){const t=e.target.closest(".vscomp-wrapper");if(!t)return void l.openInstances.forEach(e=>{const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox()});const s=t.parentElement.virtualSelect;s&&s!==this&&this.isOpened()&&!this.keepAlwaysOpen&&(this.shouldFocusWrapperOnClose=!1,this.closeDropbox())}onKeyDown(e){const t=e.which||e.keyCode,s=i[t];if(document.activeElement!==this.$searchInput||e.shiftKey||9!==t||this.multiple||(e.preventDefault(),this.focusFirstVisibleOption()),document.activeElement!==this.$toggleAllButton||13!==t){if(27===t||"Escape"===e.key){const e=this.showAsPopup?this.$wrapper:this.$dropboxWrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}else this.toggleAllOptions()}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}onDownArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"next"}):this.openDropbox())}onUpArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"previous"}):this.openDropbox())}onBackspaceOrDeletePress(e){e.target===this.$wrapper&&(e.preventDefault(),this.selectedValues.length>0&&this.reset())}onToggleButtonPress(e){if("keydown"===e.type){if("Enter"!==e.code&&"Space"!==e.code)return;e.preventDefault()}const t=e.target;if(t.closest(".vscomp-value-tag-clear-button"))return e.stopPropagation(),void this.removeValue(t.closest(".vscomp-value-tag"));t.closest(".toggle-button-child")||this.toggleDropbox()}onClearButtonClick(e){"click"===e.type?this.reset():"keydown"!==e.type||"Enter"!==e.code&&"Space"!==e.code||(e.stopPropagation(),this.reset())}onOptionsScroll(){this.setVisibleOptions(!0)}onOptionsClick(e){const t=e.target.closest(".vscomp-option");t&&!s.hasClass(t,"disabled")&&(s.hasClass(t,"group-title")?this.onGroupTitleClick(t):this.selectOption(t,{event:e}))}onGroupTitleClick(e){if(!e||!this.multiple||this.disableOptionGroupCheckbox)return;const t=!s.hasClass(e,"selected");this.toggleGroupTitleCheckbox(e,t),this.toggleGroupOptions(e,t)}onDropboxContainerClick(e){e.target.closest(".vscomp-dropbox")||this.closeDropbox()}onDropboxCloseButtonClick(){this.closeDropbox()}onOptionsMouseOver(e){const t=e.target.closest(".vscomp-option");t&&this.isOpened()&&(s.hasClass(t,"disabled")||s.hasClass(t,"group-title")?this.removeOptionFocus():this.focusOption({$option:t}))}onOptionsTouchMove(){this.removeOptionFocus()}onSearch(e){e.stopPropagation(),this.setSearchValue(e.target.value,!0)}preventPropagation(e){e.stopPropagation()}onSearchClear(e){e.stopPropagation(),"Enter"!==e.code&&"Space"!==e.code&&"click"!==e.type||(this.setSearchValue(""),this.focusSearchInput())}onToggleAllOptions(){this.toggleAllOptions()}onDropboxContainerTopOrBottomFocus(){this.closeDropbox()}onResize(){this.setOptionsContainerHeight(!0)}static observeDomChanges(){l.domObserver||(l.domObserver=new MutationObserver(e=>{e.forEach(e=>{e.removedNodes.forEach(e=>{if(e.nodeType!==Node.ELEMENT_NODE)return;const t=e.classList.contains("vscomp-ele")?[e]:[];e.querySelectorAll(".vscomp-ele").forEach(e=>t.push(e)),t.forEach(e=>{!e.isConnected&&e.virtualSelect&&e.virtualSelect.destroy()})})})}),l.domObserver.observe(document.documentElement,{childList:!0,subtree:!0}))}beforeValueSet(e){this.toggleAllOptionsClass(!e&&void 0)}beforeSelectNewValue(e){const t=this.getNewOption();if(t){const e=t.index;this.newValues.push(t.value),this.setOptionProp(e,"isCurrentNew",!1),this.setOptionProp(e,"isNew",!0)}else e&&(this.setNewOption(e),this.toggleSelectedProp(this.lastOptionIndex,!0));setTimeout(()=>{this.setSearchValue(""),this.focusSearchInput()},0)}afterRenderWrapper(){s.addClass(this.$ele,"vscomp-ele"),this.renderSearch(),this.setEleStyles(),this.setDropboxStyles(),this.setVisibleOptionsCount(),this.setOptionsContainerHeight(),this.addEvents(),this.setEleProps(),this.keepAlwaysOpen||this.showAsPopup||this.initDropboxPopover(),this.initialSelectedValue?this.setValueMethod(this.initialSelectedValue,this.silentInitialValueSet):this.autoSelectFirstOption&&this.visibleOptions.length&&this.setValueMethod(this.visibleOptions[0].value,this.silentInitialValueSet),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),this.initialDisabled&&this.disable(),this.autofocus&&this.focus()}afterRenderOptions(){const e=this.getVisibleOptions(),t=!this.options.length&&!this.hasServerSearch,i=!t&&!e.length;(!this.allowNewOption||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(s.toggleClass(this.$allWrappers,"has-no-search-results",i),i?(s.setAttr(this.$noSearchResults,"tabindex","0"),s.setAttr(this.$noSearchResults,"aria-hidden","false")):(s.setAttr(this.$noSearchResults,"tabindex","-1"),s.setAttr(this.$noSearchResults,"aria-hidden","true"))),s.toggleClass(this.$allWrappers,"has-no-options",t),t?(s.setAttr(this.$noOptions,"tabindex","0"),s.setAttr(this.$noOptions,"aria-hidden","false")):(s.setAttr(this.$noOptions,"tabindex","-1"),s.setAttr(this.$noOptions,"aria-hidden","true")),this.setOptionAttr(),this.setOptionsPosition(),this.setOptionsTooltip(),document.activeElement!==this.$searchInput&&setTimeout(()=>{const e=s.getElementsBySelector(".focused",this.$dropboxContainer)[0];void 0!==e&&e.focus({preventScroll:!0})},20)}afterSetOptionsContainerHeight(e){e&&this.showAsPopup&&this.setVisibleOptions()}afterSetSearchValue(){this.hasServerSearch?(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=setTimeout(()=>{this.serverSearch()},this.searchDelay)):this.setVisibleOptionsCount(),this.selectAllOnlyVisible&&this.toggleAllOptionsClass(),this.focusOption({focusFirst:!0})}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),e||this.reset()}setProps(e){const s=this.setDefaultProps(e);this.setPropsFromElementAttr(s);const{convertToBoolean:i}=t;this.$ele=s.ele,this.dropboxWrapper=s.dropboxWrapper,this.valueKey=s.valueKey,this.labelKey=s.labelKey,this.descriptionKey=s.descriptionKey,this.aliasKey=s.aliasKey,this.optionHeightText=s.optionHeight,this.optionHeight=parseFloat(this.optionHeightText),this.multiple=i(s.multiple),this.hasSearch=i(s.search),this.searchByStartsWith=i(s.searchByStartsWith),this.searchGroup=i(s.searchGroup),this.hideClearButton=i(s.hideClearButton),this.autoSelectFirstOption=i(s.autoSelectFirstOption),this.hasOptionDescription=i(s.hasOptionDescription),this.silentInitialValueSet=i(s.silentInitialValueSet),this.allowNewOption=i(s.allowNewOption),this.markSearchResults=i(s.markSearchResults),this.showSelectedOptionsFirst=i(s.showSelectedOptionsFirst),this.disableSelectAll=i(s.disableSelectAll),this.keepAlwaysOpen=i(s.keepAlwaysOpen),this.showDropboxAsPopup=i(s.showDropboxAsPopup),this.hideValueTooltipOnSelectAll=i(s.hideValueTooltipOnSelectAll),this.showOptionsOnlyOnSearch=i(s.showOptionsOnlyOnSearch),this.selectAllOnlyVisible=i(s.selectAllOnlyVisible),this.alwaysShowSelectedOptionsCount=i(s.alwaysShowSelectedOptionsCount),this.alwaysShowSelectedOptionsLabel=i(s.alwaysShowSelectedOptionsLabel),this.disableAllOptionsSelectedText=i(s.disableAllOptionsSelectedText),this.showValueAsTags=i(s.showValueAsTags),this.disableOptionGroupCheckbox=i(s.disableOptionGroupCheckbox),this.enableSecureText=i(s.enableSecureText),this.setValueAsArray=i(s.setValueAsArray),this.disableValidation=i(s.disableValidation),this.initialDisabled=i(s.disabled),this.required=i(s.required),this.autofocus=i(s.autofocus),this.useGroupValue=i(s.useGroupValue),this.focusSelectedOptionOnOpen=i(s.focusSelectedOptionOnOpen),this.noOptionsText=s.noOptionsText,this.noSearchResultsText=s.noSearchResultsText,this.selectAllText=s.selectAllText,this.searchNormalize=s.searchNormalize,this.searchPlaceholderText=s.searchPlaceholderText,this.searchFormLabel=s.searchFormLabel,this.optionsSelectedText=s.optionsSelectedText,this.optionSelectedText=s.optionSelectedText,this.allOptionsSelectedText=s.allOptionsSelectedText,this.clearButtonText=s.clearButtonText,this.moreText=s.moreText,this.placeholder=s.placeholder,this.position=s.position,this.textDirection=s.textDirection,this.dropboxWidth=s.dropboxWidth,this.tooltipFontSize=s.tooltipFontSize,this.tooltipAlignment=s.tooltipAlignment,this.tooltipMaxWidth=s.tooltipMaxWidth,this.updatePositionThrottle=s.updatePositionThrottle,this.noOfDisplayValues=parseInt(s.noOfDisplayValues),this.zIndex=parseInt(s.zIndex),this.maxValues=parseInt(s.maxValues),this.minValues=parseInt(s.minValues),this.name=this.secureText(s.name),this.additionalClasses=s.additionalClasses,this.additionalDropboxClasses=s.additionalDropboxClasses,this.additionalDropboxContainerClasses=s.additionalDropboxContainerClasses,this.additionalToggleButtonClasses=s.additionalToggleButtonClasses,this.popupDropboxBreakpoint=s.popupDropboxBreakpoint,this.popupPosition=s.popupPosition,this.onServerSearch=s.onServerSearch,this.labelRenderer=s.labelRenderer,this.selectedLabelRenderer=s.selectedLabelRenderer,this.initialSelectedValue=0===s.selectedValue?"0":s.selectedValue,this.emptyValue=s.emptyValue,this.ariaLabelText=s.ariaLabelText,this.ariaLabelledby=s.ariaLabelledby,this.ariaLabelClearButtonText=s.ariaLabelClearButtonText,this.ariaLabelTagClearButtonText=s.ariaLabelTagClearButtonText,this.ariaLabelSearchClearButtonText=s.ariaLabelSearchClearButtonText,this.maxWidth=s.maxWidth,this.searchDelay=s.searchDelay,this.showDuration=parseInt(s.showDuration),this.hideDuration=parseInt(s.hideDuration),this.selectedValues=[],this.selectedOptions=[],this.newValues=[],this.events={},this.tooltipEnterDelay=200,this.searchValue="",this.searchValueOriginal="",this.isAllSelected=!1,(void 0===s.search&&this.multiple||this.allowNewOption||this.showOptionsOnlyOnSearch)&&(this.hasSearch=!0),this.hasServerSearch="function"==typeof this.onServerSearch,(this.maxValues||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(this.disableSelectAll=!0,this.disableOptionGroupCheckbox=!0),this.keepAlwaysOpen&&(this.dropboxWrapper="self"),this.showAsPopup=this.showDropboxAsPopup&&!this.keepAlwaysOpen&&window.innerWidth<=parseFloat(this.popupDropboxBreakpoint),this.hasSearchContainer=this.hasSearch||this.multiple&&!this.disableSelectAll,this.optionsCount=this.getOptionsCount(s.optionsCount),this.halfOptionsCount=Math.ceil(this.optionsCount/2),this.optionsHeight=this.getOptionsHeight(),this.uniqueId=this.getUniqueId(),this.shouldFocusWrapperOnClose=!0,this.ariaSetSize=0}setDefaultProps(e){const t={dropboxWrapper:"self",valueKey:"value",labelKey:"label",descriptionKey:"description",aliasKey:"alias",ariaLabelText:"Options list",ariaLabelClearButtonText:"Clear button",ariaLabelTagClearButtonText:"Remove option",ariaLabelSearchClearButtonText:"Clear search input",optionsCount:5,noOfDisplayValues:50,optionHeight:"40px",noOptionsText:"No options found",noSearchResultsText:"No results found",selectAllText:"Select All",searchNormalize:!1,searchPlaceholderText:"Search...",searchFormLabel:"Search",clearButtonText:"Clear",moreText:"more...",optionsSelectedText:"options selected",optionSelectedText:"option selected",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:e.keepAlwaysOpen?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return e.hasOptionDescription&&(t.optionsCount=4,t.optionHeight="50px"),Object.assign(t,e)}setPropsFromElementAttr(e){const t=e.ele;Object.keys(r).forEach(s=>{let i=t.getAttribute(s);-1===o.indexOf(s)||""!==i&&"true"!==i||(i=!0),i&&(e[r[s]]=i)})}setEleProps(){const{$ele:e}=this;e.virtualSelect=this,e.value=this.multiple?[]:"",e.name=this.name,e.disabled=!1,e.required=this.required,e.autofocus=this.autofocus,e.multiple=this.multiple,e.form=e.closest("form"),e.reset=l.reset,e.setValue=l.setValueMethod,e.setOptions=l.setOptionsMethod,e.setDisabledOptions=l.setDisabledOptionsMethod,e.setEnabledOptions=l.setEnabledOptionsMethod,e.toggleSelectAll=l.toggleSelectAll,e.isAllSelected=l.isAllSelected,e.addOption=l.addOptionMethod,e.getNewValue=l.getNewValueMethod,e.getDisplayValue=l.getDisplayValueMethod,e.getSelectedOptions=l.getSelectedOptionsMethod,e.getDisabledOptions=l.getDisabledOptionsMethod,e.open=l.openMethod,e.close=l.closeMethod,e.focus=l.focusMethod,e.enable=l.enableMethod,e.disable=l.disableMethod,e.destroy=l.destroyMethod,e.validate=l.validateMethod,e.toggleRequired=l.toggleRequiredMethod,this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=this)}setValueMethod(e,s){const i={},o={};let n=[];const r=this.multiple;let a=t.normalizeValues(e);if(a){if(Array.isArray(a)||(a=[a]),r){const{maxValues:e}=this;e&&a.length>e&&a.splice(e)}else a.length>1&&(a=[a[0]]);this.useGroupValue&&(a=this.setGroupOptionsValue(a)),a.forEach((e,t)=>{i[e]=!0,o[e]=t}),this.allowNewOption&&a&&this.setNewOptionsFromValue(a)}this.options.forEach(e=>{const s=t.normalizeValues(e.value);!0!==i[s]||e.isDisabled||e.isGroupTitle?e.isSelected=!1:(e.isSelected=!0,n.push(e.value))}),r?(this.hasOptionGroup&&this.setGroupsSelectedProp(),n.sort((e,s)=>o[t.normalizeValues(e)]-o[t.normalizeValues(s)])):[n]=n,this.beforeValueSet(),this.setValue(n,{disableEvent:s}),this.afterValueSet()}setGroupOptionsValue(e){const t=[],s={},i={};return e.forEach(e=>{i[e]=!0}),this.options.forEach(e=>{const{value:o}=e,n=!0===i[o];e.isGroupTitle?n&&(s[e.index]=!0):(n||s[e.groupIndex])&&t.push(o)}),t}setGroupsSelectedProp(){const e=this.isAllGroupOptionsSelected.bind(this);this.options.forEach(t=>{t.isGroupTitle&&(t.isSelected=e(t.index))})}setOptionsMethod(e,t){this.setOptions(e),this.afterSetOptions(t)}setDisabledOptionsMethod(e,t=!1){this.setDisabledOptions(e,!0),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setDisabledOptions(e,t=!1){let s=[];if(e)if(!0===e)t&&this.options.forEach(e=>(e.isDisabled=!0,s.push(e.value),e));else{s=e.map(e=>e.toString());const i={};s.forEach(e=>{i[e]=!0}),t&&this.options.forEach(e=>(e.isDisabled=!0===i[e.value],e))}else t&&this.options.forEach(e=>(e.isDisabled=!1,e));this.disabledOptions=s}setEnabledOptionsMethod(e,t=!1){this.setEnabledOptions(e),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setEnabledOptions(e){if(void 0===e)return;const t=[];if(!0===e)this.options.forEach(e=>(e.isDisabled=!1,e));else{const s={};e.forEach(e=>{s[e]=!0}),this.options.forEach(e=>{const i=!0!==s[e.value];return e.isDisabled=i,i&&t.push(e.value),e})}this.disabledOptions=t}setOptions(e=[]){const s=[],i=this.disabledOptions.length,{valueKey:o,labelKey:n,descriptionKey:r,aliasKey:a,hasOptionDescription:l}=this,{getString:p,convertToBoolean:h}=t,c=this.secureText.bind(this),u=this.getAlias.bind(this);let d=0,v=!1;const b={};let f=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const m=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const g=c(p(e[o])),O=c(p(e[n])),y=e.options,x=!!y,S={index:d,value:g,valueNormalized:g.toLowerCase(),label:O,labelNormalized:this.searchNormalize&&""!==O.trim()?t.normalizeString(O).toLowerCase():O.toLowerCase(),alias:u(e[a]),isVisible:h(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:x,classNames:e.classNames};if(f||""!==g||(f=!0),i&&(S.isDisabled=!0===b[g]),e.isGroupOption&&(S.isGroupOption=!0,S.groupIndex=e.groupIndex),l){const s=c(p(e[r]));S.description=s,S.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(S.customData=e.customData),s.push(S),d+=1,x){const e=S.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,m(t)})}};Array.isArray(e)&&e.forEach(m);const g=s.length,{$ele:O}=this;O.options=s,O.length=g,this.options=s,this.visibleOptionsCount=g,this.lastOptionIndex=g-1,this.newValues=[],this.hasOptionGroup=v,this.hasEmptyValueOption=f,this.setSortedOptions()}setServerOptions(e=[]){this.setOptionsMethod(e,!0);const{selectedOptions:t}=this,i=this.options;let o=!1;if(t.length){const e={};o=!0,i.forEach(t=>{e[t.value]=!0}),t.forEach(t=>{!0!==e[t.value]&&(t.isVisible=!1,i.push(t))}),this.setOptionsMethod(i,!0)}this.allowNewOption&&this.searchValue&&(i.some(e=>e.label.toLowerCase()===this.searchValue)||(o=!0,this.setNewOption())),o?(this.setVisibleOptionsCount(),this.multiple&&this.toggleAllOptionsClass(),this.setValueText()):this.updatePosition(),this.setVisibleOptionsCount(),s.removeClass(this.$allWrappers,"server-searching")}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){let e=[...this.options];this.showSelectedOptionsFirst&&this.selectedValues.length&&(e=this.hasOptionGroup?this.sortOptionsGroup(e):this.sortOptions(e)),this.sortedOptions=e}setVisibleOptions(){let e=[...this.sortedOptions];const t=2*this.optionsCount,s=this.getVisibleStartIndex(),i=this.getNewOption(),o=s+t-1;let n=0;i&&(i.visibleIndex=n,n+=1),e=e.filter(e=>{let t=!1;return e.isVisible&&!e.isCurrentNew&&(t=n>=s&&n<=o,e.visibleIndex=n,n+=1),t}),i&&(e=[i,...e]),this.visibleOptions=e,this.visibleOptionsCount=e.length,this.renderOptions()}setOptionsPosition(e){const t=parseInt((e||this.getVisibleStartIndex())*this.optionHeight);this.$options.style.transform=`translate3d(0, ${t}px, 0)`,s.setData(this.$options,"top",t)}setOptionsTooltip(){const e=this.getVisibleOptions(),{hasOptionDescription:t}=this;e.forEach(e=>{const i=this.$dropboxContainer.querySelector(`.vscomp-option[data-index="${e.index}"]`);s.setData(i.querySelector(".vscomp-option-text"),"tooltip",e.label),t&&s.setData(i.querySelector(".vscomp-option-description"),"tooltip",e.description)})}setValue(e,{disableEvent:i=!1,disableValidation:o=!1}={}){const n=t.normalizeValues(e);this.hasEmptyValueOption&&""===n||n?Array.isArray(n)?this.selectedValues=[...n]:this.selectedValues=[n]:this.selectedValues=[];const r=this.getValue();this.$ele.value=r,this.$hiddenInput.value=this.getInputValue(r),this.isMaxValuesSelected=!!(this.maxValues&&this.maxValues<=this.selectedValues.length),this.toggleAllOptionsClass(),this.setValueText();const a=t.isNotEmpty(this.selectedValues);s.toggleClass(this.$allWrappers,"has-value",a),s.toggleClass(this.$allWrappers,"max-value-selected",this.isMaxValuesSelected),s.setAttr(this.$clearButton,"tabindex",a?"0":"-1"),s.setAria(this.$clearButton,"hidden",!1===a),o||this.validate(),i||s.dispatchEvent(this.$ele,"change",!0)}setValueText(){const{multiple:e,selectedValues:i,noOfDisplayValues:o,showValueAsTags:n,$valueText:r,selectedLabelRenderer:a}=this,l=[];let p=[];const h=i.length;let c=0;const u=this.isAllSelected&&!this.hasServerSearch&&!this.disableAllOptionsSelectedText&&!n;if(u&&this.hideValueTooltipOnSelectAll)r.innerHTML=`${this.allOptionsSelectedText} (${h})`;else{this.getSelectedOptions({fullDetails:!0,keepSelectionOrder:!0}).some(e=>{if(e.isCurrentNew)return!1;if(c>=o)return!0;let{label:s}=e;if("function"==typeof a&&(s=a(e)),l.push(s),c+=1,n){const i=t.willTextOverflow(r.parentElement,s)?this.getTooltipAttrText(s,!1,!0):"";let o="";this.ariaLabelTagClearButtonText&&(o=`aria-label="${s.replace(/<[^>]+>/gi,"").trim()}, ${this.ariaLabelTagClearButtonText}"`);const n=`\n ${s}\n \n \n \n `;p.push(n)}else p.push(s);return!1});const i=h-o;i>0&&p.push(`+ ${i} ${this.moreText}`);const d=l.join(", ");if(""===d)r.innerHTML=this.placeholder;else if(r.innerHTML=d,e){const{maxValues:e}=this;if(this.alwaysShowSelectedOptionsCount||s.hasEllipsis(r)||e||n){let t=`${h}`;if(e&&(t+=` / ${e}`),u)r.innerHTML=`${this.allOptionsSelectedText} (${h})`;else if(n)r.innerHTML=p.join(""),this.$valueTags=r.querySelectorAll(".vscomp-value-tag"),this.setValueTagAttr();else if(!this.alwaysShowSelectedOptionsLabel){const e=1===h?this.optionSelectedText:this.optionsSelectedText;r.innerHTML=`${t} ${e}`}}else p=[]}}let d="";0===h?d=this.placeholder:n||(d=p.join(", ")),n||s.setData(r,"tooltip",d),e&&(n?this.updatePosition():s.setData(r,"tooltipEllipsisOnly",0===h))}setSearchValue(e,t=!1,i=!1){if(e===this.searchValueOriginal&&!i)return;t||(this.$searchInput.value=e);const o=e.replace(/\\/g,"").toLowerCase().trim();this.searchValue=o,this.searchValueOriginal=e,s.toggleClass(this.$allWrappers,"has-search-value",e),s.setAttr(this.$searchClear,"tabindex",""!==e?"0":"-1"),s.setAria(this.$searchClear,"hidden",""===e),this.afterSetSearchValue()}setVisibleOptionsCount(){let e,s=0,i=!1;const{searchGroup:o,showOptionsOnlyOnSearch:n,searchByStartsWith:r}=this;let{searchValue:a}=this;a=this.searchNormalize&&""!==a.trim()?t.normalizeString(a):a;const l=this.isOptionVisible.bind(this);this.hasOptionGroup&&(e=this.getVisibleOptionGroupsMapping(a)),this.options.forEach(t=>{if(t.isCurrentNew)return;let p;n&&!a?(t.isVisible=!1,p={isVisible:!1,hasExactOption:!1}):p=l({data:t,searchValue:a,hasExactOption:i,visibleOptionGroupsMapping:e,searchGroup:o,searchByStartsWith:r}),p.isVisible&&(s+=1),i||(i=p.hasExactOption)}),this.allowNewOption&&(a&&!i?(this.setNewOption(),s+=1):this.removeNewOption()),this.visibleOptionsCount=s,this.afterSetVisibleOptionsCount()}calculateAriaMetadata(){let e=0,t=0;if((this.sortedOptions&&this.sortedOptions.length?this.sortedOptions:this.options).forEach(s=>{if(s.isCurrentNew)s.filteredIndex=void 0;else if(!0===s.isVisible){const i=s.isGroupTitle&&this.multiple&&!this.disableOptionGroupCheckbox;!s.isGroupTitle||i?(t+=1,e+=1,s.filteredIndex=t):s.filteredIndex=void 0}else s.filteredIndex=void 0}),this.allowNewOption){const s=this.getNewOption();s&&!0===s.isVisible?(t+=1,e+=1,s.filteredIndex=t):s&&(s.filteredIndex=void 0)}this.ariaSetSize=e}setOptionProp(e,t,s){this.options[e]&&(this.options[e][t]=s)}setOptionsHeight(){this.$optionsList.style.height=this.optionHeight*this.visibleOptionsCount+"px"}setOptionsContainerHeight(e){let t;e?this.showAsPopup&&(this.optionsCount=this.getOptionsCount(),this.halfOptionsCount=Math.ceil(this.optionsCount/2),t=this.getOptionsHeight(),this.optionsHeight=t):(t=this.optionsHeight,this.keepAlwaysOpen&&(s.setStyle(this.$noOptions,"height",t),s.setStyle(this.$noSearchResults,"height",t))),s.setStyle(this.$optionsContainer,"max-height",t),this.afterSetOptionsContainerHeight(e)}setNewOption(e){const t=e||this.searchValueOriginal.trim();if(!t)return;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",this.secureText(t)),this.setOptionProp(e,"label",this.secureText(t))}else{const s={value:t,label:t};e?(s.isNew=!0,this.newValues.push(t)):s.isCurrentNew=!0,this.addOption(s)}}setSelectedProp(){const e={};this.selectedValues.forEach(t=>{e[t]=!0}),this.options.forEach(t=>{!0===e[t.value]&&(t.isSelected=!0)})}setNewOptionsFromValue(e){if(!e)return;const t=this.setNewOption.bind(this),s={};this.options.forEach(e=>{s[e.value]=!0}),e.forEach(e=>{e&&!0!==s[e]&&t(e)})}setDropboxWrapperWidth(){if(this.showAsPopup)return;const e=this.dropboxWidth||`${this.$wrapper.offsetWidth}px`;s.setStyle(this.$dropboxContainer,"max-width",e)}setEleStyles(){const{maxWidth:e}=this,t={};e&&(t["max-width"]=e),s.setStyles(this.$ele,t)}setDropboxStyles(){const{dropboxWidth:e}=this,t={},i={"z-index":this.zIndex};e&&(this.showAsPopup?t["max-width"]=e:i.width=e),s.setStyles(this.$dropboxContainer,i),s.setStyles(this.$dropbox,t)}setOptionAttr(){const{$visibleOptions:e}=this,{options:t}=this,i=`${this.optionHeight}px`,{setStyle:o,getData:n,setData:r}=s;e&&e.length&&e.forEach(e=>{const s=t[n(e,"index")];o(e,"height",i),r(e,"value",s.value)})}setValueTagAttr(){const{$valueTags:e}=this;if(!e||!e.length)return;const{getData:t,setData:i}=s,{options:o}=this;e.forEach(e=>{const s=t(e,"index");if(void 0!==s){const t=o[s];i(e,"value",t.value)}})}setScrollTop(){const{selectedValues:e}=this;if(this.showSelectedOptionsFirst||!this.focusSelectedOptionOnOpen||0===e.length)return;const t={};let s;e.forEach(e=>{t[e]=!0}),this.options.some(e=>!!t[e.value]&&(s=e.visibleIndex,!0)),s&&(this.$optionsContainer.scrollTop=this.optionHeight*s)}getVisibleOptions(){return this.visibleOptions||[]}getValue(){let e;return e=this.multiple?this.useGroupValue?this.getGroupValue():this.selectedValues:this.selectedValues[0]||"",t.normalizeValues(e)}getGroupValue(){const e=[],t={};return this.options.forEach(s=>{if(!s.isSelected)return;const{value:i}=s;s.isGroupTitle?i&&(t[s.index]=!0,e.push(i)):!0!==t[s.groupIndex]&&e.push(i)}),e}getInputValue(e){let t=e;return t&&t.length?this.setValueAsArray&&this.multiple&&(t=JSON.stringify(t)):t=this.emptyValue,t}getFirstVisibleOptionIndex(){return Math.ceil(this.$optionsContainer.scrollTop/this.optionHeight)}getVisibleStartIndex(){let e=this.getFirstVisibleOptionIndex()-this.halfOptionsCount;return e<0&&(e=0),e}getTooltipAttrText(e,i=!1,o=!1){const n={"data-tooltip":(t.containsHTML(e)?t.replaceDoubleQuotesWithHTML(e):e)||"","data-tooltip-enter-delay":this.tooltipEnterDelay,"data-tooltip-z-index":this.zIndex,"data-tooltip-font-size":this.tooltipFontSize,"data-tooltip-alignment":this.tooltipAlignment,"data-tooltip-max-width":this.tooltipMaxWidth,"data-tooltip-ellipsis-only":i,"data-tooltip-allow-html":o};return s.getAttributesText(n)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=i(s(e.value)),n=i(s(e.label)),r=i(s(e.description));return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:n,labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:r,descriptionNormalized:this.searchNormalize&&""!==r.trim()?t.normalizeString(r).toLowerCase():r.toLowerCase(),alias:this.getAlias(e.alias),isCurrentNew:e.isCurrentNew||!1,isNew:e.isNew||!1,isVisible:!0}}getNewOption(){const e=this.options[this.lastOptionIndex];if(e&&e.isCurrentNew)return e}getOptionIndex(e){let t;return this.options.some(s=>s.value===e&&(t=s.index,!0)),t}getNewValue(){const e={};this.newValues.forEach(t=>{e[t]=!0});const t=this.selectedValues.filter(t=>!0===e[t]);return this.multiple?t:t[0]}getAlias(e){let t=e;return t&&(t=Array.isArray(t)?t.join(","):t.toString().trim(),t=t.toLowerCase()),t||""}getDisplayValue(){const e=[];return this.options.forEach(t=>{t.isSelected&&e.push(t.label)}),this.multiple?e:e[0]||""}getSelectedOptions({fullDetails:e=!1,keepSelectionOrder:t=!1}={}){const{valueKey:s,labelKey:i,selectedValues:o}=this,n=[];if(this.options.forEach(t=>{if(t.isSelected&&!t.isGroupTitle)if(e)n.push(t);else{const e={[s]:t.value,[i]:t.label};t.isNew&&(e.isNew=!0),t.customData&&(e.customData=t.customData),n.push(e)}}),t){const e={};o.forEach((t,s)=>{e[t]=s}),n.sort((t,s)=>e[t.value]-e[s.value])}return this.multiple||e?n:n[0]}getDisabledOptions(){const{valueKey:e,labelKey:t,disabledOptions:s}=this,i={},o=[];return s.forEach(e=>{i[e]=!0}),this.options.forEach(({value:s,label:n})=>{i[s]&&o.push({[e]:s,[t]:n})}),o}getVisibleOptionGroupsMapping(e){let{options:t}=this;const s={},i=this.isOptionVisible.bind(this);return t=this.structureOptionGroup(t),t.forEach(t=>{s[t.index]=t.options.some(t=>i({data:t,searchValue:e}).isVisible)}),s}getOptionsCount(e){let t;if(this.showAsPopup){let e=80*window.innerHeight/100-48;this.hasSearchContainer&&(e-=40),t=Math.floor(e/this.optionHeight)}else t=parseInt(e);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}getSibling(e,t){const i="next"===t?"nextElementSibling":"previousElementSibling";let o=e;do{o&&(o=o[i])}while(s.hasClass(o,"disabled")||s.hasClass(o,"group-title"));return o}getUniqueId(){const e=t.getRandomInt(1e4);return document.querySelector(`#vscomp-ele-wrapper-${e}`)?this.getUniqueId():e}initDropboxPopover(){const e={ele:this.$ele,target:this.$dropboxContainer,position:this.position,zIndex:this.zIndex,margin:4,transitionDistance:30,hideArrowIcon:!0,disableManualAction:!0,disableUpdatePosition:!this.hasDropboxWrapper,updatePositionThrottle:this.updatePositionThrottle,showDuration:this.showDuration,hideDuration:this.hideDuration,afterShow:this.afterShowPopper.bind(this),afterHide:this.afterHidePopper.bind(this)};this.dropboxPopover=new PopoverComponent(e)}openDropbox(e){l.lastInteractedInstance=this;let t="";e||(t=this.$dropboxContainer.style.transition,this.$dropboxContainer.style.transition="none"),this.isSilentOpen=e,l.openInstances.forEach(e=>{if(e!==this){const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox(!0)}}),l.openInstances.add(this),s.setAttr(this.$dropboxWrapper,"tabindex","0"),s.setAria(this.$dropboxWrapper,"hidden",!1),s.setAttr(this.$dropboxContainerTop,"tabindex","0"),s.setAria(this.$dropboxContainerTop,"hidden",!1),s.setAttr(this.$dropboxContainerBottom,"tabindex","0"),s.setAria(this.$dropboxContainerBottom,"hidden",!1),e?s.setStyle(this.$dropboxContainer,"display","inline-flex"):(s.dispatchEvent(this.$ele,"beforeOpen"),s.setAria(this.$wrapper,"expanded",!0)),this.setDropboxWrapperWidth(),s.removeClass(this.$allWrappers,"closed"),s.changeTabIndex(this.$allWrappers,0),e||(this.$dropboxContainer.offsetHeight,this.$dropboxContainer.style.transition=t),this.dropboxPopover&&!e?this.dropboxPopover.show():this.afterShowPopper()}afterShowPopper(){const e=this.isSilentOpen;this.isSilentOpen=!1,e||(this.moveSelectedOptionsFirst(),this.setScrollTop(),s.addClass(this.$allWrappers,"focused"),this.showAsPopup?(s.addClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!0):this.focusElementOnOpen(),s.dispatchEvent(this.$ele,"afterOpen"))}closeDropbox(e){if(this.isSilentClose=e,l.openInstances.delete(this),!1===this.isOpened())return;if(this.keepAlwaysOpen)return void this.removeOptionFocus();const t=document.activeElement,i=t&&this.$wrapper.contains(t)||this.hasDropboxWrapper&&t&&this.$dropboxWrapper.contains(t);this.shouldFocusWrapperOnClose&&l.lastInteractedInstance===this&&!e&&(null===t||t===document.body||i)&&this.$wrapper.focus(),e?s.setStyle(this.$dropboxContainer,"display",""):(s.dispatchEvent(this.$ele,"beforeClose"),s.setAria(this.$wrapper,"expanded",!1),s.setAria(this.$wrapper,"activedescendant",""),s.setAria(this.$dropboxContainer,"activedescendant","")),this.dropboxPopover&&!e?(this.dropboxPopover.hide(),s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)):this.afterHidePopper(),this.setSearchValue("")}afterHidePopper(){const e=this.isSilentClose;this.isSilentClose=!1,s.removeClass(this.$allWrappers,"focused"),this.removeOptionFocus(),!e&&this.isPopupActive&&(s.removeClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!1),s.addClass(this.$allWrappers,"closed"),e||s.dispatchEvent(this.$ele,"afterClose"),this.shouldFocusWrapperOnClose=!0,s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)}moveSelectedOptionsFirst(){this.$optionsContainer.scrollTop&&this.selectedValues.length||this.setVisibleOptions(),this.showSelectedOptionsFirst&&(this.setSortedOptions(),this.scrollToTop(),this.setVisibleOptions())}toggleDropbox(){l.lastInteractedInstance=this,this.isOpened()?this.closeDropbox():this.openDropbox()}updatePosition(){this.dropboxPopover&&this.isOpened()&&this.$ele.updatePosition()}isOpened(){return!s.hasClass(this.$wrapper,"closed")}focusSearchInput(){const e=this.$searchInput;e&&e.focus()}focusElementOnOpen(){const e=this.$searchInput,t=!this.options.length&&!this.hasServerSearch;if(e)t&&!this.allowNewOption?(s.setAttr(e,"disabled",""),this.$noOptions.focus()):(e.removeAttribute("disabled"),e.focus());else{const e=this.$dropbox.querySelector('[tabindex="0"]');void 0!==s.getData(e,"index")?this.focusOption({direction:"next"}):e?e.focus():this.focusFirstVisibleOption()}}focusFirstVisibleOption(){let e=this.$optionsContainer.querySelector(`[data-index='${this.getFirstVisibleOptionIndex()}']`);e?(s.hasClass(e,"group-title")&&(e=this.getSibling(e,"next")),s.setAttr(e,"tabindex","0"),this.$optionsContainer.scrollTop=this.optionHeight*this.getFirstVisibleOptionIndex(),this.focusOption({focusFirst:!0}),e.focus()):(e=this.$dropbox.querySelector('[tabindex="0"]'),e&&e.focus())}focusOption({direction:e,$option:t,focusFirst:i}={}){const o=this.$dropboxContainer.querySelector(".vscomp-option.focused");let n;if(t)n=t;else if(!o||i){const e=this.getFirstVisibleOptionIndex();n=this.$dropboxContainer.querySelector(`.vscomp-option[data-visible-index="${e}"]`),(s.hasClass(n,"disabled")||s.hasClass(n,"group-title"))&&(n=this.getSibling(n,"next"))}else n=this.getSibling(o,e);n&&n!==o&&(o&&this.toggleOptionFocusedState(o,!1),this.toggleOptionFocusedState(n,!0),this.toggleFocusedProp(s.getData(n,"index"),!0),this.moveFocusedOptionToView(n))}moveFocusedOptionToView(e){const t=e||this.$dropboxContainer.querySelector(".vscomp-option.focused");if(!t)return;let i;const o=this.$optionsContainer.getBoundingClientRect(),n=t.getBoundingClientRect(),r=o.top,a=o.bottom,l=o.height,p=n.top,h=n.bottom,c=n.height,u=t.offsetTop,d=s.getData(this.$options,"top","number");r>p?i=u+d:a{if(e.isDisabled||e.isGroupTitle||!e.isVisible||e.isSelected)return;const{index:t}=e;if(t>o&&t{e(parseInt(t))})}setTimeout(()=>{this.renderOptions()},0)}toggleAllOptions(e){if(!this.multiple||this.disableSelectAll)return;const t="boolean"==typeof isSelected?e:!s.hasClass(this.$toggleAllCheckbox,"checked"),i=[],{selectAllOnlyVisible:o}=this;this.options.forEach(e=>{const s=e;if(s.isDisabled||s.isCurrentNew)return;const{isVisible:n,isSelected:r}=s;!t&&(!o||n||!r)||t&&o&&!n&&!r?s.isSelected=!1:(s.isSelected=!0,s.isGroupTitle||i.push(s.value))}),this.toggleAllOptionsClass(t),this.setValue(i),this.renderOptions()}toggleAllOptionsClass(e){if(!this.multiple)return;let t=!1;"boolean"==typeof e||(e=this.isAllOptionsSelected()),!e&&this.selectAllOnlyVisible&&""!==this.searchValue&&(this.visibleOptionsCount>0||""===this.searchValue)&&(t=this.isAllOptionsSelected(!0)),s.toggleClass(this.$toggleAllCheckbox,"checked",e||t),this.isAllSelected=e}isAllOptionsSelected(e){let t=!1;return this.options.length&&this.selectedValues.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&(!e||t.isVisible))),t}isAllGroupOptionsSelected(e){let t=!1;return this.options.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&t.groupIndex===e)),t}toggleGroupOptionsParent(e,t){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;let i=s.getData(e,"groupIndex");void 0!==i&&(i=parseInt(i));const o=this.$options.querySelector(`.vscomp-option[data-index="${i}"]`),n="boolean"==typeof t?t:this.isAllGroupOptionsSelected(i);this.toggleGroupTitleCheckbox(o,n),this.toggleGroupTitleProp(i,n)}toggleGroupTitleProp(e,t){const s="boolean"==typeof t?t:this.isAllGroupOptionsSelected(e);this.toggleSelectedProp(e,s)}toggleGroupOptions(e,i){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;const o=s.getData(e,"index","number"),{selectedValues:n,selectAllOnlyVisible:r}=this,a={},{removeItemFromArray:l}=t;n.forEach(e=>{a[e]=!0}),this.options.forEach(e=>{if(e.isDisabled||e.groupIndex!==o)return;const{value:t}=e;!i||r&&!e.isVisible?(e.isSelected=!1,a[t]&&l(n,t)):(e.isSelected=!0,a[t]||n.push(t))}),this.toggleAllOptionsClass(!!i&&null),this.setValue(n),setTimeout(()=>{this.renderOptions()},0)}toggleGroupTitleCheckbox(e,t){if(!e)return;const i=s.getData(e,"index","number");this.toggleSelectedProp(i,t),this.toggleOptionSelectedState(e,t)}toggleFocusedProp(e,t=!1){this.focusedOptionIndex&&this.setOptionProp(this.focusedOptionIndex,"isFocused",!1),this.setOptionProp(e,"isFocused",t),this.focusedOptionIndex=e}toggleSelectedProp(e,t=!1){this.setOptionProp(e,"isSelected",t)}scrollToTop(){const{scrollTop:e}=this.$optionsContainer;e>0&&(this.$optionsContainer.scrollTop=0)}reset(e=!1,t=!1){this.options.forEach(e=>{e.isSelected=!1}),this.beforeValueSet(!0),this.setValue(null,{disableEvent:t,disableValidation:e}),this.afterValueSet(),e&&s.removeClass(this.$allWrappers,"has-error"),s.dispatchEvent(this.$ele,"reset")}addOption(e,t){if(!e)return;this.lastOptionIndex+=1;const s=this.getOptionObj({...e,index:this.lastOptionIndex});this.options.push(s),this.sortedOptions.push(s),t&&(this.visibleOptionsCount+=1,this.afterSetOptions())}removeOption(e){(e||0===e)&&(this.options.splice(e,1),this.lastOptionIndex-=1)}removeNewOption(){const e=this.getNewOption();e&&this.removeOption(e.index)}sortOptions(e){return e.sort((e,t)=>{const s=e.isSelected||e.isAnySelected,i=t.isSelected||t.isAnySelected;return s||i?s&&(!i||e.index{const s=e.options;e.isAnySelected=s.some(e=>e.isSelected),e.isAnySelected&&t(s)}),t(s),this.destructureOptionGroup(s)}isOptionVisible({data:e,searchValue:s,hasExactOption:i,visibleOptionGroupsMapping:o,searchGroup:n,searchByStartsWith:r}){const a=null!=e.valueNormalized?e.valueNormalized:e.value.toLowerCase();let l=e.labelNormalized;if(null==l){const s=(e.label||"").trim();l=this.searchNormalize&&""!==s?t.normalizeString(s).toLowerCase():s.toLowerCase()}const{description:p,alias:h}=e;let{descriptionNormalized:c}=e;if(null==c){const e=p||"";c=this.searchNormalize&&""!==e.trim()?t.normalizeString(e).toLowerCase():e.toLowerCase()}let u=r?l.startsWith(s):l.includes(s);return!e.isGroupTitle||n&&u||(u=o[e.index]),r||!h||u||(u=h.includes(s)),r||!c||u||(u=c.includes(s)),e.isVisible=u,i||(i=l===s||a===s),{isVisible:u,hasExactOption:i}}structureOptionGroup(e){const t=[],s={};return e.forEach(e=>{if(e.isGroupTitle){const i=[];e.options=i,s[e.index]=i,t.push(e)}}),e.forEach(e=>{e.isGroupOption&&s[e.groupIndex].push(e)}),t}destructureOptionGroup(e){let t=[];return e.forEach(e=>{t.push(e),t=t.concat(e.options)}),t}serverSearch(){s.removeClass(this.$allWrappers,"has-no-search-results"),s.addClass(this.$allWrappers,"server-searching"),this.setSelectedOptions(),this.onServerSearch(this.searchValue,this)}removeValue(e){const{selectedValues:i}=this,o=s.getData(e,"value");t.removeItemFromArray(i,o),this.setValueMethod(i)}focus(){this.$wrapper.focus()}enable(){this.$ele.disabled=!1,this.$ele.removeAttribute("disabled"),this.$hiddenInput.removeAttribute("disabled"),s.setAria(this.$wrapper,"disabled",!1),s.changeTabIndex(this.$wrapper,0)}disable(){this.$ele.disabled=!0,this.$ele.setAttribute("disabled",""),this.$hiddenInput.setAttribute("disabled",""),s.setAria(this.$wrapper,"disabled",!0),s.changeTabIndex(this.$wrapper,-1),this.$wrapper.blur()}validate(){if(this.disableValidation)return!0;let e=!1;const{selectedValues:i,minValues:o}=this;return this.required&&(t.isEmpty(i)||this.multiple&&o&&i.length{t.virtualSelect?i.push(t.virtualSelect):(e.ele=t,"SELECT"===t.tagName&&l.setPropsFromSelect(e),i.push(new l(e)))}),s?i[0]:i}static getAttrProps(){const{convertPropToDataAttr:e}=s,t={};return n.forEach(e=>{t[e]=e}),a.forEach(s=>{t[e(s)]=s}),t}static setPropsFromSelect(e){const t=e.ele,i=[],n=[],a=e=>{const t=[];return Array.from(e.children).forEach(e=>{const{value:s}=e,o={value:s};"OPTGROUP"===e.tagName?(o.label=e.getAttribute("label"),o.options=a(e)):o.label=e.innerHTML,t.push(o),e.disabled&&i.push(s),e.selected&&n.push(s)}),t},l=a(t),p=document.createElement("div");s.setAttrFromEle(t,p,Object.keys(r),o),t.parentNode.insertBefore(p,t),t.remove(),e.ele=p,e.options=l,e.disabledOptions=i,e.selectedValue=n}static onFormReset(e){const t=e.target.closest("form");t&&t.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.reset(!0)})}static onFormSubmit(e){l.validate(e.target.closest("form"))||e.preventDefault()}static validate(e){if(!e)return!0;let t=!1;return e.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const s=e.parentElement.virtualSelect.validate();t||s||(t=!0)}),!t}static reset(e=!1,t=!1){this.virtualSelect.reset(e,t)}static setValueMethod(...e){this.virtualSelect.setValueMethod(...e)}static setOptionsMethod(...e){this.virtualSelect.setOptionsMethod(...e)}static setDisabledOptionsMethod(...e){this.virtualSelect.setDisabledOptionsMethod(...e)}static setEnabledOptionsMethod(...e){this.virtualSelect.setEnabledOptionsMethod(...e)}static toggleSelectAll(e){this.virtualSelect.toggleAllOptions(e)}static isAllSelected(){return this.virtualSelect.isAllSelected}static addOptionMethod(e){this.virtualSelect.addOption(e,!0)}static getNewValueMethod(){return this.virtualSelect.getNewValue()}static getDisplayValueMethod(){return this.virtualSelect.getDisplayValue()}static getSelectedOptionsMethod(e){return this.virtualSelect.getSelectedOptions(e)}static getDisabledOptionsMethod(){return this.virtualSelect.getDisabledOptions()}static openMethod(){return this.virtualSelect.openDropbox()}static closeMethod(){return this.virtualSelect.closeDropbox()}static focusMethod(){return this.virtualSelect.focus()}static enableMethod(){return this.virtualSelect.enable()}static disableMethod(){return this.virtualSelect.disable()}static destroyMethod(){return this.virtualSelect.destroy()}static validateMethod(){return this.virtualSelect.validate()}static toggleRequiredMethod(e){return this.virtualSelect.toggleRequired(e)}static onResizeMethod(){document.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.onResize()})}}document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeMethod),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.lastInteractedInstance=null,"undefined"!=typeof NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach)}(),function(){"use strict";function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,s){if(e){if("string"==typeof e)return t(e,s);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,s):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var s=0,i=new Array(t);ss-o-t.width?"left":"right",vertical:n>i-n-t.height?"top":"bottom"}}},{key:"getAbsoluteCoords",value:function(e){if(e){var t=e.getBoundingClientRect(),s=window.pageXOffset,i=window.pageYOffset;return{width:t.width,height:t.height,top:t.top+i,right:t.right+s,bottom:t.bottom+i,left:t.left+s}}}},{key:"getCoords",value:function(e){return e?e.getBoundingClientRect():{}}},{key:"getData",value:function(e,t,s){if(e){var i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}}},{key:"setData",value:function(e,t,s){e&&(e.dataset[t]=s)}},{key:"setStyle",value:function(e,t,s){e&&(e.style[t]=s)}},{key:"show",value:function(e){var s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.setStyle(e,"display",s)}},{key:"hide",value:function(e){t.setStyle(e,"display","none")}},{key:"getHideableParent",value:function(e){for(var t,s=e.parentElement;s;){var i=getComputedStyle(s).overflow;if(-1!==i.indexOf("scroll")||-1!==i.indexOf("auto")){t=s;break}s=s.parentElement}return t}}],s&&function(e,t){for(var s=0;sO?O-b:L:C+h>M&&("right"===E?n="left":C=M+by?y-u:P:w+c>I&&("bottom"===E?n="top":w=I+uh-j&&(G=h-j):"left"!==E&&"right"!==E||((H=m/2+g-R)c-j&&(H=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(H),"px, 0) ").concat(K))}s.hide(this.$popperEle)}},{key:"resetPosition",value:function(){s.setStyle(this.$popperEle,"transform","none"),this.setPosition()}},{key:"show",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.resetPosition,o=t.data;clearTimeout(this.exitDelayTimeout),clearTimeout(this.hideDurationTimeout),i&&this.resetPosition(),this.enterDelayTimeout=setTimeout(function(){var t=s.getData(e.$popperEle,"left"),i=s.getData(e.$popperEle,"top"),n="translate3d(".concat(parseInt(t),"px, ").concat(parseInt(i),"px, 0)"),r=e.showDuration;s.show(e.$popperEle,"inline-flex"),s.getCoords(e.$popperEle),s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",1),e.showDurationTimeout=setTimeout(function(){"function"==typeof e.afterShowCallback&&e.afterShowCallback(o)},r)},this.enterDelay)}},{key:"hide",value:function(){var e=this,t=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}).data;clearTimeout(this.enterDelayTimeout),clearTimeout(this.showDurationTimeout),this.exitDelayTimeout=setTimeout(function(){if(e.$popperEle){var i=parseInt(s.getData(e.$popperEle,"fromLeft")),o=parseInt(s.getData(e.$popperEle,"fromTop")),n="translate3d(".concat(i,"px, ").concat(o,"px, 0)"),r=e.hideDuration;s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",0),e.hideDurationTimeout=setTimeout(function(){s.hide(e.$popperEle),"function"==typeof e.afterHideCallback&&e.afterHideCallback(t)},r)}},this.exitDelay)}},{key:"updatePosition",value:function(){s.setStyle(this.$popperEle,"transitionDuration","0ms"),this.resetPosition();var e=parseInt(s.getData(this.$popperEle,"left")),t=parseInt(s.getData(this.$popperEle,"top"));s.show(this.$popperEle,"inline-flex"),s.setStyle(this.$popperEle,"transform","translate3d(".concat(e,"px, ").concat(t,"px, 0)"))}}],t&&function(e,t){for(var s=0;s1&&void 0!==arguments[1]&&arguments[1]}},{key:"removeArrayEmpty",value:function(e){return Array.isArray(e)&&e.length?e.filter(function(e){return!!e}):[]}},{key:"throttle",value:function(e,t){var s,i=0;return function(){for(var o=arguments.length,n=new Array(o),r=0;re.length)&&(t=e.length);for(var s=0,i=new Array(t);s'),e=this.$popover.querySelector(".pop-comp-arrow")),this.$arrowEle=e}}},{key:"destroy",value:function(){this.removeEvents()}}])&&c(t.prototype,s),o&&c(t,o),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,s,o}();d=f.getAttrProps(),window.PopoverComponent=f}(); \ No newline at end of file + */!function(){"use strict";const e=/[^\p{L}\p{N}_]/gu;class t{static getString(e){return e||0===e?e.toString():""}static convertToBoolean(e,t=!1){let s;return s=!0===e||"true"===e||!1!==e&&"false"!==e&&t,s}static isEmpty(e){let t=!1;return e?Array.isArray(e)?0===e.length&&(t=!0):"object"==typeof e&&0===Object.keys(e).length&&(t=!0):t=!0,t}static isNotEmpty(e){return!t.isEmpty(e)}static normalizeValues(e){if(Array.isArray(e)){const t=new Array(e.length);for(let s=0;s!!e):[]}static getRandomInt(e,t=0){const s=Math.ceil(t),i=Math.floor(e);return Math.floor(Math.random()*(i-s-1))+s}static regexEscape(e){return e.replace(/[-/\\^$*+?.()|[\]{}]/g,"\\$&")}static normalizeString(t){return t.normalize("NFD").replace(e,"")}static willTextOverflow(e,t){const s=document.createElement("div");s.style.position="absolute",s.style.visibility="hidden",s.style.whiteSpace="nowrap",s.style.fontSize=window.getComputedStyle(e).fontSize,s.style.fontFamily=window.getComputedStyle(e).fontFamily,s.textContent=t,document.body.appendChild(s);const i=s.clientWidth;return document.body.removeChild(s),i>e.clientWidth}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static containsHTML(e){return/<[a-z][\s\S]*>/i.test(e)}static containsHTMLorJS(e){return/<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(e)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;return function(...r){const a=Date.now(),l=t-(a-n);o=r,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,e.apply(s,o),o=[],s=void 0):i||(i=setTimeout(()=>{n=Date.now(),i=null,e.apply(s,o),o=[],s=void 0},l))}}}class s{static addClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.add(...i)})}static removeClass(e,t){if(!e)return;const i=t.split(" ");s.getElements(e).forEach(e=>{e.classList.remove(...i)})}static toggleClass(e,t,i){if(!e)return;let o;void 0!==i&&(o=Boolean(i)),s.getElements(e).forEach(e=>{e.classList.toggle(t,o)})}static hasClass(e,t){return!!e&&e.classList.contains(t)}static hasEllipsis(e){return!!e&&e.scrollWidth>e.offsetWidth}static getData(e,t,s){if(!e)return;let i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}static setData(e,t,s){e&&(e.dataset[t]=s)}static setAttr(e,t,s){e&&e.setAttribute(t,s)}static setAttrFromEle(e,t,s,i){const o={};s.forEach(t=>{o[t]=e.getAttribute(t)}),s.forEach(e=>{const s=o[e];(s||-1!==i.indexOf(e)&&""===s)&&t.setAttribute(e,s)})}static setStyle(e,t,s){e&&(e.style[t]=s)}static setStyles(e,t){e&&t&&Object.keys(t).forEach(s=>{e.style[s]=t[s]})}static setAria(e,t,s){if(!e)return;let i=t;"role"!==i&&(i=`aria-${i}`),e.setAttribute(i,s)}static getElements(e){return e?void 0===e.forEach?[e]:e:[]}static getElementsBySelector(e="",t=void 0){let s;const i=void 0!==t?t:document;return""!==e&&(s=i.querySelectorAll(e)),void 0!==s?Array.from(s):[]}static addEvent(e,i,o,n){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{s.getElements(e).forEach(e=>{e.addEventListener(t,o,{capture:n})})})}static dispatchEvent(e,t,i=!1){if(!e)return;const o=s.getElements(e);setTimeout(()=>{o.forEach(e=>{e.dispatchEvent(new CustomEvent(t,{bubbles:i}))})},0)}static getAttributesText(e){let t="";return e?(Object.entries(e).forEach(([e,s])=>{void 0!==s&&(t+=` ${e}="${s}" `)}),t):t}static convertPropToDataAttr(e){return e?`data-${e}`.replace(/([A-Z])/g,"-$1").toLowerCase():""}static changeTabIndex(e,t){e?s.getElements(e).forEach(e=>{e.tabIndex=t}):console.log(e,"Invalid element provided.")}static removeEvent(e,t,i,o=!1){e&&s.getElements(e).forEach(e=>{e.removeEventListener(t,i,{capture:o})})}}const i={13:"onEnterPress",38:"onUpArrowPress",40:"onDownArrowPress",46:"onBackspaceOrDeletePress",8:"onBackspaceOrDeletePress"},o=["autofocus","disabled","multiple","required"],n=["autofocus","class","disabled","id","multiple","name","placeholder","required"];let r;const a=["additionalClasses","additionalDropboxClasses","additionalDropboxContainerClasses","additionalToggleButtonClasses","aliasKey","allOptionsSelectedText","allowNewOption","alwaysShowSelectedOptionsCount","alwaysShowSelectedOptionsLabel","ariaLabelledby","ariaLabelText","ariaLabelClearButtonText","ariaLabelTagClearButtonText","ariaLabelSearchClearButtonText","autoSelectFirstOption","clearButtonText","descriptionKey","disableAllOptionsSelectedText","disableOptionGroupCheckbox","disableSelectAll","disableValidation","dropboxWidth","dropboxWrapper","emptyValue","enableSecureText","focusSelectedOptionOnOpen","hasOptionDescription","hideClearButton","hideValueTooltipOnSelectAll","keepAlwaysOpen","labelKey","markSearchResults","maxValues","maxWidth","minValues","moreText","noOfDisplayValues","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","selectAllOnlyVisible","selectAllText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let t="vscomp-wrapper",i="vscomp-toggle-button";const o=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),n=this.getTooltipAttrText(this.clearButtonText),r=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",a=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",l=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let h=!1;this.additionalClasses&&(t+=` ${this.additionalClasses}`),this.additionalToggleButtonClasses&&(i+=` ${this.additionalToggleButtonClasses}`),this.multiple&&(t+=" multiple",this.disableSelectAll||(t+=" has-select-all")),this.hideClearButton||(t+=" has-clear-button"),this.keepAlwaysOpen?(t+=" keep-always-open",h=!0):t+=" closed",this.showAsPopup&&(t+=" show-as-popup"),this.hasSearch&&(t+=" has-search-input"),this.showValueAsTags&&(t+=" show-value-as-tags"),this.textDirection&&(t+=` text-direction-${this.textDirection}`),this.popupPosition&&(t+=` popup-position-${this.popupPosition.toLowerCase()}`);const p=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:t})}\n
`;this.$ele.innerHTML=p,this.$body=document.querySelector("body"),this.$wrapper=this.$ele.querySelector(".vscomp-wrapper"),this.hasDropboxWrapper?(this.$allWrappers=[this.$wrapper,this.$dropboxWrapper],this.$dropboxContainer=this.$dropboxWrapper.querySelector(".vscomp-dropbox-container"),s.addClass(this.$dropboxContainer,"pop-comp-wrapper")):(this.$allWrappers=[this.$wrapper],this.$dropboxContainer=this.$wrapper.querySelector(".vscomp-dropbox-container")),this.$toggleButton=this.$ele.querySelector(".vscomp-toggle-button"),this.$clearButton=this.$ele.querySelector(".vscomp-clear-button"),this.$valueText=this.$ele.querySelector(".vscomp-value"),this.$hiddenInput=this.$ele.querySelector(".vscomp-hidden-input"),this.$dropbox=this.$dropboxContainer.querySelector(".vscomp-dropbox"),this.$dropboxCloseButton=this.$dropboxContainer.querySelector(".vscomp-dropbox-close-button"),this.$dropboxContainerBottom=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-bottom"),this.$dropboxContainerTop=this.$dropboxContainer.querySelector(".vscomp-dropbox-container-top"),this.$search=this.$dropboxContainer.querySelector(".vscomp-search-wrapper"),this.$optionsContainer=this.$dropboxContainer.querySelector(".vscomp-options-container"),this.$optionsList=this.$dropboxContainer.querySelector(".vscomp-options-list"),this.$options=this.$dropboxContainer.querySelector(".vscomp-options"),this.$noOptions=this.$dropboxContainer.querySelector(".vscomp-no-options"),this.$noSearchResults=this.$dropboxContainer.querySelector(".vscomp-no-search-results"),this.afterRenderWrapper()}renderDropbox({wrapperClasses:e}){const t="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let i="vscomp-dropbox";this.additionalDropboxClasses&&(i+=` ${this.additionalDropboxClasses}`);let o="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(o+=` ${this.additionalDropboxContainerClasses}`);const n=`
\n \n
\n
\n\n
\n
\n\n
\n
\n
\n
\n\n
\n
${this.noOptionsText}
\n
${this.noSearchResultsText}
\n\n \n
\n \n
`;if(t){const i=document.createElement("div");return this.$dropboxWrapper=i,this.hasDropboxWrapper=!0,i.innerHTML=n,t.appendChild(i),s.addClass(i,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(i,"tabindex","-1"),s.setAria(i,"hidden",!0)),""}return this.hasDropboxWrapper=!1,n}renderOptions(){this.calculateAriaMetadata();let e="";const s=this.getVisibleOptions();let i="",o="";const n=!(!this.markSearchResults||!this.searchValue);let r;const{labelRenderer:a,disableOptionGroupCheckbox:l,uniqueId:h,searchGroup:p}=this,c="function"==typeof a,{convertToBoolean:u}=t;let d="";if(n&&(r=new RegExp(`(${t.regexEscape(this.searchValue)})(?!([^<]+)?>)`,"gi")),this.multiple&&(i=''),this.allowNewOption){const e=this.getTooltipAttrText("New Option");o=``}s.forEach(s=>{const{index:v}=s;let b,m="vscomp-option";const f=this.getTooltipAttrText("",!0,!0);let g=i,O="",y="",x="",S="",$="-1";const w=u(s.isSelected);let C="";if(s.classNames&&(m+=` ${t.sanitizeClassNames(s.classNames)}`),s.isFocused&&($="0",m+=" focused"),s.isDisabled&&(m+=" disabled",C='aria-disabled="true"'),s.isGroupTitle&&(d=s.label,m+=" group-title",l&&(g="")),w&&(m+=" selected"),s.isGroupOption){let e="";if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const i=this.secureText(t.getString(s.customData.group_name)),o=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${i}, `:"",e=void 0!==s.customData.description?` ${o},`:"",S=`aria-label="${d} ${s.label}, ${e}"`}else S=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(y=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",O+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let E="";this.ariaSetSize>0&&(E=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(E+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${y}\n ${O}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",t="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${this.ariaLabelSearchClearButtonText}"`:"";t=`\n \n ×`}const s=`
\n ${e}\n ${t}\n
`;this.$search.innerHTML=s,this.$searchInput=this.$dropboxContainer.querySelector(".vscomp-search-input"),this.$searchClear=this.$dropboxContainer.querySelector(".vscomp-search-clear"),this.$toggleAllButton=this.$dropboxContainer.querySelector(".vscomp-toggle-all-button"),this.$toggleAllCheckbox=this.$dropboxContainer.querySelector(".vscomp-toggle-all-checkbox"),this.addEvent(this.$searchInput,"input","onSearch"),this.addEvent(this.$searchInput,"change","preventPropagation"),this.addEvent(this.$searchClear,"click keydown","onSearchClear"),this.addEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.addEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.addEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus")}addEvents(){this.addEvent(document,"click","onDocumentClick",!0),this.addEvent(this.$allWrappers,"keydown","onKeyDown"),this.addEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.addEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.addEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.addEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.addEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.addEvent(this.$options,"click","onOptionsClick"),this.addEvent(this.$options,"mouseover","onOptionsMouseOver"),this.addEvent(this.$options,"touchmove","onOptionsTouchMove"),this.addMutationObserver()}addEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`;let r=this.events[i];r||(r=this[o].bind(this),this.events[i]=r),s.addEvent(e,t,r,n)})}removeEvents(){this.removeEvent(document,"click","onDocumentClick",!0),this.removeEvent(this.$allWrappers,"keydown","onKeyDown"),this.removeEvent(this.$toggleButton,"click keydown","onToggleButtonPress"),this.removeEvent(this.$clearButton,"click keydown","onClearButtonClick"),this.removeEvent(this.$dropboxContainer,"click","onDropboxContainerClick"),this.removeEvent(this.$dropboxCloseButton,"click","onDropboxCloseButtonClick"),this.removeEvent(this.$optionsContainer,"scroll","onOptionsScroll"),this.removeEvent(this.$options,"click","onOptionsClick"),this.removeEvent(this.$options,"mouseover","onOptionsMouseOver"),this.removeEvent(this.$options,"touchmove","onOptionsTouchMove"),this.$searchInput&&(this.removeEvent(this.$searchInput,"input","onSearch"),this.removeEvent(this.$searchInput,"change","preventPropagation"),this.$searchClear&&(this.removeEvent(this.$searchClear,"click","onSearchClear"),this.removeEvent(this.$searchClear,"keydown","onSearchClear"))),this.$toggleAllButton&&this.removeEvent(this.$toggleAllButton,"click","onToggleAllOptions"),this.$dropboxContainerBottom&&this.removeEvent(this.$dropboxContainerBottom,"focus","onDropboxContainerTopOrBottomFocus"),this.$dropboxContainerTop&&this.removeEvent(this.$dropboxContainerTop,"focus","onDropboxContainerTopOrBottomFocus"),this.removeMutationObserver()}removeEvent(e,i,o,n=!1){e&&t.removeArrayEmpty(i.split(" ")).forEach(t=>{const i=`${o}-${t}`,r=this.events[i];r&&s.removeEvent(e,t,r,n)})}onDocumentClick(e){const t=e.target.closest(".vscomp-wrapper");if(!t)return void l.openInstances.forEach(e=>{const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox()});const s=t.parentElement.virtualSelect;s&&s!==this&&this.isOpened()&&!this.keepAlwaysOpen&&(this.shouldFocusWrapperOnClose=!1,this.closeDropbox())}onKeyDown(e){const t=e.which||e.keyCode,s=i[t];if(document.activeElement!==this.$searchInput||e.shiftKey||9!==t||this.multiple||(e.preventDefault(),this.focusFirstVisibleOption()),document.activeElement!==this.$toggleAllButton||13!==t){if(27===t||"Escape"===e.key){const e=this.showAsPopup?this.$wrapper:this.$dropboxWrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}else this.toggleAllOptions()}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}onDownArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"next"}):this.openDropbox())}onUpArrowPress(e){document.activeElement!==this.$searchInput&&(e.preventDefault(),this.isOpened()?this.focusOption({direction:"previous"}):this.openDropbox())}onBackspaceOrDeletePress(e){e.target===this.$wrapper&&(e.preventDefault(),this.selectedValues.length>0&&this.reset())}onToggleButtonPress(e){if("keydown"===e.type){if("Enter"!==e.code&&"Space"!==e.code)return;e.preventDefault()}const t=e.target;if(t.closest(".vscomp-value-tag-clear-button"))return e.stopPropagation(),void this.removeValue(t.closest(".vscomp-value-tag"));t.closest(".toggle-button-child")||this.toggleDropbox()}onClearButtonClick(e){"click"===e.type?this.reset():"keydown"!==e.type||"Enter"!==e.code&&"Space"!==e.code||(e.stopPropagation(),this.reset())}onOptionsScroll(){this.setVisibleOptions(!0)}onOptionsClick(e){const t=e.target.closest(".vscomp-option");t&&!s.hasClass(t,"disabled")&&(s.hasClass(t,"group-title")?this.onGroupTitleClick(t):this.selectOption(t,{event:e}))}onGroupTitleClick(e){if(!e||!this.multiple||this.disableOptionGroupCheckbox)return;const t=!s.hasClass(e,"selected");this.toggleGroupTitleCheckbox(e,t),this.toggleGroupOptions(e,t)}onDropboxContainerClick(e){e.target.closest(".vscomp-dropbox")||this.closeDropbox()}onDropboxCloseButtonClick(){this.closeDropbox()}onOptionsMouseOver(e){const t=e.target.closest(".vscomp-option");t&&this.isOpened()&&(s.hasClass(t,"disabled")||s.hasClass(t,"group-title")?this.removeOptionFocus():this.focusOption({$option:t}))}onOptionsTouchMove(){this.removeOptionFocus()}onSearch(e){e.stopPropagation(),this.setSearchValue(e.target.value,!0)}preventPropagation(e){e.stopPropagation()}onSearchClear(e){e.stopPropagation(),"Enter"!==e.code&&"Space"!==e.code&&"click"!==e.type||(this.setSearchValue(""),this.focusSearchInput())}onToggleAllOptions(){this.toggleAllOptions()}onDropboxContainerTopOrBottomFocus(){this.closeDropbox()}onResize(){this.setOptionsContainerHeight(!0)}addMutationObserver(){if(!this.hasDropboxWrapper)return;const e=this.$ele;this.mutationObserver=new MutationObserver(t=>{let s=!1,i=!1;t.forEach(t=>{s||(s=[...t.addedNodes].some(t=>!(t!==e&&!t.contains(e)))),i||(i=[...t.removedNodes].some(t=>!(t!==e&&!t.contains(e))))}),i&&!s&&this.destroy()}),this.mutationObserver.observe(document.querySelector("body"),{childList:!0,subtree:!0})}removeMutationObserver(){this.mutationObserver&&(this.mutationObserver.disconnect(),this.mutationObserver=null)}beforeValueSet(e){this.toggleAllOptionsClass(!e&&void 0)}beforeSelectNewValue(e){const t=this.getNewOption();if(t){const e=t.index;this.newValues.push(t.value),this.setOptionProp(e,"isCurrentNew",!1),this.setOptionProp(e,"isNew",!0)}else e&&(this.setNewOption(e),this.toggleSelectedProp(this.lastOptionIndex,!0));this.setManagedTimeout(()=>{this.setSearchValue(""),this.focusSearchInput()},0)}afterRenderWrapper(){s.addClass(this.$ele,"vscomp-ele"),this.renderSearch(),this.setEleStyles(),this.setDropboxStyles(),this.setVisibleOptionsCount(),this.setOptionsContainerHeight(),this.addEvents(),this.setEleProps(),this.keepAlwaysOpen||this.showAsPopup||this.initDropboxPopover(),this.initialSelectedValue?this.setValueMethod(this.initialSelectedValue,this.silentInitialValueSet):this.autoSelectFirstOption&&this.visibleOptions.length&&this.setValueMethod(this.visibleOptions[0].value,this.silentInitialValueSet),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),this.initialDisabled&&this.disable(),this.autofocus&&this.focus()}afterRenderOptions(){const e=this.getVisibleOptions(),t=!this.options.length&&!this.hasServerSearch,i=!t&&!e.length;(!this.allowNewOption||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(s.toggleClass(this.$allWrappers,"has-no-search-results",i),i?(s.setAttr(this.$noSearchResults,"tabindex","0"),s.setAttr(this.$noSearchResults,"aria-hidden","false")):(s.setAttr(this.$noSearchResults,"tabindex","-1"),s.setAttr(this.$noSearchResults,"aria-hidden","true"))),s.toggleClass(this.$allWrappers,"has-no-options",t),t?(s.setAttr(this.$noOptions,"tabindex","0"),s.setAttr(this.$noOptions,"aria-hidden","false")):(s.setAttr(this.$noOptions,"tabindex","-1"),s.setAttr(this.$noOptions,"aria-hidden","true")),this.setOptionAttr(),this.setOptionsPosition(),this.setOptionsTooltip(),document.activeElement!==this.$searchInput&&this.setManagedTimeout(()=>{const e=s.getElementsBySelector(".focused",this.$dropboxContainer)[0];void 0!==e&&e.focus({preventScroll:!0})},20)}afterSetOptionsContainerHeight(e){e&&this.showAsPopup&&this.setVisibleOptions()}afterSetSearchValue(){this.hasServerSearch?(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=setTimeout(()=>{this.serverSearch()},this.searchDelay)):this.setVisibleOptionsCount(),this.selectAllOnlyVisible&&this.toggleAllOptionsClass(),this.focusOption({focusFirst:!0})}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),e||this.reset()}setProps(e){const s=this.setDefaultProps(e);this.setPropsFromElementAttr(s);const{convertToBoolean:i}=t;this.$ele=s.ele,this.dropboxWrapper=s.dropboxWrapper,this.valueKey=s.valueKey,this.labelKey=s.labelKey,this.descriptionKey=s.descriptionKey,this.aliasKey=s.aliasKey,this.optionHeightText=s.optionHeight,this.optionHeight=parseFloat(this.optionHeightText),this.multiple=i(s.multiple),this.hasSearch=i(s.search),this.searchByStartsWith=i(s.searchByStartsWith),this.searchGroup=i(s.searchGroup),this.hideClearButton=i(s.hideClearButton),this.autoSelectFirstOption=i(s.autoSelectFirstOption),this.hasOptionDescription=i(s.hasOptionDescription),this.silentInitialValueSet=i(s.silentInitialValueSet),this.allowNewOption=i(s.allowNewOption),this.markSearchResults=i(s.markSearchResults),this.showSelectedOptionsFirst=i(s.showSelectedOptionsFirst),this.disableSelectAll=i(s.disableSelectAll),this.keepAlwaysOpen=i(s.keepAlwaysOpen),this.showDropboxAsPopup=i(s.showDropboxAsPopup),this.hideValueTooltipOnSelectAll=i(s.hideValueTooltipOnSelectAll),this.showOptionsOnlyOnSearch=i(s.showOptionsOnlyOnSearch),this.selectAllOnlyVisible=i(s.selectAllOnlyVisible),this.alwaysShowSelectedOptionsCount=i(s.alwaysShowSelectedOptionsCount),this.alwaysShowSelectedOptionsLabel=i(s.alwaysShowSelectedOptionsLabel),this.disableAllOptionsSelectedText=i(s.disableAllOptionsSelectedText),this.showValueAsTags=i(s.showValueAsTags),this.disableOptionGroupCheckbox=i(s.disableOptionGroupCheckbox),this.enableSecureText=i(s.enableSecureText),this.setValueAsArray=i(s.setValueAsArray),this.disableValidation=i(s.disableValidation),this.initialDisabled=i(s.disabled),this.required=i(s.required),this.autofocus=i(s.autofocus),this.useGroupValue=i(s.useGroupValue),this.focusSelectedOptionOnOpen=i(s.focusSelectedOptionOnOpen),this.noOptionsText=s.noOptionsText,this.noSearchResultsText=s.noSearchResultsText,this.selectAllText=s.selectAllText,this.searchNormalize=s.searchNormalize,this.searchPlaceholderText=s.searchPlaceholderText,this.searchFormLabel=s.searchFormLabel,this.optionsSelectedText=s.optionsSelectedText,this.optionSelectedText=s.optionSelectedText,this.allOptionsSelectedText=s.allOptionsSelectedText,this.clearButtonText=s.clearButtonText,this.moreText=s.moreText,this.placeholder=s.placeholder,this.position=s.position,this.textDirection=s.textDirection,this.dropboxWidth=s.dropboxWidth,this.tooltipFontSize=s.tooltipFontSize,this.tooltipAlignment=s.tooltipAlignment,this.tooltipMaxWidth=s.tooltipMaxWidth,this.updatePositionThrottle=s.updatePositionThrottle,this.noOfDisplayValues=parseInt(s.noOfDisplayValues),this.zIndex=parseInt(s.zIndex),this.maxValues=parseInt(s.maxValues),this.minValues=parseInt(s.minValues),this.name=this.secureText(s.name),this.additionalClasses=s.additionalClasses,this.additionalDropboxClasses=s.additionalDropboxClasses,this.additionalDropboxContainerClasses=s.additionalDropboxContainerClasses,this.additionalToggleButtonClasses=s.additionalToggleButtonClasses,this.popupDropboxBreakpoint=s.popupDropboxBreakpoint,this.popupPosition=s.popupPosition,this.onServerSearch=s.onServerSearch,this.labelRenderer=s.labelRenderer,this.selectedLabelRenderer=s.selectedLabelRenderer,this.initialSelectedValue=0===s.selectedValue?"0":s.selectedValue,this.emptyValue=s.emptyValue,this.ariaLabelText=s.ariaLabelText,this.ariaLabelledby=s.ariaLabelledby,this.ariaLabelClearButtonText=s.ariaLabelClearButtonText,this.ariaLabelTagClearButtonText=s.ariaLabelTagClearButtonText,this.ariaLabelSearchClearButtonText=s.ariaLabelSearchClearButtonText,this.maxWidth=s.maxWidth,this.searchDelay=s.searchDelay,this.showDuration=parseInt(s.showDuration),this.hideDuration=parseInt(s.hideDuration),this.selectedValues=[],this.selectedOptions=[],this.newValues=[],this.events={},this.tooltipEnterDelay=200,this.searchValue="",this.searchValueOriginal="",this.isAllSelected=!1,(void 0===s.search&&this.multiple||this.allowNewOption||this.showOptionsOnlyOnSearch)&&(this.hasSearch=!0),this.hasServerSearch="function"==typeof this.onServerSearch,(this.maxValues||this.hasServerSearch||this.showOptionsOnlyOnSearch)&&(this.disableSelectAll=!0,this.disableOptionGroupCheckbox=!0),this.keepAlwaysOpen&&(this.dropboxWrapper="self"),this.showAsPopup=this.showDropboxAsPopup&&!this.keepAlwaysOpen&&window.innerWidth<=parseFloat(this.popupDropboxBreakpoint),this.hasSearchContainer=this.hasSearch||this.multiple&&!this.disableSelectAll,this.optionsCount=this.getOptionsCount(s.optionsCount),this.halfOptionsCount=Math.ceil(this.optionsCount/2),this.optionsHeight=this.getOptionsHeight(),this.uniqueId=this.getUniqueId(),this.shouldFocusWrapperOnClose=!0,this.ariaSetSize=0}setDefaultProps(e){const t={dropboxWrapper:"self",valueKey:"value",labelKey:"label",descriptionKey:"description",aliasKey:"alias",ariaLabelText:"Options list",ariaLabelClearButtonText:"Clear button",ariaLabelTagClearButtonText:"Remove option",ariaLabelSearchClearButtonText:"Clear search input",optionsCount:5,noOfDisplayValues:50,optionHeight:"40px",noOptionsText:"No options found",noSearchResultsText:"No results found",selectAllText:"Select All",searchNormalize:!1,searchPlaceholderText:"Search...",searchFormLabel:"Search",clearButtonText:"Clear",moreText:"more...",optionsSelectedText:"options selected",optionSelectedText:"option selected",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:e.keepAlwaysOpen?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return e.hasOptionDescription&&(t.optionsCount=4,t.optionHeight="50px"),Object.assign(t,e)}setPropsFromElementAttr(e){const t=e.ele;Object.keys(r).forEach(s=>{let i=t.getAttribute(s);-1===o.indexOf(s)||""!==i&&"true"!==i||(i=!0),i&&(e[r[s]]=i)})}setEleProps(){const{$ele:e}=this;e.virtualSelect=this,e.value=this.multiple?[]:"",e.name=this.name,e.disabled=!1,e.required=this.required,e.autofocus=this.autofocus,e.multiple=this.multiple,e.form=e.closest("form"),e.reset=l.reset,e.setValue=l.setValueMethod,e.setOptions=l.setOptionsMethod,e.setDisabledOptions=l.setDisabledOptionsMethod,e.setEnabledOptions=l.setEnabledOptionsMethod,e.toggleSelectAll=l.toggleSelectAll,e.isAllSelected=l.isAllSelected,e.addOption=l.addOptionMethod,e.getNewValue=l.getNewValueMethod,e.getDisplayValue=l.getDisplayValueMethod,e.getSelectedOptions=l.getSelectedOptionsMethod,e.getDisabledOptions=l.getDisabledOptionsMethod,e.open=l.openMethod,e.close=l.closeMethod,e.focus=l.focusMethod,e.enable=l.enableMethod,e.disable=l.disableMethod,e.destroy=l.destroyMethod,e.validate=l.validateMethod,e.toggleRequired=l.toggleRequiredMethod,this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=this)}setValueMethod(e,s){const i={},o={};let n=[];const r=this.multiple;let a=t.normalizeValues(e);if(a){if(Array.isArray(a)||(a=[a]),r){const{maxValues:e}=this;e&&a.length>e&&a.splice(e)}else a.length>1&&(a=[a[0]]);this.useGroupValue&&(a=this.setGroupOptionsValue(a)),a.forEach((e,t)=>{i[e]=!0,o[e]=t}),this.allowNewOption&&a&&this.setNewOptionsFromValue(a)}this.options.forEach(e=>{const s=t.normalizeValues(e.value);!0!==i[s]||e.isDisabled||e.isGroupTitle?e.isSelected=!1:(e.isSelected=!0,n.push(e.value))}),r?(this.hasOptionGroup&&this.setGroupsSelectedProp(),n.sort((e,s)=>o[t.normalizeValues(e)]-o[t.normalizeValues(s)])):[n]=n,this.beforeValueSet(),this.setValue(n,{disableEvent:s}),this.afterValueSet()}setGroupOptionsValue(e){const t=[],s={},i={};return e.forEach(e=>{i[e]=!0}),this.options.forEach(e=>{const{value:o}=e,n=!0===i[o];e.isGroupTitle?n&&(s[e.index]=!0):(n||s[e.groupIndex])&&t.push(o)}),t}setGroupsSelectedProp(){const e=this.isAllGroupOptionsSelected.bind(this);this.options.forEach(t=>{t.isGroupTitle&&(t.isSelected=e(t.index))})}setOptionsMethod(e,t){this.setOptions(e),this.afterSetOptions(t)}setDisabledOptionsMethod(e,t=!1){this.setDisabledOptions(e,!0),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setDisabledOptions(e,t=!1){let s=[];if(e)if(!0===e)t&&this.options.forEach(e=>(e.isDisabled=!0,s.push(e.value),e));else{s=e.map(e=>e.toString());const i={};s.forEach(e=>{i[e]=!0}),t&&this.options.forEach(e=>(e.isDisabled=!0===i[e.value],e))}else t&&this.options.forEach(e=>(e.isDisabled=!1,e));this.disabledOptions=s}setEnabledOptionsMethod(e,t=!1){this.setEnabledOptions(e),t||(this.setValueMethod(null),this.toggleAllOptionsClass()),this.setVisibleOptions()}setEnabledOptions(e){if(void 0===e)return;const t=[];if(!0===e)this.options.forEach(e=>(e.isDisabled=!1,e));else{const s={};e.forEach(e=>{s[e]=!0}),this.options.forEach(e=>{const i=!0!==s[e.value];return e.isDisabled=i,i&&t.push(e.value),e})}this.disabledOptions=t}setOptions(e=[]){const s=[],i=this.disabledOptions.length,{valueKey:o,labelKey:n,descriptionKey:r,aliasKey:a,hasOptionDescription:l}=this,{getString:h,convertToBoolean:p}=t,c=this.secureText.bind(this),u=this.getAlias.bind(this);let d=0,v=!1;const b={};let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const f=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const g=c(h(e[o])),O=c(h(e[n])),y=e.options,x=!!y,S={index:d,value:g,valueNormalized:g.toLowerCase(),label:O,labelNormalized:this.searchNormalize&&""!==O.trim()?t.normalizeString(O).toLowerCase():O.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:x,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(S.isDisabled=!0===b[g]),e.isGroupOption&&(S.isGroupOption=!0,S.groupIndex=e.groupIndex),l){const s=c(h(e[r]));S.description=s,S.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(S.customData=e.customData),s.push(S),d+=1,x){const e=S.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:O}=this;O.options=s,O.length=g,this.options=s,this.visibleOptionsCount=g,this.lastOptionIndex=g-1,this.newValues=[],this.hasOptionGroup=v,this.hasEmptyValueOption=m,this.setSortedOptions()}setServerOptions(e=[]){this.setOptionsMethod(e,!0);const{selectedOptions:t}=this,i=this.options;let o=!1;if(t.length){const e={};o=!0,i.forEach(t=>{e[t.value]=!0}),t.forEach(t=>{!0!==e[t.value]&&(t.isVisible=!1,i.push(t))}),this.setOptionsMethod(i,!0)}this.allowNewOption&&this.searchValue&&(i.some(e=>e.label.toLowerCase()===this.searchValue)||(o=!0,this.setNewOption())),o?(this.setVisibleOptionsCount(),this.multiple&&this.toggleAllOptionsClass(),this.setValueText()):this.updatePosition(),this.setVisibleOptionsCount(),s.removeClass(this.$allWrappers,"server-searching")}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){let e=[...this.options];this.showSelectedOptionsFirst&&this.selectedValues.length&&(e=this.hasOptionGroup?this.sortOptionsGroup(e):this.sortOptions(e)),this.sortedOptions=e}setVisibleOptions(){let e=[...this.sortedOptions];const t=2*this.optionsCount,s=this.getVisibleStartIndex(),i=this.getNewOption(),o=s+t-1;let n=0;i&&(i.visibleIndex=n,n+=1),e=e.filter(e=>{let t=!1;return e.isVisible&&!e.isCurrentNew&&(t=n>=s&&n<=o,e.visibleIndex=n,n+=1),t}),i&&(e=[i,...e]),this.visibleOptions=e,this.visibleOptionsCount=e.length,this.renderOptions()}setOptionsPosition(e){const t=parseInt((e||this.getVisibleStartIndex())*this.optionHeight);this.$options.style.transform=`translate3d(0, ${t}px, 0)`,s.setData(this.$options,"top",t)}setOptionsTooltip(){const e=this.getVisibleOptions(),{hasOptionDescription:t}=this;e.forEach(e=>{const i=this.$dropboxContainer.querySelector(`.vscomp-option[data-index="${e.index}"]`);s.setData(i.querySelector(".vscomp-option-text"),"tooltip",e.label),t&&s.setData(i.querySelector(".vscomp-option-description"),"tooltip",e.description)})}setValue(e,{disableEvent:i=!1,disableValidation:o=!1}={}){const n=t.normalizeValues(e);this.hasEmptyValueOption&&""===n||n?Array.isArray(n)?this.selectedValues=[...n]:this.selectedValues=[n]:this.selectedValues=[];const r=this.getValue();this.$ele.value=r,this.$hiddenInput.value=this.getInputValue(r),this.isMaxValuesSelected=!!(this.maxValues&&this.maxValues<=this.selectedValues.length),this.toggleAllOptionsClass(),this.setValueText();const a=t.isNotEmpty(this.selectedValues);s.toggleClass(this.$allWrappers,"has-value",a),s.toggleClass(this.$allWrappers,"max-value-selected",this.isMaxValuesSelected),s.setAttr(this.$clearButton,"tabindex",a?"0":"-1"),s.setAria(this.$clearButton,"hidden",!1===a),o||this.validate(),i||s.dispatchEvent(this.$ele,"change",!0)}setValueText(){const{multiple:e,selectedValues:i,noOfDisplayValues:o,showValueAsTags:n,$valueText:r,selectedLabelRenderer:a}=this,l=[];let h=[];const p=i.length;let c=0;const u=this.isAllSelected&&!this.hasServerSearch&&!this.disableAllOptionsSelectedText&&!n;if(u&&this.hideValueTooltipOnSelectAll)r.innerHTML=`${this.allOptionsSelectedText} (${p})`;else{this.getSelectedOptions({fullDetails:!0,keepSelectionOrder:!0}).some(e=>{if(e.isCurrentNew)return!1;if(c>=o)return!0;let{label:s}=e;if("function"==typeof a&&(s=a(e)),l.push(s),c+=1,n){const i=t.willTextOverflow(r.parentElement,s)?this.getTooltipAttrText(s,!1,!0):"";let o="";this.ariaLabelTagClearButtonText&&(o=`aria-label="${s.replace(/<[^>]+>/gi,"").trim()}, ${this.ariaLabelTagClearButtonText}"`);const n=`\n ${s}\n \n \n \n `;h.push(n)}else h.push(s);return!1});const i=p-o;i>0&&h.push(`+ ${i} ${this.moreText}`);const d=l.join(", ");if(""===d)r.innerHTML=this.placeholder;else if(r.innerHTML=d,e){const{maxValues:e}=this;if(this.alwaysShowSelectedOptionsCount||s.hasEllipsis(r)||e||n){let t=`${p}`;if(e&&(t+=` / ${e}`),u)r.innerHTML=`${this.allOptionsSelectedText} (${p})`;else if(n)r.innerHTML=h.join(""),this.$valueTags=r.querySelectorAll(".vscomp-value-tag"),this.setValueTagAttr();else if(!this.alwaysShowSelectedOptionsLabel){const e=1===p?this.optionSelectedText:this.optionsSelectedText;r.innerHTML=`${t} ${e}`}}else h=[]}}let d="";0===p?d=this.placeholder:n||(d=h.join(", ")),n||s.setData(r,"tooltip",d),e&&(n?this.updatePosition():s.setData(r,"tooltipEllipsisOnly",0===p))}setSearchValue(e,t=!1,i=!1){if(e===this.searchValueOriginal&&!i)return;t||(this.$searchInput.value=e);const o=e.replace(/\\/g,"").toLowerCase().trim();this.searchValue=o,this.searchValueOriginal=e,s.toggleClass(this.$allWrappers,"has-search-value",e),s.setAttr(this.$searchClear,"tabindex",""!==e?"0":"-1"),s.setAria(this.$searchClear,"hidden",""===e),this.afterSetSearchValue()}setVisibleOptionsCount(){let e,s=0,i=!1;const{searchGroup:o,showOptionsOnlyOnSearch:n,searchByStartsWith:r}=this;let{searchValue:a}=this;a=this.searchNormalize&&""!==a.trim()?t.normalizeString(a):a;const l=this.isOptionVisible.bind(this);this.hasOptionGroup&&(e=this.getVisibleOptionGroupsMapping(a)),this.options.forEach(t=>{if(t.isCurrentNew)return;let h;n&&!a?(t.isVisible=!1,h={isVisible:!1,hasExactOption:!1}):h=l({data:t,searchValue:a,hasExactOption:i,visibleOptionGroupsMapping:e,searchGroup:o,searchByStartsWith:r}),h.isVisible&&(s+=1),i||(i=h.hasExactOption)}),this.allowNewOption&&(a&&!i?(this.setNewOption(),s+=1):this.removeNewOption()),this.visibleOptionsCount=s,this.afterSetVisibleOptionsCount()}calculateAriaMetadata(){let e=0,t=0;if((this.sortedOptions&&this.sortedOptions.length?this.sortedOptions:this.options).forEach(s=>{if(s.isCurrentNew)s.filteredIndex=void 0;else if(!0===s.isVisible){const i=s.isGroupTitle&&this.multiple&&!this.disableOptionGroupCheckbox;!s.isGroupTitle||i?(t+=1,e+=1,s.filteredIndex=t):s.filteredIndex=void 0}else s.filteredIndex=void 0}),this.allowNewOption){const s=this.getNewOption();s&&!0===s.isVisible?(t+=1,e+=1,s.filteredIndex=t):s&&(s.filteredIndex=void 0)}this.ariaSetSize=e}setOptionProp(e,t,s){this.options[e]&&(this.options[e][t]=s)}setOptionsHeight(){this.$optionsList.style.height=this.optionHeight*this.visibleOptionsCount+"px"}setOptionsContainerHeight(e){let t;e?this.showAsPopup&&(this.optionsCount=this.getOptionsCount(),this.halfOptionsCount=Math.ceil(this.optionsCount/2),t=this.getOptionsHeight(),this.optionsHeight=t):(t=this.optionsHeight,this.keepAlwaysOpen&&(s.setStyle(this.$noOptions,"height",t),s.setStyle(this.$noSearchResults,"height",t))),s.setStyle(this.$optionsContainer,"max-height",t),this.afterSetOptionsContainerHeight(e)}setNewOption(e){const t=e||this.searchValueOriginal.trim();if(!t)return;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",this.secureText(t)),this.setOptionProp(e,"label",this.secureText(t))}else{const s={value:t,label:t};e?(s.isNew=!0,this.newValues.push(t)):s.isCurrentNew=!0,this.addOption(s)}}setSelectedProp(){const e={};this.selectedValues.forEach(t=>{e[t]=!0}),this.options.forEach(t=>{!0===e[t.value]&&(t.isSelected=!0)})}setNewOptionsFromValue(e){if(!e)return;const t=this.setNewOption.bind(this),s={};this.options.forEach(e=>{s[e.value]=!0}),e.forEach(e=>{e&&!0!==s[e]&&t(e)})}setDropboxWrapperWidth(){if(this.showAsPopup)return;const e=this.dropboxWidth||`${this.$wrapper.offsetWidth}px`;s.setStyle(this.$dropboxContainer,"max-width",e)}setEleStyles(){const{maxWidth:e}=this,t={};e&&(t["max-width"]=e),s.setStyles(this.$ele,t)}setDropboxStyles(){const{dropboxWidth:e}=this,t={},i={"z-index":this.zIndex};e&&(this.showAsPopup?t["max-width"]=e:i.width=e),s.setStyles(this.$dropboxContainer,i),s.setStyles(this.$dropbox,t)}setOptionAttr(){const{$visibleOptions:e}=this,{options:t}=this,i=`${this.optionHeight}px`,{setStyle:o,getData:n,setData:r}=s;e&&e.length&&e.forEach(e=>{const s=t[n(e,"index")];o(e,"height",i),r(e,"value",s.value)})}setValueTagAttr(){const{$valueTags:e}=this;if(!e||!e.length)return;const{getData:t,setData:i}=s,{options:o}=this;e.forEach(e=>{const s=t(e,"index");if(void 0!==s){const t=o[s];i(e,"value",t.value)}})}setScrollTop(){const{selectedValues:e}=this;if(this.showSelectedOptionsFirst||!this.focusSelectedOptionOnOpen||0===e.length)return;const t={};let s;e.forEach(e=>{t[e]=!0}),this.options.some(e=>!!t[e.value]&&(s=e.visibleIndex,!0)),s&&(this.$optionsContainer.scrollTop=this.optionHeight*s)}getVisibleOptions(){return this.visibleOptions||[]}getValue(){let e;return e=this.multiple?this.useGroupValue?this.getGroupValue():this.selectedValues:this.selectedValues[0]||"",t.normalizeValues(e)}getGroupValue(){const e=[],t={};return this.options.forEach(s=>{if(!s.isSelected)return;const{value:i}=s;s.isGroupTitle?i&&(t[s.index]=!0,e.push(i)):!0!==t[s.groupIndex]&&e.push(i)}),e}getInputValue(e){let t=e;return t&&t.length?this.setValueAsArray&&this.multiple&&(t=JSON.stringify(t)):t=this.emptyValue,t}getFirstVisibleOptionIndex(){return Math.ceil(this.$optionsContainer.scrollTop/this.optionHeight)}getVisibleStartIndex(){let e=this.getFirstVisibleOptionIndex()-this.halfOptionsCount;return e<0&&(e=0),e}getTooltipAttrText(e,i=!1,o=!1){const n={"data-tooltip":(t.containsHTML(e)?t.replaceDoubleQuotesWithHTML(e):e)||"","data-tooltip-enter-delay":this.tooltipEnterDelay,"data-tooltip-z-index":this.zIndex,"data-tooltip-font-size":this.tooltipFontSize,"data-tooltip-alignment":this.tooltipAlignment,"data-tooltip-max-width":this.tooltipMaxWidth,"data-tooltip-ellipsis-only":i,"data-tooltip-allow-html":o};return s.getAttributesText(n)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=i(s(e.value)),n=i(s(e.label)),r=i(s(e.description));return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:n,labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:r,descriptionNormalized:this.searchNormalize&&""!==r.trim()?t.normalizeString(r).toLowerCase():r.toLowerCase(),alias:this.getAlias(e.alias),isCurrentNew:e.isCurrentNew||!1,isNew:e.isNew||!1,isVisible:!0}}getNewOption(){const e=this.options[this.lastOptionIndex];if(e&&e.isCurrentNew)return e}getOptionIndex(e){let t;return this.options.some(s=>s.value===e&&(t=s.index,!0)),t}getNewValue(){const e={};this.newValues.forEach(t=>{e[t]=!0});const t=this.selectedValues.filter(t=>!0===e[t]);return this.multiple?t:t[0]}getAlias(e){let t=e;return t&&(t=Array.isArray(t)?t.join(","):t.toString().trim(),t=t.toLowerCase()),t||""}getDisplayValue(){const e=[];return this.options.forEach(t=>{t.isSelected&&e.push(t.label)}),this.multiple?e:e[0]||""}getSelectedOptions({fullDetails:e=!1,keepSelectionOrder:t=!1}={}){const{valueKey:s,labelKey:i,selectedValues:o}=this,n=[];if(this.options.forEach(t=>{if(t.isSelected&&!t.isGroupTitle)if(e)n.push(t);else{const e={[s]:t.value,[i]:t.label};t.isNew&&(e.isNew=!0),t.customData&&(e.customData=t.customData),n.push(e)}}),t){const e={};o.forEach((t,s)=>{e[t]=s}),n.sort((t,s)=>e[t.value]-e[s.value])}return this.multiple||e?n:n[0]}getDisabledOptions(){const{valueKey:e,labelKey:t,disabledOptions:s}=this,i={},o=[];return s.forEach(e=>{i[e]=!0}),this.options.forEach(({value:s,label:n})=>{i[s]&&o.push({[e]:s,[t]:n})}),o}getVisibleOptionGroupsMapping(e){let{options:t}=this;const s={},i=this.isOptionVisible.bind(this);return t=this.structureOptionGroup(t),t.forEach(t=>{s[t.index]=t.options.some(t=>i({data:t,searchValue:e}).isVisible)}),s}getOptionsCount(e){let t;if(this.showAsPopup){let e=80*window.innerHeight/100-48;this.hasSearchContainer&&(e-=40),t=Math.floor(e/this.optionHeight)}else t=parseInt(e);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}getSibling(e,t){const i="next"===t?"nextElementSibling":"previousElementSibling";let o=e;do{o&&(o=o[i])}while(s.hasClass(o,"disabled")||s.hasClass(o,"group-title"));return o}getUniqueId(){const e=t.getRandomInt(1e4);return document.querySelector(`#vscomp-ele-wrapper-${e}`)?this.getUniqueId():e}initDropboxPopover(){const e={ele:this.$ele,target:this.$dropboxContainer,position:this.position,zIndex:this.zIndex,margin:4,transitionDistance:30,hideArrowIcon:!0,disableManualAction:!0,disableUpdatePosition:!this.hasDropboxWrapper,updatePositionThrottle:this.updatePositionThrottle,showDuration:this.showDuration,hideDuration:this.hideDuration,afterShow:this.afterShowPopper.bind(this),afterHide:this.afterHidePopper.bind(this)};this.dropboxPopover=new PopoverComponent(e)}openDropbox(e){l.lastInteractedInstance=this;let t="";e||(t=this.$dropboxContainer.style.transition,this.$dropboxContainer.style.transition="none"),this.isSilentOpen=e,l.openInstances.forEach(e=>{if(e!==this){const t=e;t.shouldFocusWrapperOnClose=!1,t.closeDropbox(!0)}}),l.openInstances.add(this),s.setAttr(this.$dropboxWrapper,"tabindex","0"),s.setAria(this.$dropboxWrapper,"hidden",!1),s.setAttr(this.$dropboxContainerTop,"tabindex","0"),s.setAria(this.$dropboxContainerTop,"hidden",!1),s.setAttr(this.$dropboxContainerBottom,"tabindex","0"),s.setAria(this.$dropboxContainerBottom,"hidden",!1),e?s.setStyle(this.$dropboxContainer,"display","inline-flex"):(s.dispatchEvent(this.$ele,"beforeOpen"),s.setAria(this.$wrapper,"expanded",!0)),this.setDropboxWrapperWidth(),s.removeClass(this.$allWrappers,"closed"),s.changeTabIndex(this.$allWrappers,0),e||(this.$dropboxContainer.offsetHeight,this.$dropboxContainer.style.transition=t),this.dropboxPopover&&!e?this.dropboxPopover.show():this.afterShowPopper()}afterShowPopper(){const e=this.isSilentOpen;this.isSilentOpen=!1,e||(this.moveSelectedOptionsFirst(),this.setScrollTop(),s.addClass(this.$allWrappers,"focused"),this.showAsPopup?(s.addClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!0):this.focusElementOnOpen(),s.dispatchEvent(this.$ele,"afterOpen"))}closeDropbox(e){if(this.isSilentClose=e,l.openInstances.delete(this),!1===this.isOpened())return;if(this.keepAlwaysOpen)return void this.removeOptionFocus();const t=document.activeElement,i=t&&this.$wrapper.contains(t)||this.hasDropboxWrapper&&t&&this.$dropboxWrapper.contains(t);this.shouldFocusWrapperOnClose&&l.lastInteractedInstance===this&&!e&&(null===t||t===document.body||i)&&this.$wrapper.focus(),e?s.setStyle(this.$dropboxContainer,"display",""):(s.dispatchEvent(this.$ele,"beforeClose"),s.setAria(this.$wrapper,"expanded",!1),s.setAria(this.$wrapper,"activedescendant",""),s.setAria(this.$dropboxContainer,"activedescendant","")),this.dropboxPopover&&!e?(this.dropboxPopover.hide(),s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)):this.afterHidePopper(),this.setSearchValue("")}afterHidePopper(){const e=this.isSilentClose;this.isSilentClose=!1,s.removeClass(this.$allWrappers,"focused"),this.removeOptionFocus(),!e&&this.isPopupActive&&(s.removeClass(this.$body,"vscomp-popup-active"),this.isPopupActive=!1),s.addClass(this.$allWrappers,"closed"),e||s.dispatchEvent(this.$ele,"afterClose"),this.shouldFocusWrapperOnClose=!0,s.setAttr(this.$dropboxWrapper,"tabindex","-1"),s.setAria(this.$dropboxWrapper,"hidden",!0),s.setAttr(this.$dropboxContainerTop,"tabindex","-1"),s.setAria(this.$dropboxContainerTop,"hidden",!0),s.setAttr(this.$dropboxContainerBottom,"tabindex","-1"),s.setAria(this.$dropboxContainerBottom,"hidden",!0)}moveSelectedOptionsFirst(){this.$optionsContainer.scrollTop&&this.selectedValues.length||this.setVisibleOptions(),this.showSelectedOptionsFirst&&(this.setSortedOptions(),this.scrollToTop(),this.setVisibleOptions())}toggleDropbox(){l.lastInteractedInstance=this,this.isOpened()?this.closeDropbox():this.openDropbox()}updatePosition(){this.dropboxPopover&&this.isOpened()&&this.$ele.updatePosition()}isOpened(){return!s.hasClass(this.$wrapper,"closed")}focusSearchInput(){const e=this.$searchInput;e&&e.focus()}focusElementOnOpen(){const e=this.$searchInput,t=!this.options.length&&!this.hasServerSearch;if(e)t&&!this.allowNewOption?(s.setAttr(e,"disabled",""),this.$noOptions.focus()):(e.removeAttribute("disabled"),e.focus());else{const e=this.$dropbox.querySelector('[tabindex="0"]');void 0!==s.getData(e,"index")?this.focusOption({direction:"next"}):e?e.focus():this.focusFirstVisibleOption()}}focusFirstVisibleOption(){let e=this.$optionsContainer.querySelector(`[data-index='${this.getFirstVisibleOptionIndex()}']`);e?(s.hasClass(e,"group-title")&&(e=this.getSibling(e,"next")),s.setAttr(e,"tabindex","0"),this.$optionsContainer.scrollTop=this.optionHeight*this.getFirstVisibleOptionIndex(),this.focusOption({focusFirst:!0}),e.focus()):(e=this.$dropbox.querySelector('[tabindex="0"]'),e&&e.focus())}focusOption({direction:e,$option:t,focusFirst:i}={}){const o=this.$dropboxContainer.querySelector(".vscomp-option.focused");let n;if(t)n=t;else if(!o||i){const e=this.getFirstVisibleOptionIndex();n=this.$dropboxContainer.querySelector(`.vscomp-option[data-visible-index="${e}"]`),(s.hasClass(n,"disabled")||s.hasClass(n,"group-title"))&&(n=this.getSibling(n,"next"))}else n=this.getSibling(o,e);n&&n!==o&&(o&&this.toggleOptionFocusedState(o,!1),this.toggleOptionFocusedState(n,!0),this.toggleFocusedProp(s.getData(n,"index"),!0),this.moveFocusedOptionToView(n))}moveFocusedOptionToView(e){const t=e||this.$dropboxContainer.querySelector(".vscomp-option.focused");if(!t)return;let i;const o=this.$optionsContainer.getBoundingClientRect(),n=t.getBoundingClientRect(),r=o.top,a=o.bottom,l=o.height,h=n.top,p=n.bottom,c=n.height,u=t.offsetTop,d=s.getData(this.$options,"top","number");r>h?i=u+d:a{if(e.isDisabled||e.isGroupTitle||!e.isVisible||e.isSelected)return;const{index:t}=e;if(t>o&&t{e(parseInt(t))})}this.setManagedTimeout(()=>{this.renderOptions()},0)}toggleAllOptions(e){if(!this.multiple||this.disableSelectAll)return;const t="boolean"==typeof isSelected?e:!s.hasClass(this.$toggleAllCheckbox,"checked"),i=[],{selectAllOnlyVisible:o}=this;this.options.forEach(e=>{const s=e;if(s.isDisabled||s.isCurrentNew)return;const{isVisible:n,isSelected:r}=s;!t&&(!o||n||!r)||t&&o&&!n&&!r?s.isSelected=!1:(s.isSelected=!0,s.isGroupTitle||i.push(s.value))}),this.toggleAllOptionsClass(t),this.setValue(i),this.renderOptions()}toggleAllOptionsClass(e){if(!this.multiple)return;let t=!1;"boolean"==typeof e||(e=this.isAllOptionsSelected()),!e&&this.selectAllOnlyVisible&&""!==this.searchValue&&(this.visibleOptionsCount>0||""===this.searchValue)&&(t=this.isAllOptionsSelected(!0)),s.toggleClass(this.$toggleAllCheckbox,"checked",e||t),this.isAllSelected=e}isAllOptionsSelected(e){let t=!1;return this.options.length&&this.selectedValues.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&(!e||t.isVisible))),t}isAllGroupOptionsSelected(e){let t=!1;return this.options.length&&(t=!this.options.some(t=>!t.isSelected&&!t.isDisabled&&!t.isGroupTitle&&t.groupIndex===e)),t}toggleGroupOptionsParent(e,t){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;let i=s.getData(e,"groupIndex");void 0!==i&&(i=parseInt(i));const o=this.$options.querySelector(`.vscomp-option[data-index="${i}"]`),n="boolean"==typeof t?t:this.isAllGroupOptionsSelected(i);this.toggleGroupTitleCheckbox(o,n),this.toggleGroupTitleProp(i,n)}toggleGroupTitleProp(e,t){const s="boolean"==typeof t?t:this.isAllGroupOptionsSelected(e);this.toggleSelectedProp(e,s)}toggleGroupOptions(e,i){if(!this.hasOptionGroup||this.disableOptionGroupCheckbox||!e)return;const o=s.getData(e,"index","number"),{selectedValues:n,selectAllOnlyVisible:r}=this,a={},{removeItemFromArray:l}=t;n.forEach(e=>{a[e]=!0}),this.options.forEach(e=>{if(e.isDisabled||e.groupIndex!==o)return;const{value:t}=e;!i||r&&!e.isVisible?(e.isSelected=!1,a[t]&&l(n,t)):(e.isSelected=!0,a[t]||n.push(t))}),this.toggleAllOptionsClass(!!i&&null),this.setValue(n),this.setManagedTimeout(()=>{this.renderOptions()},0)}toggleGroupTitleCheckbox(e,t){if(!e)return;const i=s.getData(e,"index","number");this.toggleSelectedProp(i,t),this.toggleOptionSelectedState(e,t)}toggleFocusedProp(e,t=!1){this.focusedOptionIndex&&this.setOptionProp(this.focusedOptionIndex,"isFocused",!1),this.setOptionProp(e,"isFocused",t),this.focusedOptionIndex=e}toggleSelectedProp(e,t=!1){this.setOptionProp(e,"isSelected",t)}scrollToTop(){const{scrollTop:e}=this.$optionsContainer;e>0&&(this.$optionsContainer.scrollTop=0)}reset(e=!1,t=!1){this.options.forEach(e=>{e.isSelected=!1}),this.beforeValueSet(!0),this.setValue(null,{disableEvent:t,disableValidation:e}),this.afterValueSet(),e&&s.removeClass(this.$allWrappers,"has-error"),s.dispatchEvent(this.$ele,"reset")}addOption(e,t){if(!e)return;this.lastOptionIndex+=1;const s=this.getOptionObj({...e,index:this.lastOptionIndex});this.options.push(s),this.sortedOptions.push(s),t&&(this.visibleOptionsCount+=1,this.afterSetOptions())}removeOption(e){(e||0===e)&&(this.options.splice(e,1),this.lastOptionIndex-=1)}removeNewOption(){const e=this.getNewOption();e&&this.removeOption(e.index)}sortOptions(e){return e.sort((e,t)=>{const s=e.isSelected||e.isAnySelected,i=t.isSelected||t.isAnySelected;return s||i?s&&(!i||e.index{const s=e.options;e.isAnySelected=s.some(e=>e.isSelected),e.isAnySelected&&t(s)}),t(s),this.destructureOptionGroup(s)}isOptionVisible({data:e,searchValue:s,hasExactOption:i,visibleOptionGroupsMapping:o,searchGroup:n,searchByStartsWith:r}){const a=null!=e.valueNormalized?e.valueNormalized:e.value.toLowerCase();let l=e.labelNormalized;if(null==l){const s=(e.label||"").trim();l=this.searchNormalize&&""!==s?t.normalizeString(s).toLowerCase():s.toLowerCase()}const{description:h,alias:p}=e;let{descriptionNormalized:c}=e;if(null==c){const e=h||"";c=this.searchNormalize&&""!==e.trim()?t.normalizeString(e).toLowerCase():e.toLowerCase()}let u=r?l.startsWith(s):l.includes(s);return!e.isGroupTitle||n&&u||(u=o[e.index]),r||!p||u||(u=p.includes(s)),r||!c||u||(u=c.includes(s)),e.isVisible=u,i||(i=l===s||a===s),{isVisible:u,hasExactOption:i}}structureOptionGroup(e){const t=[],s={};return e.forEach(e=>{if(e.isGroupTitle){const i=[];e.options=i,s[e.index]=i,t.push(e)}}),e.forEach(e=>{e.isGroupOption&&s[e.groupIndex].push(e)}),t}destructureOptionGroup(e){let t=[];return e.forEach(e=>{t.push(e),t=t.concat(e.options)}),t}serverSearch(){s.removeClass(this.$allWrappers,"has-no-search-results"),s.addClass(this.$allWrappers,"server-searching"),this.setSelectedOptions(),this.onServerSearch(this.searchValue,this)}removeValue(e){const{selectedValues:i}=this,o=s.getData(e,"value");t.removeItemFromArray(i,o),this.setValueMethod(i)}focus(){this.$wrapper.focus()}enable(){this.$ele.disabled=!1,this.$ele.removeAttribute("disabled"),this.$hiddenInput.removeAttribute("disabled"),s.setAria(this.$wrapper,"disabled",!1),s.changeTabIndex(this.$wrapper,0)}disable(){this.$ele.disabled=!0,this.$ele.setAttribute("disabled",""),this.$hiddenInput.setAttribute("disabled",""),s.setAria(this.$wrapper,"disabled",!0),s.changeTabIndex(this.$wrapper,-1),this.$wrapper.blur()}validate(){if(this.disableValidation)return!0;let e=!1;const{selectedValues:i,minValues:o}=this;return this.required&&(t.isEmpty(i)||this.multiple&&o&&i.length{this.managedTimeouts.delete(s),e()},t);return this.managedTimeouts.add(s),s}clearManagedTimeouts(){this.managedTimeouts&&(this.managedTimeouts.forEach(e=>clearTimeout(e)),this.managedTimeouts.clear())}destroy(){const{$ele:e}=this;e.virtualSelect=void 0,e.value=void 0,e.innerHTML="",l.openInstances.delete(this),this===l.lastInteractedInstance&&(l.lastInteractedInstance=null),this.serverSearchTimeout&&(clearTimeout(this.serverSearchTimeout),this.serverSearchTimeout=null),this.clearManagedTimeouts(),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={}}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=t.replaceDoubleQuotesWithHTML(e),this.$secureDiv.innerHTML):e}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required}toggleOptionSelectedState(e,t){let i=t;void 0===i&&(i=!s.hasClass(e,"selected")),s.toggleClass(e,"selected",i),s.setAria(e,"selected",i)}toggleOptionFocusedState(e,t){e&&(s.toggleClass(e,"focused",t),s.setAttr(e,"tabindex",t?"0":"-1"),document.activeElement!==this.$searchInput&&e.focus(),t&&(s.setAria(this.$wrapper,"activedescendant",e.id),s.setAria(this.$dropboxContainer,"activedescendant",e.id)))}static init(e){let t=e.ele;if(!t)return;let s=!1;if("string"==typeof t){t=document.querySelectorAll(t);const e=t.length;if(0===e)return;1===e&&(s=!0)}void 0!==t.length&&void 0!==t.forEach||(t=[t],s=!0);const i=[];return t.forEach(t=>{t.virtualSelect?i.push(t.virtualSelect):(e.ele=t,"SELECT"===t.tagName&&l.setPropsFromSelect(e),i.push(new l(e)))}),s?i[0]:i}static getAttrProps(){const{convertPropToDataAttr:e}=s,t={};return n.forEach(e=>{t[e]=e}),a.forEach(s=>{t[e(s)]=s}),t}static setPropsFromSelect(e){const t=e.ele,i=[],n=[],a=e=>{const t=[];return Array.from(e.children).forEach(e=>{const{value:s}=e,o={value:s};"OPTGROUP"===e.tagName?(o.label=e.getAttribute("label"),o.options=a(e)):o.label=e.innerHTML,t.push(o),e.disabled&&i.push(s),e.selected&&n.push(s)}),t},l=a(t),h=document.createElement("div");s.setAttrFromEle(t,h,Object.keys(r),o),t.parentNode.insertBefore(h,t),t.remove(),e.ele=h,e.options=l,e.disabledOptions=i,e.selectedValue=n}static onFormReset(e){const t=e.target.closest("form");t&&t.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{e.parentElement.virtualSelect.reset(!0)})}static onFormSubmit(e){l.validate(e.target.closest("form"))||e.preventDefault()}static validate(e){if(!e)return!0;let t=!1;return e.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const s=e.parentElement.virtualSelect.validate();t||s||(t=!0)}),!t}static reset(e=!1,t=!1){this.virtualSelect.reset(e,t)}static setValueMethod(...e){this.virtualSelect.setValueMethod(...e)}static setOptionsMethod(...e){this.virtualSelect.setOptionsMethod(...e)}static setDisabledOptionsMethod(...e){this.virtualSelect.setDisabledOptionsMethod(...e)}static setEnabledOptionsMethod(...e){this.virtualSelect.setEnabledOptionsMethod(...e)}static toggleSelectAll(e){this.virtualSelect.toggleAllOptions(e)}static isAllSelected(){return this.virtualSelect.isAllSelected}static addOptionMethod(e){this.virtualSelect.addOption(e,!0)}static getNewValueMethod(){return this.virtualSelect.getNewValue()}static getDisplayValueMethod(){return this.virtualSelect.getDisplayValue()}static getSelectedOptionsMethod(e){return this.virtualSelect.getSelectedOptions(e)}static getDisabledOptionsMethod(){return this.virtualSelect.getDisabledOptions()}static openMethod(){return this.virtualSelect.openDropbox()}static closeMethod(){return this.virtualSelect.closeDropbox()}static focusMethod(){return this.virtualSelect.focus()}static enableMethod(){return this.virtualSelect.enable()}static disableMethod(){return this.virtualSelect.disable()}static destroyMethod(){return this.virtualSelect.destroy()}static validateMethod(){return this.virtualSelect.validate()}static toggleRequiredMethod(e){return this.virtualSelect.toggleRequired(e)}static onResizeMethod(){document.querySelectorAll(".vscomp-ele-wrapper").forEach(e=>{const t=e.parentElement&&e.parentElement.virtualSelect;t&&t.onResize()})}}document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit);const h=t.throttle(l.onResizeMethod,100);l.onResizeThrottled=h,window.addEventListener("resize",h),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.lastInteractedInstance=null,"undefined"!=typeof NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach)}(),function(){"use strict";function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,s){if(e){if("string"==typeof e)return t(e,s);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,s):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var s=0,i=new Array(t);ss-o-t.width?"left":"right",vertical:n>i-n-t.height?"top":"bottom"}}},{key:"getAbsoluteCoords",value:function(e){if(e){var t=e.getBoundingClientRect(),s=window.pageXOffset,i=window.pageYOffset;return{width:t.width,height:t.height,top:t.top+i,right:t.right+s,bottom:t.bottom+i,left:t.left+s}}}},{key:"getCoords",value:function(e){return e?e.getBoundingClientRect():{}}},{key:"getData",value:function(e,t,s){if(e){var i=e?e.dataset[t]:"";return"number"===s?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}}},{key:"setData",value:function(e,t,s){e&&(e.dataset[t]=s)}},{key:"setStyle",value:function(e,t,s){e&&(e.style[t]=s)}},{key:"show",value:function(e){var s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.setStyle(e,"display",s)}},{key:"hide",value:function(e){t.setStyle(e,"display","none")}},{key:"getHideableParent",value:function(e){for(var t,s=e.parentElement;s;){var i=getComputedStyle(s).overflow;if(-1!==i.indexOf("scroll")||-1!==i.indexOf("auto")){t=s;break}s=s.parentElement}return t}}],s&&function(e,t){for(var s=0;sO?O-b:M:w+p>L&&("right"===E?n="left":w=L+by?y-u:P:C+c>I&&("bottom"===E?n="top":C=I+up-j&&(G=p-j):"left"!==E&&"right"!==E||((H=f/2+g-R)c-j&&(H=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(H),"px, 0) ").concat(K))}s.hide(this.$popperEle)}},{key:"resetPosition",value:function(){s.setStyle(this.$popperEle,"transform","none"),this.setPosition()}},{key:"show",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=t.resetPosition,o=t.data;clearTimeout(this.exitDelayTimeout),clearTimeout(this.hideDurationTimeout),i&&this.resetPosition(),this.enterDelayTimeout=setTimeout(function(){var t=s.getData(e.$popperEle,"left"),i=s.getData(e.$popperEle,"top"),n="translate3d(".concat(parseInt(t),"px, ").concat(parseInt(i),"px, 0)"),r=e.showDuration;s.show(e.$popperEle,"inline-flex"),s.getCoords(e.$popperEle),s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",1),e.showDurationTimeout=setTimeout(function(){"function"==typeof e.afterShowCallback&&e.afterShowCallback(o)},r)},this.enterDelay)}},{key:"hide",value:function(){var e=this,t=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}).data;clearTimeout(this.enterDelayTimeout),clearTimeout(this.showDurationTimeout),this.exitDelayTimeout=setTimeout(function(){if(e.$popperEle){var i=parseInt(s.getData(e.$popperEle,"fromLeft")),o=parseInt(s.getData(e.$popperEle,"fromTop")),n="translate3d(".concat(i,"px, ").concat(o,"px, 0)"),r=e.hideDuration;s.setStyle(e.$popperEle,"transitionDuration",r+"ms"),s.setStyle(e.$popperEle,"transform",n),s.setStyle(e.$popperEle,"opacity",0),e.hideDurationTimeout=setTimeout(function(){s.hide(e.$popperEle),"function"==typeof e.afterHideCallback&&e.afterHideCallback(t)},r)}},this.exitDelay)}},{key:"updatePosition",value:function(){s.setStyle(this.$popperEle,"transitionDuration","0ms"),this.resetPosition();var e=parseInt(s.getData(this.$popperEle,"left")),t=parseInt(s.getData(this.$popperEle,"top"));s.show(this.$popperEle,"inline-flex"),s.setStyle(this.$popperEle,"transform","translate3d(".concat(e,"px, ").concat(t,"px, 0)"))}}],t&&function(e,t){for(var s=0;s1&&void 0!==arguments[1]&&arguments[1]}},{key:"removeArrayEmpty",value:function(e){return Array.isArray(e)&&e.length?e.filter(function(e){return!!e}):[]}},{key:"throttle",value:function(e,t){var s,i=0;return function(){for(var o=arguments.length,n=new Array(o),r=0;re.length)&&(t=e.length);for(var s=0,i=new Array(t);s'),e=this.$popover.querySelector(".pop-comp-arrow")),this.$arrowEle=e}}},{key:"destroy",value:function(){this.removeEvents()}}])&&c(t.prototype,s),o&&c(t,o),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,s,o}();d=m.getAttrProps(),window.PopoverComponent=m}(); \ No newline at end of file diff --git a/src/utils/utils.js b/src/utils/utils.js index d7fc8e6..831cb61 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -228,4 +228,53 @@ export class Utils { static containsHTMLorJS(text) { return /<([a-z]+)[\s\S]*?>|on\w+="[^"]*"/i.test(text); } + + /** + * Rate-limit a function so it runs at most once per `wait` ms (leading + trailing edge). + * Used to keep high-frequency events (e.g. window resize) from running per-instance work + * on every tick. + * @static + * @param {Function} callback + * @param {number} wait + * @return {Function} + * @memberof Utils + */ + static throttle(callback, wait) { + /** @type {ReturnType | null} */ + let timeout = null; + /** @type {unknown[]} */ + let lastArgs = []; + /** @type {unknown} */ + let lastThis; + let previous = 0; + + /** @this {unknown} */ + return function throttled(/** @type {unknown[]} */ ...args) { + const now = Date.now(); + const remaining = wait - (now - previous); + lastArgs = args; + lastThis = this; + + if (remaining <= 0 || remaining > wait) { + if (timeout) { + clearTimeout(timeout); + timeout = null; + } + previous = now; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + } else if (!timeout) { + timeout = setTimeout(() => { + previous = Date.now(); + timeout = null; + callback.apply(lastThis, lastArgs); + /** release references so a large last argument (e.g. a DOM Event) isn't retained */ + lastArgs = []; + lastThis = undefined; + }, remaining); + } + }; + } } diff --git a/src/virtual-select.js b/src/virtual-select.js index 2f0ffc8..5ffdc78 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -302,6 +302,13 @@ export class VirtualSelect { let groupName = ''; if (markSearchResults) { + /** + * Search input is regex-escaped (no ReDoS). The (?!([^<]+)?>) lookahead avoids inserting + * inside a tag; it relies on option labels being escaped via enableSecureText. When + * enableSecureText is off, labels are rendered as raw HTML by design (the consumer opts into + * this), so this highlight does not introduce an additional injection vector beyond the raw + * HTML the consumer already chose to render. + */ searchRegex = new RegExp(`(${Utils.regexEscape(this.searchValue)})(?!([^<]+)?>)`, 'gi'); } @@ -834,7 +841,7 @@ export class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.setSearchValue(''); this.focusSearchInput(); }, 0); @@ -906,7 +913,7 @@ export class VirtualSelect { this.setOptionsTooltip(); if (document.activeElement !== this.$searchInput) { - setTimeout(() => { + this.setManagedTimeout(() => { const focusedOption = DomUtils.getElementsBySelector('.focused', this.$dropboxContainer)[0]; if (focusedOption !== undefined) { focusedOption.focus({ preventScroll: true }); @@ -2557,8 +2564,9 @@ export class VirtualSelect { DomUtils.changeTabIndex(this.$allWrappers, 0); if (!isSilent) { - // Force synchronous layout and style calculation - // Trigger reflow + // INTENTIONAL forced reflow (do not remove as a "no-op"): reading offsetHeight flushes + // the 'transition: none' set above so restoring the transition below does not animate the + // open from a stale layout. Scoped to a single element on open, so the cost is negligible. this.$dropboxContainer.offsetHeight; // eslint-disable-line no-unused-expressions // Restore transitions immediately after reflow this.$dropboxContainer.style.transition = originalTransition; @@ -2981,7 +2989,7 @@ export class VirtualSelect { } /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3148,7 +3156,7 @@ export class VirtualSelect { this.setValue(selectedValues); /** using setTimeout to fix the issue of dropbox getting closed on select */ - setTimeout(() => { + this.setManagedTimeout(() => { this.renderOptions(); }, 0); } @@ -3431,6 +3439,32 @@ export class VirtualSelect { return !hasError; } + /** + * setTimeout wrapper whose pending timers are tracked so they can be cleared on destroy(). + * Prevents callbacks from running against a destroyed instance (stale DOM access / retention). + */ + setManagedTimeout(callback, delay) { + if (!this.managedTimeouts) { + this.managedTimeouts = new Set(); + } + + const id = setTimeout(() => { + this.managedTimeouts.delete(id); + callback(); + }, delay); + + this.managedTimeouts.add(id); + + return id; + } + + clearManagedTimeouts() { + if (this.managedTimeouts) { + this.managedTimeouts.forEach((id) => clearTimeout(id)); + this.managedTimeouts.clear(); + } + } + destroy() { const { $ele } = this; $ele.virtualSelect = undefined; @@ -3451,6 +3485,9 @@ export class VirtualSelect { this.serverSearchTimeout = null; } + // Clear any other pending timeouts so their callbacks don't run on a destroyed instance + this.clearManagedTimeouts(); + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); @@ -3758,9 +3795,17 @@ export class VirtualSelect { return this.virtualSelect.toggleRequired(isRequired); } + // Stable reference to the throttled resize handler is assigned at module init time + // (see `VirtualSelect.onResizeThrottled = ...` near the global resize listener). + static onResizeMethod() { document.querySelectorAll('.vscomp-ele-wrapper').forEach(($ele) => { - $ele.parentElement.virtualSelect.onResize(); + /** guard against wrappers whose instance is mid-teardown / not initialised */ + const instance = $ele.parentElement && $ele.parentElement.virtualSelect; + + if (instance) { + instance.onResize(); + } }); } /** static methods - end */ @@ -3768,7 +3813,13 @@ export class VirtualSelect { document.addEventListener('reset', VirtualSelect.onFormReset); document.addEventListener('submit', VirtualSelect.onFormSubmit); -window.addEventListener('resize', VirtualSelect.onResizeMethod); +/** + * throttle resize so the per-instance height recompute runs at most ~10x/sec during a drag. + * Keep a stable reference on VirtualSelect so the listener can be removed later if needed. + */ +const onResizeThrottled = Utils.throttle(VirtualSelect.onResizeMethod, 100); +VirtualSelect.onResizeThrottled = onResizeThrottled; +window.addEventListener('resize', onResizeThrottled); attrPropsMapping = VirtualSelect.getAttrProps(); window.VirtualSelect = VirtualSelect;