From 57cad49228b6f5daa8f0d9a7177344465b4b6d73 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 00:34:45 +0100 Subject: [PATCH 01/57] fix(a11y): close the dropdown on Escape in every layout (AI-2 / A11Y-02) Escape resolved its containment target to $dropboxWrapper for all non-popup layouts. Under the default `dropboxWrapper: 'self'` there is no $dropboxWrapper, so the guard short-circuited on `undefined` and the key did nothing: on a desktop viewport the dropdown could not be dismissed from the keyboard at all. Pick the element that actually contains the focused node - $dropboxWrapper only when the dropbox is portalled out, $wrapper otherwise. WCAG 2.1.1 Keyboard (A) and 2.1.2 No Keyboard Trap (A). Adds cypress/e2e/a11y-escape-close.cy.ts covering all four layouts (self/desktop, popup, external dropboxWrapper, keepAlwaysOpen); the first three failed before this change. Adds cypress/support/mount.ts, a shared per-test mount helper. (cherry picked from commit dad63ad89a1d0a42605d7482a2806023060e6a3a) --- cypress/e2e/a11y-escape-close.cy.ts | 121 +++++++++++++++++++++++ cypress/support/mount.ts | 48 +++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 12 ++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 12 ++- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 12 ++- 8 files changed, 202 insertions(+), 9 deletions(-) create mode 100644 cypress/e2e/a11y-escape-close.cy.ts create mode 100644 cypress/support/mount.ts diff --git a/cypress/e2e/a11y-escape-close.cy.ts b/cypress/e2e/a11y-escape-close.cy.ts new file mode 100644 index 00000000..4bab4d3e --- /dev/null +++ b/cypress/e2e/a11y-escape-close.cy.ts @@ -0,0 +1,121 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-2 / [A11Y-02] — WCAG 2.1.1 & 2.1.2 (Level A). + * + * Escape only closed the dropdown when an external `dropboxWrapper` existed or the dropdown + * was shown as a popup. With the default `dropboxWrapper: 'self'` on a desktop viewport the + * guard resolved to `this.$dropboxWrapper`, which is `undefined`, so the branch was skipped + * and the dropdown stayed open — leaving keyboard users with no way to dismiss it. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: Escape closes the dropdown (AI-2)', () => { + const mountId = 'vs-a11y-escape'; + + const isExpanded = (expected: boolean) => + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.attr', 'aria-expanded', String(expected)); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('default config (dropboxWrapper: "self", desktop viewport)', () => { + beforeEach(() => { + // Wider than the 576px popup breakpoint, so showAsPopup is false — the broken path. + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(6), search: true })); + }); + + it('closes when Escape is pressed with focus on the search input', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('not.be.visible'); + }); + + it('closes when Escape is pressed with an option focused', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + // ArrowDown from the search input moves the highlight; the option itself takes DOM focus + // in non-search navigation, so target the focused option directly. + cy.get(`#${mountId}`).find('.vscomp-option').first().focus().type('{esc}'); + + isExpanded(false); + }); + + it('returns focus to the combobox after Escape so the user is not stranded', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); + }); + + // The fix reworked which element containment is tested against, so the two layouts that + // already worked are pinned here to prove they still do. + context('popup layout (viewport below the popup breakpoint)', () => { + it('still closes on Escape', () => { + cy.viewport(480, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(6), search: true })); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + }); + }); + + context('external dropboxWrapper', () => { + it('still closes on Escape when the dropbox is portalled out of the wrapper', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => { + const host = win.document.createElement('div'); + host.id = 'vs-a11y-escape-portal'; + win.document.body.appendChild(host); + + mountVs(win, mountId, { + options: makeOptions(6), + search: true, + dropboxWrapper: '#vs-a11y-escape-portal', + }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get('#vs-a11y-escape-portal').find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + + cy.window().then((win) => win.document.getElementById('vs-a11y-escape-portal')?.remove()); + }); + }); + + context('keepAlwaysOpen', () => { + it('ignores Escape, because the dropdown is not dismissible by design', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { options: makeOptions(6), search: true, keepAlwaysOpen: true }), + ); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('be.visible'); + }); + }); +}); diff --git a/cypress/support/mount.ts b/cypress/support/mount.ts new file mode 100644 index 00000000..e8480291 --- /dev/null +++ b/cypress/support/mount.ts @@ -0,0 +1,48 @@ +/** cSpell:ignore vscomp */ + +/** + * Shared mount helper for the accessibility/security regression specs. + * + * The docs site is a docsify SPA, so these specs attach their own throwaway host element + * rather than relying on a demo instance whose props may change with the documentation. + * Mounting per-test keeps each assertion tied to an explicit, minimal configuration. + */ + +export type VsOptions = Record; + +/** Remove a previously mounted host (and its instance) so specs can re-mount idempotently. */ +export function unmountVs(win: Window, mountId: string): void { + const existing = win.document.getElementById(mountId); + + if (!existing) { + return; + } + + // Destroy first: an orphaned instance keeps global listeners registered. + const instance = (existing as unknown as { virtualSelect?: { destroy: () => void } }).virtualSelect; + instance?.destroy(); + existing.remove(); +} + +/** + * Create a fresh host element and initialise a VirtualSelect on it. + * + * @returns the host element the instance was mounted on + */ +export function mountVs(win: Window, mountId: string, options: VsOptions): HTMLElement { + unmountVs(win, mountId); + + const $ele = win.document.createElement('div'); + $ele.id = mountId; + win.document.body.appendChild($ele); + + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, ...options }); + + return $ele; +} + +/** Build a simple list of `count` options, values `o1..oN`. */ +export function makeOptions(count: number): Array<{ label: string; value: string }> { + return Array.from({ length: count }, (_, i) => ({ label: `Option ${i + 1}`, value: `o${i + 1}` })); +} diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 5ab3dec1..afa881b4 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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/dist/virtual-select.js b/dist/virtual-select.js index 42bceeac..39638ff1 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -1137,9 +1137,17 @@ class VirtualSelect { return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 5ab3dec1..afa881b4 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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 42bceeac..39638ff1 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -1137,9 +1137,17 @@ class VirtualSelect { return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 5ab3dec1..afa881b4 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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/virtual-select.js b/src/virtual-select.js index 523cbd45..0ce80740 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -619,9 +619,17 @@ export class VirtualSelect { return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if ( wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && From 06aabd1273dc6221ea594e877389cca9dc078dcf Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 00:50:06 +0100 Subject: [PATCH 02/57] fix(a11y): expose Select All as a checkbox with state and Space activation (AI-3 / A11Y-04) "Select All" rendered as a bare . Assistive technology saw a generic element with no role and no checked state, so every select/deselect was silent, and Space - the expected activation key for a checkbox - fell through to the page and scrolled it. Only Enter worked. - render role="checkbox" aria-checked="false" on .vscomp-toggle-all-button - sync aria-checked in toggleAllOptionsClass(), the single point all selection paths funnel through, so the exposed state cannot drift from the visual one - accept keyCode 32 alongside 13 and preventDefault so Space no longer scrolls WCAG 4.1.2 Name/Role/Value (A), 1.3.1 Info and Relationships (A), 2.1.1 Keyboard (A). Adds cypress/e2e/a11y-select-all.cy.ts (7 cases, all failing before this change), including that aria-checked follows selection driven from the options themselves. (cherry picked from commit f938209a542e375c462da5738b0d543888963290) --- cypress/e2e/a11y-select-all.cy.ts | 101 +++++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 27 +++++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 27 +++++- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 27 +++++- 7 files changed, 176 insertions(+), 12 deletions(-) create mode 100644 cypress/e2e/a11y-select-all.cy.ts diff --git a/cypress/e2e/a11y-select-all.cy.ts b/cypress/e2e/a11y-select-all.cy.ts new file mode 100644 index 00000000..dca4d319 --- /dev/null +++ b/cypress/e2e/a11y-select-all.cy.ts @@ -0,0 +1,101 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-3 / [A11Y-04] — WCAG 4.1.2, 1.3.1 (Level A) and 2.1.1 (Level A). + * + * "Select All" was a bare : exposed to assistive + * technology as a generic element with no role and no checked state, so its state changes were + * inaudible. It also only responded to Enter — Space, the expected activation key for a + * checkbox, scrolled the page instead. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: Select All exposes checkbox semantics (AI-3)', () => { + const mountId = 'vs-a11y-select-all'; + + const toggleAll = () => cy.get(`#${mountId}`).find('.vscomp-toggle-all-button'); + const selectedCount = () => cy.get(`#${mountId}`).then(($e) => $e[0].virtualSelect.selectedValues.length); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), multiple: true, search: true })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('exposes role="checkbox" with an accessible name', () => { + toggleAll().should('have.attr', 'role', 'checkbox'); + toggleAll().should('have.attr', 'aria-label', 'Select All'); + }); + + it('starts unchecked and reports aria-checked="true" once everything is selected', () => { + toggleAll().should('have.attr', 'aria-checked', 'false'); + + toggleAll().click(); + + toggleAll().should('have.attr', 'aria-checked', 'true'); + selectedCount().should('eq', 5); + }); + + it('returns aria-checked to "false" when toggled back off', () => { + toggleAll().click(); + toggleAll().should('have.attr', 'aria-checked', 'true'); + + toggleAll().click(); + + toggleAll().should('have.attr', 'aria-checked', 'false'); + selectedCount().should('eq', 0); + }); + + it('activates on Space, the expected key for a checkbox', () => { + toggleAll().focus().type(' ', { force: true }); + + selectedCount().should('eq', 5); + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); + + it('still activates on Enter', () => { + toggleAll().focus().type('{enter}', { force: true }); + + selectedCount().should('eq', 5); + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); + + it('calls preventDefault on Space so the page does not scroll', () => { + // Synthetic keys never trigger native scrolling, so asserting scrollY would prove nothing. + // The observable contract is that the component consumed the key. + const prevented: boolean[] = []; + + cy.window().then((win) => { + // Bubble phase on document: runs after the component's wrapper handler, so + // defaultPrevented already reflects whatever that handler decided. + win.document.addEventListener('keydown', (e) => { + if (e.keyCode === 32) { + prevented.push(e.defaultPrevented); + } + }); + }); + + toggleAll().focus().type(' ', { force: true }); + + cy.wrap(null).should(() => { + expect(prevented, 'Space keydown seen and defaultPrevented').to.deep.equal([true]); + }); + }); + + it('reflects aria-checked when selection is driven from the options instead', () => { + toggleAll().should('have.attr', 'aria-checked', 'false'); + + // Select every option individually; Select All must follow along. + makeOptions(5).forEach((o) => { + cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${o.value}"]`).click(); + }); + + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index afa881b4..189e5f96 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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/dist/virtual-select.js b/dist/virtual-select.js index 39638ff1..cb6342bf 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -988,7 +988,14 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + checkboxHtml = ` ${this.selectAllText} `; @@ -1132,7 +1139,14 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } @@ -3380,7 +3394,14 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index afa881b4..189e5f96 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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 39638ff1..cb6342bf 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -988,7 +988,14 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + checkboxHtml = ` ${this.selectAllText} `; @@ -1132,7 +1139,14 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } @@ -3380,7 +3394,14 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index afa881b4..189e5f96 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",x=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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/virtual-select.js b/src/virtual-select.js index 0ce80740..2411c002 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -450,7 +450,14 @@ export class VirtualSelect { let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + checkboxHtml = ` ${this.selectAllText} `; @@ -614,7 +621,13 @@ export class VirtualSelect { this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } @@ -3193,7 +3206,15 @@ export class VirtualSelect { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } From 9738f3a2696aaf4eec8136022d97d3b95c31f827 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 01:03:52 +0100 Subject: [PATCH 03/57] feat(a11y): announce status changes through a per-instance live region (AI-6 / A11Y-03) The stylesheet already shipped a .vscomp-live-region rule, but no code ever created the element: the component had zero live regions, so search result counts, "no results", server-search loading and selection changes were conveyed visually only. - render one visually-hidden role="status" aria-live="polite" aria-atomic="true" region per instance, inside the wrapper so it is torn down with the element - announce match counts and no-results while searching, the loading state and outcome of a server search, and every selection change - track filteredOptionsCount separately: setVisibleOptions() overwrites visibleOptionsCount with the size of the virtualisation window, which is not the number of matches - suppress announcements until construction finishes (isInitialized), so an initial value does not speak on page load, and while focus is outside the search input, so closing the dropdown does not read a stale count - identical consecutive messages are left in place, so "No results found" is not repeated on every further non-matching keystroke Announcement strings are new overridable props for localisation: searchResultsText, searchResultText, noOptionsSelectedText, selectedText, loadingText. Documented in docs/properties.md and the JSDoc typings. WCAG 4.1.3 Status Messages (AA). Adds cypress/e2e/a11y-live-region.cy.ts (14 cases, all failing before this change). (cherry picked from commit 82598ce367545676cee102c2919b42c11c74900a) --- cypress/e2e/a11y-live-region.cy.ts | 165 +++++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 111 ++++++++++++++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 111 ++++++++++++++- docs/assets/virtual-select.min.js | 2 +- docs/properties.md | 5 + src/virtual-select.js | 123 +++++++++++++++++ src/virtual-select.types.js | 9 ++ 9 files changed, 525 insertions(+), 5 deletions(-) create mode 100644 cypress/e2e/a11y-live-region.cy.ts diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts new file mode 100644 index 00000000..228d1448 --- /dev/null +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -0,0 +1,165 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-6 / [A11Y-03] — WCAG 4.1.3 Status Messages (AA). + * + * The component shipped a `.vscomp-live-region` rule in the stylesheet but no JavaScript + * ever created the element, so there were zero live regions in the DOM. Search result + * counts, "no results", server-search loading and selection changes were all conveyed + * visually only — a screen reader user typing into the search box heard nothing. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: status announcements via a live region (AI-6)', () => { + const mountId = 'vs-a11y-live'; + + const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), search: true, ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('the region itself', () => { + beforeEach(() => mount()); + + it('creates exactly one polite status region per instance', () => { + liveRegion().should('have.length', 1); + liveRegion().should('have.attr', 'role', 'status'); + liveRegion().should('have.attr', 'aria-live', 'polite'); + // Atomic so the whole message is re-read rather than just the changed words. + liveRegion().should('have.attr', 'aria-atomic', 'true'); + }); + + it('is visually hidden but not hidden from assistive technology', () => { + // aria-hidden / display:none / visibility:hidden would all silence it. + liveRegion().should('not.have.attr', 'aria-hidden'); + liveRegion().should('have.css', 'position', 'absolute'); + liveRegion().invoke('outerWidth').should('be.lessThan', 2); + }); + + it('starts empty so nothing is announced on page load', () => { + liveRegion().should('have.text', ''); + }); + }); + + context('search results', () => { + beforeEach(() => mount()); + + it('announces the number of matches while typing', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option'); + + liveRegion().should('have.text', '5 results available'); + }); + + it('uses the singular form for a single match', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option 3'); + + liveRegion().should('have.text', '1 result available'); + }); + + it('announces the no-results message when the search matches nothing', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('zzzzzz'); + + liveRegion().should('have.text', 'No results found'); + }); + + it('does not announce a stale count when the dropdown is merely closed', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('zzzzzz'); + liveRegion().should('have.text', 'No results found'); + + // Closing resets the search internally; that must not re-announce a result count. + cy.get(`#${mountId}`).find('.vscomp-search-input').type('{esc}'); + + liveRegion().should('not.have.text', '5 results available'); + }); + + it('honours custom result-count text for localisation', () => { + mount({ searchResultsText: 'Treffer verfügbar', searchResultText: 'Treffer verfügbar' }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option'); + + liveRegion().should('have.text', '5 Treffer verfügbar'); + }); + }); + + context('selection changes', () => { + it('announces the selection summary for a multi-select', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + liveRegion().should('have.text', '1 option selected'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + liveRegion().should('have.text', '2 options selected'); + }); + + it('announces the chosen label for a single select', () => { + mount(); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o3"]').click(); + + liveRegion().should('have.text', 'Option 3 selected'); + }); + + it('announces when the selection is cleared', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + liveRegion().should('have.text', '1 option selected'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + liveRegion().should('have.text', 'No options selected'); + }); + + it('announces the result of Select All', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-toggle-all-button').click(); + + liveRegion().should('have.text', '5 options selected'); + }); + + it('does not announce a value supplied at initialisation', () => { + mount({ selectedValue: 'o2' }); + + liveRegion().should('have.text', ''); + }); + }); + + context('lifecycle', () => { + it('removes the region when the instance is destroyed', () => { + mount(); + liveRegion().should('have.length', 1); + + // Scoped to this instance's region: the docs page hosts other instances, and each + // legitimately owns a live region of its own. + liveRegion() + .invoke('attr', 'id') + .then((regionId) => { + cy.window().then((win) => unmountVs(win, mountId)); + + cy.get(`#${mountId}`).should('not.exist'); + cy.get(`#${regionId}`).should('not.exist'); + }); + }); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 189e5f96..4791a9a2 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index cb6342bf..0ecb6cf2 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -672,7 +672,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -763,6 +763,9 @@ class VirtualSelect { +
+ ${this.renderDropbox({ wrapperClasses })} @@ -782,6 +785,7 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); 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'); @@ -1475,6 +1479,12 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1536,6 +1546,9 @@ class VirtualSelect { this.focusOption({ focusFirst: true }); + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1621,6 +1634,12 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1715,6 +1734,12 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -2112,6 +2137,11 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); @@ -2203,6 +2233,15 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } + + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2399,6 +2438,12 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; this.afterSetVisibleOptionsCount(); } @@ -3672,6 +3717,9 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3818,6 +3866,67 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } + + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + const text = message || ''; + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + if (count === 0) { + return this.noSearchResultsText; + } + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + if (count === 0) { + return this.noOptionsSelectedText; + } + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + this.announce(this.getResultsCountMessage()); + } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 189e5f96..4791a9a2 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 cb6342bf..0ecb6cf2 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -672,7 +672,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -763,6 +763,9 @@ class VirtualSelect { +
+ ${this.renderDropbox({ wrapperClasses })} @@ -782,6 +785,7 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); 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'); @@ -1475,6 +1479,12 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1536,6 +1546,9 @@ class VirtualSelect { this.focusOption({ focusFirst: true }); + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1621,6 +1634,12 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1715,6 +1734,12 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -2112,6 +2137,11 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); @@ -2203,6 +2233,15 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } + + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2399,6 +2438,12 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; this.afterSetVisibleOptionsCount(); } @@ -3672,6 +3717,9 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3818,6 +3866,67 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } + + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + const text = message || ''; + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + if (count === 0) { + return this.noSearchResultsText; + } + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + if (count === 0) { + return this.noOptionsSelectedText; + } + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + this.announce(this.getResultsCountMessage()); + } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 189e5f96..4791a9a2 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",x="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(x=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${x}\n ${S}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,showSecureTextWarning:!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])),S=c(h(e[n])),x=e.options,O=!!x,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,x.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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,10);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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bx?x-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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/properties.md b/docs/properties.md index 3b1aef21..48773172 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -105,6 +105,11 @@ Update below properties to change display texts. | optionsSelectedText | String | options selected | Text to use when displaying no.of values selected text (i.e. 3 options selected) | | optionSelectedText | String | option selected | Text to use when displaying no.of values selected text and only one value is selected (i.e. 1 option selected) | | allOptionsSelectedText | String | All | Text to use when displaying all values selected text (i.e. All (10)) | +| searchResultsText | String | results available | Announced in the live region after a search (i.e. 5 results available) | +| searchResultText | String | result available | Singular form of `searchResultsText` (i.e. 1 result available) | +| noOptionsSelectedText | String | No options selected | Announced in the live region when the selection becomes empty | +| selectedText | String | selected | Announced in the live region after a single select choice (i.e. Option 3 selected) | +| loadingText | String | Loading results | Announced in the live region while a server search is in flight | | clearButtonText | String | Clear | Tooltip text for clear button | | moreText | String | more... | Text to show when more than noOfDisplayValues options selected (i.e + 10 more...) | diff --git a/src/virtual-select.js b/src/virtual-select.js index 2411c002..2ea0e6c2 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -57,8 +57,10 @@ const dataProps = [ 'maxValues', 'maxWidth', 'minValues', + 'loadingText', 'moreText', 'noOfDisplayValues', + 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', @@ -75,8 +77,11 @@ const dataProps = [ 'searchGroup', 'searchNormalize', 'searchPlaceholderText', + 'searchResultText', + 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', + 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', @@ -195,6 +200,9 @@ export class VirtualSelect { +
+ ${this.renderDropbox({ wrapperClasses })} `; @@ -216,6 +224,7 @@ export class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); 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'); @@ -997,6 +1006,12 @@ export class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1064,6 +1079,10 @@ export class VirtualSelect { } this.focusOption({ focusFirst: true }); + + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { @@ -1155,6 +1174,12 @@ export class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1257,6 +1282,12 @@ export class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1709,6 +1740,11 @@ export class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { @@ -1820,6 +1856,15 @@ export class VirtualSelect { this.validate(); } + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } + if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2041,6 +2086,12 @@ export class VirtualSelect { } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; this.afterSetVisibleOptionsCount(); } @@ -3539,6 +3590,9 @@ export class VirtualSelect { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); + this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3715,6 +3769,75 @@ export class VirtualSelect { ); } + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + + const text = message || ''; + + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + + if (count === 0) { + return this.noSearchResultsText; + } + + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + + if (count === 0) { + return this.noOptionsSelectedText; + } + + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + + this.announce(this.getResultsCountMessage()); + } + toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; diff --git a/src/virtual-select.types.js b/src/virtual-select.types.js index 42657d2a..9245a071 100644 --- a/src/virtual-select.types.js +++ b/src/virtual-select.types.js @@ -98,6 +98,15 @@ * and only one value is selected (i.e. 1 option selected) * @property {string} [allOptionsSelectedText=All] Text to use when displaying all values selected text * (i.e. All (10)) + * @property {string} [searchResultsText='results available'] Announced in the live region after a search + * (i.e. 5 results available) + * @property {string} [searchResultText='result available'] Singular form of searchResultsText + * (i.e. 1 result available) + * @property {string} [noOptionsSelectedText='No options selected'] Announced in the live region when the + * selection becomes empty + * @property {string} [selectedText=selected] Announced in the live region after a single select choice + * (i.e. Option 3 selected) + * @property {string} [loadingText='Loading results'] Announced in the live region while a server search is in flight * @property {string} [clearButtonText=Clear] Tooltip text for clear button * @property {string} [moreText='more...'] Text to show when more than noOfDisplayValues options selected * (i.e + 10 more...) From d8f4928e49d4f88ffbc8c85f7617955b5d0b427b Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:44:37 +0100 Subject: [PATCH 04/57] fix(a11y): expose required and error state, with an announced message (AI-4 / A11Y-07) `required` was never exposed to assistive technology, and a failed validate() only toggled a `has-error` class that recoloured the toggle button border. There was no aria-required, no aria-invalid, no message and no announcement: the failure was conveyed by colour alone and was silent to screen readers. - aria-required on the wrapper from setEleProps() and kept current by toggleRequired() - aria-invalid toggled in validate() - a text error message element per instance, linked via aria-describedby while in error and announced through the live region added in AI-6 - the message plus a leading warning glyph give the non-colour cue Distinguishes the two failure modes: requiredErrorText for an empty required select, minValuesErrorText (with a {count} placeholder) when fewer than minValues are selected. Both are overridable props, documented in docs/properties.md and the JSDoc typings. Adds DomUtils.toggleAria()/removeAttr(): aria-required and aria-invalid are removed rather than written as "false", since some screen readers verbalise a literal false. WCAG 3.3.1 Error Identification (A), 1.4.1 Use of Colour (A), 4.1.2 Name/Role/Value (A). Adds cypress/e2e/a11y-required-error.cy.ts (12 cases; 11 failed before this change). Also completes the HTMLElement typing for the public element API the component attaches in setEleProps(), so specs can drive it the way consumers do. (cherry picked from commit cf9c6c05b63eacf8ca34fafe06147e8f09860c4c) --- cypress/e2e/a11y-required-error.cy.ts | 149 ++++++++++++++++++++++ cypress/support/index.d.ts | 21 +++ dist-archive/virtual-select-1.3.0.min.css | 2 +- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 96 +++++++++++++- dist/virtual-select.min.css | 2 +- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 96 +++++++++++++- docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- docs/properties.md | 2 + src/sass/partials/virtual-select.scss | 27 ++++ src/utils/dom-utils.js | 38 ++++++ src/virtual-select.js | 65 +++++++++- src/virtual-select.types.js | 4 + 15 files changed, 490 insertions(+), 20 deletions(-) create mode 100644 cypress/e2e/a11y-required-error.cy.ts diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts new file mode 100644 index 00000000..e09dd293 --- /dev/null +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -0,0 +1,149 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-4 / [A11Y-07] — WCAG 3.3.1 (A), 1.4.1 (A) and 4.1.2 (A). + * + * `required` was never exposed: the wrapper carried no aria-required, and a failed + * validate() only toggled a `has-error` class that changed the toggle button's border + * colour. There was no aria-invalid, no error message and no announcement — the failure + * was communicated by colour alone, and not at all to assistive technology. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: required and error state are exposed (AI-4)', () => { + const mountId = 'vs-a11y-required'; + + const wrapper = () => cy.get(`#${mountId}`).find('.vscomp-wrapper'); + const errorMessage = () => cy.get(`#${mountId}`).find('.vscomp-error-message'); + const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); + const validate = () => cy.get(`#${mountId}`).then(($e) => $e[0].validate?.()); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('aria-required', () => { + it('is exposed when the field is required', () => { + mount({ required: true }); + + wrapper().should('have.attr', 'aria-required', 'true'); + }); + + it('is absent when the field is optional', () => { + mount(); + + wrapper().should('not.have.attr', 'aria-required'); + }); + + it('follows toggleRequired() at runtime', () => { + mount(); + wrapper().should('not.have.attr', 'aria-required'); + + cy.get(`#${mountId}`).then(($e) => $e[0].toggleRequired?.(true)); + wrapper().should('have.attr', 'aria-required', 'true'); + + cy.get(`#${mountId}`).then(($e) => $e[0].toggleRequired?.(false)); + wrapper().should('not.have.attr', 'aria-required'); + }); + }); + + context('failed validation', () => { + beforeEach(() => mount({ required: true })); + + it('sets aria-invalid on the combobox', () => { + wrapper().should('not.have.attr', 'aria-invalid'); + + validate(); + + wrapper().should('have.attr', 'aria-invalid', 'true'); + }); + + it('renders a text error message, so the failure is not signalled by colour alone', () => { + validate(); + + errorMessage().should('be.visible'); + errorMessage().should('have.text', 'This field is required'); + }); + + it('associates the message with the combobox via aria-describedby', () => { + validate(); + + errorMessage() + .invoke('attr', 'id') + .then((errorId) => { + wrapper().should('have.attr', 'aria-describedby', errorId); + }); + }); + + it('announces the error', () => { + validate(); + + liveRegion().should('have.text', 'This field is required'); + }); + + it('clears every error affordance once a value is selected', () => { + validate(); + wrapper().should('have.attr', 'aria-invalid', 'true'); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + wrapper().should('not.have.attr', 'aria-invalid'); + wrapper().should('not.have.attr', 'aria-describedby'); + errorMessage().should('not.be.visible'); + }); + + it('honours a custom required message for localisation', () => { + mount({ required: true, requiredErrorText: 'Pflichtfeld' }); + + validate(); + + errorMessage().should('have.text', 'Pflichtfeld'); + }); + }); + + context('minValues', () => { + it('reports how many options are still needed', () => { + mount({ multiple: true, required: true, minValues: 3 }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + validate(); + + errorMessage().should('have.text', 'Select at least 3 options'); + wrapper().should('have.attr', 'aria-invalid', 'true'); + }); + + it('clears once enough options are selected', () => { + mount({ multiple: true, required: true, minValues: 2 }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + validate(); + wrapper().should('have.attr', 'aria-invalid', 'true'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + wrapper().should('not.have.attr', 'aria-invalid'); + }); + }); + + context('disableValidation', () => { + it('leaves aria-invalid and the message alone', () => { + mount({ required: true, disableValidation: true }); + + validate(); + + wrapper().should('not.have.attr', 'aria-invalid'); + errorMessage().should('not.be.visible'); + }); + }); +}); diff --git a/cypress/support/index.d.ts b/cypress/support/index.d.ts index ad1258f3..66d9b7a9 100644 --- a/cypress/support/index.d.ts +++ b/cypress/support/index.d.ts @@ -1,5 +1,26 @@ +/** + * VirtualSelect.setEleProps() attaches the instance and its public API directly onto the + * host element, so specs can drive a component through the same surface consumers use. + */ interface HTMLElement { virtualSelect?: any; + reset?: (formReset?: boolean, disableChangeEvent?: boolean) => void; + setValue?: (value: any, options?: any) => void; + setOptions?: (options: any[], keepValue?: boolean) => void; + setDisabledOptions?: (disabledOptions: any[], keepValue?: boolean) => void; + setEnabledOptions?: (enabledOptions: any[], keepValue?: boolean) => void; + toggleSelectAll?: (isSelectAll?: boolean) => void; + isAllSelected?: () => boolean; + addOption?: (data: any, rerender?: boolean) => void; + getNewValue?: () => any; + getDisplayValue?: () => any; + getSelectedOptions?: (options?: any) => any; + getDisabledOptions?: () => any; + open?: () => void; + close?: () => void; + destroy?: () => void; + validate?: () => boolean; + toggleRequired?: (isRequired: boolean) => void; } declare namespace Cypress { diff --git a/dist-archive/virtual-select-1.3.0.min.css b/dist-archive/virtual-select-1.3.0.min.css index 29fc53eb..80a14cbf 100644 --- a/dist-archive/virtual-select-1.3.0.min.css +++ b/dist-archive/virtual-select-1.3.0.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 4791a9a2..5d9a8889 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 0ecb6cf2..95460b0f 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -452,6 +452,42 @@ class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + DomUtils.getElements($ele).forEach($this => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -672,7 +708,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'loadingText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -766,6 +802,8 @@ class VirtualSelect {
+
+ ${this.renderDropbox({ wrapperClasses })} @@ -786,6 +824,7 @@ class VirtualSelect { this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1640,6 +1679,8 @@ class VirtualSelect { this.noOptionsSelectedText = options.noOptionsSelectedText; this.selectedText = options.selectedText; this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1740,6 +1781,9 @@ class VirtualSelect { noOptionsSelectedText: 'No options selected', selectedText: 'selected', loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1793,6 +1837,8 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -3754,18 +3800,52 @@ class VirtualSelect { return true; } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ - this.multiple && minValues && selectedValues.length < minValues))) { - hasError = true; + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { + /** required minium options not selected */ + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + const text = message || ''; + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3930,6 +4010,14 @@ class VirtualSelect { toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { let isSelected = value; diff --git a/dist/virtual-select.min.css b/dist/virtual-select.min.css index 29fc53eb..80a14cbf 100644 --- a/dist/virtual-select.min.css +++ b/dist/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 4791a9a2..5d9a8889 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 0ecb6cf2..95460b0f 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -452,6 +452,42 @@ class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + DomUtils.getElements($ele).forEach($this => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -672,7 +708,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'loadingText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -766,6 +802,8 @@ class VirtualSelect {
+
+ ${this.renderDropbox({ wrapperClasses })} @@ -786,6 +824,7 @@ class VirtualSelect { this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1640,6 +1679,8 @@ class VirtualSelect { this.noOptionsSelectedText = options.noOptionsSelectedText; this.selectedText = options.selectedText; this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1740,6 +1781,9 @@ class VirtualSelect { noOptionsSelectedText: 'No options selected', selectedText: 'selected', loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1793,6 +1837,8 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -3754,18 +3800,52 @@ class VirtualSelect { return true; } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ - this.multiple && minValues && selectedValues.length < minValues))) { - hasError = true; + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { + /** required minium options not selected */ + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + const text = message || ''; + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3930,6 +4010,14 @@ class VirtualSelect { toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { let isSelected = value; diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 29fc53eb..80a14cbf 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 4791a9a2..5d9a8889 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","loadingText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",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,showSecureTextWarning:!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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:L:w+p>M&&("right"===T?n="left":w=M+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-q)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/properties.md b/docs/properties.md index 48773172..3d0dc004 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -110,6 +110,8 @@ Update below properties to change display texts. | noOptionsSelectedText | String | No options selected | Announced in the live region when the selection becomes empty | | selectedText | String | selected | Announced in the live region after a single select choice (i.e. Option 3 selected) | | loadingText | String | Loading results | Announced in the live region while a server search is in flight | +| requiredErrorText | String | This field is required | Validation message shown and announced when a required select has no value | +| minValuesErrorText | String | Select at least {count} options | Validation message when fewer than minValues are selected; {count} is replaced with minValues | | clearButtonText | String | Clear | Tooltip text for clear button | | moreText | String | more... | Text to show when more than noOfDisplayValues options selected (i.e + 10 more...) | diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index d61d1c01..7b6118b2 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -321,6 +321,25 @@ } } +.vscomp-error-message { + align-items: flex-start; + color: v.$error-color; + display: none; + font-size: v.$font-size-small; + gap: 4px; + line-height: 1.4; + padding-top: 4px; + width: 100%; + + /** shape cue, so the failure is not signalled by colour alone */ + &::before { + content: '\26A0'; + flex: none; + font-size: 1.1em; + line-height: 1.2; + } +} + .vscomp-no-options, .vscomp-no-search-results { align-items: center; @@ -572,6 +591,14 @@ .vscomp-toggle-button { border-color: v.$error-color; } + + /** + * The message is the non-colour cue required by WCAG 1.4.1: the border tint alone + * carried the whole meaning before. The leading glyph adds a second, shape-based cue. + */ + .vscomp-error-message { + display: flex; + } } &.show-value-as-tags { diff --git a/src/utils/dom-utils.js b/src/utils/dom-utils.js index 330e6b6a..53b85230 100644 --- a/src/utils/dom-utils.js +++ b/src/utils/dom-utils.js @@ -132,6 +132,44 @@ export class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + + DomUtils.getElements($ele).forEach(($this) => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to diff --git a/src/virtual-select.js b/src/virtual-select.js index 2ea0e6c2..be7f27bc 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -58,6 +58,7 @@ const dataProps = [ 'maxWidth', 'minValues', 'loadingText', + 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', @@ -70,6 +71,7 @@ const dataProps = [ 'popupDropboxBreakpoint', 'popupPosition', 'position', + 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', @@ -203,6 +205,8 @@ export class VirtualSelect {
+
+ ${this.renderDropbox({ wrapperClasses })} `; @@ -225,6 +229,7 @@ export class VirtualSelect { this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1180,6 +1185,8 @@ export class VirtualSelect { this.noOptionsSelectedText = options.noOptionsSelectedText; this.selectedText = options.selectedText; this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1288,6 +1295,9 @@ export class VirtualSelect { noOptionsSelectedText: 'No options selected', selectedText: 'selected', loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1346,6 +1356,8 @@ export class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -3634,22 +3646,55 @@ export class VirtualSelect { } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if ( - this.required && - (Utils.isEmpty(selectedValues) || + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { /** required minium options not selected */ - (this.multiple && minValues && selectedValues.length < minValues)) - ) { - hasError = true; + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); + return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + + const text = message || ''; + + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3841,6 +3886,14 @@ export class VirtualSelect { toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { diff --git a/src/virtual-select.types.js b/src/virtual-select.types.js index 9245a071..d5e769f7 100644 --- a/src/virtual-select.types.js +++ b/src/virtual-select.types.js @@ -107,6 +107,10 @@ * @property {string} [selectedText=selected] Announced in the live region after a single select choice * (i.e. Option 3 selected) * @property {string} [loadingText='Loading results'] Announced in the live region while a server search is in flight + * @property {string} [requiredErrorText='This field is required'] Validation message shown and announced when a + * required select has no value + * @property {string} [minValuesErrorText='Select at least {count} options'] Validation message when fewer than + * minValues options are selected; {count} is replaced with minValues * @property {string} [clearButtonText=Clear] Tooltip text for clear button * @property {string} [moreText='more...'] Text to show when more than noOfDisplayValues options selected * (i.e + 10 more...) From 3d4c37b84a8e71a529700c2df66e38e07e78a709 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:52:58 +0100 Subject: [PATCH 05/57] feat(security): page-level defaults so a host can enable escaping centrally (AI-1 / SEC-01) Option label/value/description are interpolated into innerHTML and secureText() is a no-op unless enableSecureText is on, which it is not by default. Until now a host application had no way to turn escaping on for every dropdown at once; it had to remember the flag at each call site, and missing one reintroduces DOM XSS for untrusted option text. Adds VirtualSelect.setGlobalDefaults(props) / getGlobalDefaults(), applied under per-instance options: per-instance options > page-level globals > built-in defaults Deliberately non-breaking: the per-instance default for enableSecureText stays off, so consumers who intentionally render HTML/icon labels, and large trusted lists that should not pay the per-option escaping cost, are unaffected. No version bump needed. Because these are defaults rather than overrides, a host that forwards enableSecureText on every init() call must stop forwarding it (or forward true) for the global to take effect. Called out in the method docs, since it decides whether the mechanism actually helps. setGlobalDefaults ignores `ele` and `options`, which are per-instance by nature and would otherwise alias state across instances. Defaults derived from another prop (zIndex from keepAlwaysOpen, and the hasOptionDescription sizing) now resolve through the same precedence chain, so a global drives them too. Documented in docs/methods.md, cross-referenced from the security note in docs/properties.md. Adds cypress/e2e/security-global-defaults.cy.ts (8 cases), covering that a payload still executes with the default config, is neutralised once the global is set, and that an explicit per-instance false opts back out. Existing security specs still pass. (cherry picked from commit 49971b10bc20319e17aa74360d5338ac504e2970) --- cypress/e2e/security-global-defaults.cy.ts | 148 +++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 72 +++++++++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 72 +++++++++- docs/assets/virtual-select.min.js | 2 +- docs/methods.md | 26 ++++ docs/properties.md | 1 + src/virtual-select.js | 67 +++++++++- 9 files changed, 380 insertions(+), 12 deletions(-) create mode 100644 cypress/e2e/security-global-defaults.cy.ts diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts new file mode 100644 index 00000000..28176ff2 --- /dev/null +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -0,0 +1,148 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-1 / [SEC-01] — OWASP A03:2021 (Injection) / DOM XSS. + * + * Option label/value/description are interpolated into innerHTML, and `secureText()` is a + * no-op unless `enableSecureText` is on — which it is not by default. A host application + * previously had no way to turn escaping on for every dropdown at once; it had to remember + * the flag at each of possibly hundreds of call sites. + * + * VirtualSelect.setGlobalDefaults() closes that gap without changing the per-instance + * default, so existing consumers who deliberately render HTML labels are unaffected. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: global defaults for enableSecureText (AI-1)', () => { + const mountId = 'vs-sec-global'; + const payload = ''; + + const resetGlobals = (win: Window) => { + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.setGlobalDefaults({}); + // @ts-expect-error - test marker + win.__vsGlobalXss = undefined; + }; + + const mountWithPayload = (win: Window, extra: Record = {}) => + mountVs(win, mountId, { options: [{ label: payload, value: 'p1' }], ...extra }); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then(resetGlobals); + }); + + afterEach(() => { + cy.window().then((win) => { + unmountVs(win, mountId); + resetGlobals(win); + }); + }); + + it('exposes setGlobalDefaults and getGlobalDefaults', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + expect(win.VirtualSelect.setGlobalDefaults).to.be.a('function'); + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults).to.be.a('function'); + }); + }); + + it('still renders option text as raw HTML by default, so behaviour is unchanged', () => { + cy.window().then((win) => mountWithPayload(win)); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + // The documented, insecure-by-default behaviour: a real element is created. + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] img[src="x"]').should('exist'); + }); + + it('escapes option text for instances created after a global default is set', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + mountWithPayload(win); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"]').should('exist'); + cy.get(`#${mountId}`).find('img[src="x"]').should('not.exist'); + // The payload is visible as text rather than parsed as markup. + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] .vscomp-option-text').should('contain', 'img'); + + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__vsGlobalXss, 'payload must not execute').to.not.eq(true); + }); + }); + + it('lets an explicit per-instance option override the global default', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // Opting back out for a trusted, HTML-rendering list. + mountWithPayload(win, { enableSecureText: false }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] img[src="x"]').should('exist'); + }); + + it('merges successive calls rather than replacing the whole set', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ placeholder: 'Pick one' }); + // @ts-expect-error - bundle global + const globals = win.VirtualSelect.getGlobalDefaults(); + + expect(globals).to.deep.include({ enableSecureText: true, placeholder: 'Pick one' }); + }); + }); + + it('applies to any prop, not just enableSecureText', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ placeholder: 'Choose a value' }); + mountVs(win, mountId, { options: [{ label: 'One', value: '1' }] }); + }); + + // `contain`, not `have.text`: the value template renders with surrounding whitespace. + cy.get(`#${mountId}`).find('.vscomp-value').should('contain', 'Choose a value'); + }); + + it('returns a copy from getGlobalDefaults, so callers cannot mutate internal state', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // @ts-expect-error - bundle global + const globals = win.VirtualSelect.getGlobalDefaults(); + globals.enableSecureText = false; + + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults().enableSecureText).to.eq(true); + }); + }); + + it('suppresses the insecure-by-default console warning when the global default is on', () => { + cy.window().then((win) => { + // @ts-expect-error - internal flag reset so the once-per-page guard does not hide the result + win.VirtualSelect.secureTextWarningShown = false; + cy.spy(win.console, 'warn').as('consoleWarn'); + + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + mountWithPayload(win); + }); + + cy.get('@consoleWarn').should((spy: any) => { + const messages = spy.getCalls().map((c: any) => String(c.args[0])); + expect(messages.filter((m: string) => m.includes('enableSecureText'))).to.have.length(0); + }); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 5d9a8889..837d5f49 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 95460b0f..edbd233a 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -1752,6 +1752,16 @@ class VirtualSelect { * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1787,7 +1797,7 @@ class VirtualSelect { allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1809,11 +1819,17 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -4044,6 +4060,53 @@ class VirtualSelect { } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { + ...props + }; + delete safeProps.ele; + delete safeProps.options; + VirtualSelect.globalDefaults = { + ...VirtualSelect.globalDefaults, + ...safeProps + }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { + ...VirtualSelect.globalDefaults + }; + } static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4274,6 +4337,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 5d9a8889..837d5f49 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 95460b0f..edbd233a 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -1752,6 +1752,16 @@ class VirtualSelect { * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1787,7 +1797,7 @@ class VirtualSelect { allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1809,11 +1819,17 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -4044,6 +4060,53 @@ class VirtualSelect { } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { + ...props + }; + delete safeProps.ele; + delete safeProps.options; + VirtualSelect.globalDefaults = { + ...VirtualSelect.globalDefaults, + ...safeProps + }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { + ...VirtualSelect.globalDefaults + }; + } static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4274,6 +4337,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 5d9a8889..837d5f49 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",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,showSecureTextWarning:!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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/methods.md b/docs/methods.md index f2297014..45075e7a 100644 --- a/docs/methods.md +++ b/docs/methods.md @@ -22,6 +22,7 @@ - [setServerOptions()](#setserveroptions) - [validate()](#validate) - [toggleRequired()](#togglerequired) +- [VirtualSelect.setGlobalDefaults()](#virtualselectsetglobaldefaults) ### Get selected value @@ -268,3 +269,28 @@ To update required property value ```js document.querySelector('#sample-select').toggleRequired(true); ``` + +### VirtualSelect.setGlobalDefaults() + +Set default props applied to every instance created afterwards, so a page-wide policy does not +have to be repeated at each call site. + +The main use is security. Option `label`, `value` and `description` are inserted as raw HTML and +are only escaped when `enableSecureText` is on, which is **not** the default (escaping runs per +option and is measurable on 10k-100k+ lists). If any option text in your app can come from +untrusted input, turn it on once during startup: + +```js +VirtualSelect.setGlobalDefaults({ enableSecureText: true }); +``` + +Notes: + +- These are **defaults, not overrides**. An instance that passes the prop explicitly still wins, + so if your wrapper forwards `enableSecureText` on every `init()` call it must stop doing so (or + forward `true`) for the global to take effect. +- Only instances created **after** the call are affected. Call it before initialising dropdowns. +- Calls **merge**, so unrelated settings can be configured separately. +- `ele` and `options` are ignored, being inherently per-instance. + +Read the current values with `VirtualSelect.getGlobalDefaults()`, which returns a copy. diff --git a/docs/properties.md b/docs/properties.md index 3d0dc004..1017d02d 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -7,6 +7,7 @@ > - Set **`enableSecureText: true`** whenever options may contain user-supplied/untrusted text. It escapes the built-in option fields (**label**, **value**, and **description**). Note: `customData` is stored as-is (except where the library itself interpolates it, e.g. into the option `aria-label`), and any HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized — escape those yourself. > - It is **off by default on purpose**: escaping runs per option and adds measurable cost on **large datasets (10k–100k+ records)**. For large lists of *trusted, developer-controlled* data you can leave it off. > - When it is off, the plugin logs a **one-time** console warning (per page) on initialization so the trade-off is discoverable. Set **`showSecureTextWarning: false`** to suppress it once you have consciously accepted the trade-off. +> - To turn escaping on for **every** dropdown at once instead of per call site, use [`VirtualSelect.setGlobalDefaults({ enableSecureText: true })`](methods.md#virtualselectsetglobaldefaults) during startup. Note it sets a *default*: an instance passing `enableSecureText` explicitly still wins. | Name | Type | Default value | Description | | --------------------------------- | ----------------- | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | diff --git a/src/virtual-select.js b/src/virtual-select.js index be7f27bc..4c5cefde 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1266,6 +1266,17 @@ export class VirtualSelect { * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = (key) => (options[key] !== undefined ? options[key] : globalDefaults[key]); + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); + const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1301,7 +1312,7 @@ export class VirtualSelect { allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1324,12 +1335,17 @@ export class VirtualSelect { hideDuration: 200, }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { @@ -3927,6 +3943,48 @@ export class VirtualSelect { } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { ...props }; + delete safeProps.ele; + delete safeProps.options; + + VirtualSelect.globalDefaults = { ...VirtualSelect.globalDefaults, ...safeProps }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { ...VirtualSelect.globalDefaults }; + } + static init(options) { let $eleArray = options.ele; @@ -4208,6 +4266,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; From da2a7d7b22d822c23c49c9bda2f018d3cb1f7d25 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:55:07 +0100 Subject: [PATCH 06/57] fix(a11y): advertise multi-selection on the listbox (AI-10 / A11Y-06) The options container carried role="listbox" but no aria-multiselectable, so assistive technology presented a multi-select dropdown with single-select semantics: users had no way to know more than one option could be chosen. Emit aria-multiselectable="true" only in multiple mode; a single select correctly omits the attribute rather than declaring "false". WCAG 4.1.2 Name, Role, Value (A). Adds cypress/e2e/a11y-listbox-multiselectable.cy.ts, including the case where `multiple` comes from the host element's attribute rather than the options object. (cherry picked from commit 4e8be9937dc489210f8157354b62a56867f329db) --- .../e2e/a11y-listbox-multiselectable.cy.ts | 57 +++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 3 +- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 3 +- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 3 +- 7 files changed, 66 insertions(+), 6 deletions(-) create mode 100644 cypress/e2e/a11y-listbox-multiselectable.cy.ts diff --git a/cypress/e2e/a11y-listbox-multiselectable.cy.ts b/cypress/e2e/a11y-listbox-multiselectable.cy.ts new file mode 100644 index 00000000..b19f9e27 --- /dev/null +++ b/cypress/e2e/a11y-listbox-multiselectable.cy.ts @@ -0,0 +1,57 @@ +/** cSpell:ignore vscomp multiselectable */ + +/** + * Regression test for AI-10 / [A11Y-06] — WCAG 4.1.2 (A). + * + * The options container carries role="listbox" but never advertised that more than one + * option could be chosen, so assistive technology presented a multi-select dropdown with + * single-select semantics. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: listbox advertises multi-selection (AI-10)', () => { + const mountId = 'vs-a11y-multiselectable'; + + const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('sets aria-multiselectable="true" in multiple mode', () => { + mount({ multiple: true }); + + listbox().should('have.attr', 'role', 'listbox'); + listbox().should('have.attr', 'aria-multiselectable', 'true'); + }); + + it('omits aria-multiselectable for a single select', () => { + mount(); + + listbox().should('have.attr', 'role', 'listbox'); + listbox().should('not.have.attr', 'aria-multiselectable'); + }); + + it('still applies when multiple comes from the element attribute', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => { + const $ele = win.document.createElement('div'); + $ele.id = mountId; + $ele.setAttribute('multiple', ''); + win.document.body.appendChild($ele); + + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, options: makeOptions(5) }); + }); + + listbox().should('have.attr', 'aria-multiselectable', 'true'); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 837d5f49..96d7c5fb 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index edbd233a..3ab636e1 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -854,7 +854,8 @@ class VirtualSelect {
-
+
diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 837d5f49..96d7c5fb 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 edbd233a..3ab636e1 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -854,7 +854,8 @@ class VirtualSelect {
-
+
diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 837d5f49..96d7c5fb 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/virtual-select.js b/src/virtual-select.js index 4c5cefde..21e0f176 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -263,7 +263,8 @@ export class VirtualSelect {
-
+
From 1f977b34cba10f58b567b80e871105c5e9962aa9 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:58:37 +0100 Subject: [PATCH 07/57] fix(a11y): raise Select All and tag clear buttons to the 24x24 target minimum (AI-11 / A11Y-13) Two pointer targets were below the WCAG minimum: "Select All" collapsed to its 25x15 content box, and the per-tag clear button was 20x20 - under half the required area for users with limited dexterity. - add $min-target-size (24px) and route $value-tag-clear-width through it, so the clear button and the tag content's width calc stay consistent from one variable - give .vscomp-toggle-all-button a min-height/min-width floor rather than a fixed size, so the hit area grows without scaling the checkbox glyph inside it RTL needs no counterpart: rtl.scss only adjusts alignment and spacing, not sizes. WCAG 2.5.8 Target Size (Minimum), AA. Adds cypress/e2e/a11y-target-size.cy.ts. Alongside the three size assertions (which failed before this change) it pins two behaviours, so a future size change cannot leak into layout or break the control: the clear button still removes its own tag, and the visible tag stays compact. (cherry picked from commit 73c088c2fc7a46e1707698261699f3c23c515f6d) --- cypress/e2e/a11y-target-size.cy.ts | 90 +++++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.css | 2 +- dist/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.css | 2 +- src/sass/partials/variable.scss | 4 +- src/sass/partials/virtual-select.scss | 7 ++ 6 files changed, 103 insertions(+), 4 deletions(-) create mode 100644 cypress/e2e/a11y-target-size.cy.ts diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts new file mode 100644 index 00000000..b513725e --- /dev/null +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -0,0 +1,90 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-11 / [A11Y-13] — WCAG 2.5.8 Target Size (Minimum), AA. + * + * Two controls were smaller than the 24x24 CSS px minimum: the "Select All" checkbox + * (measured 25x15) and the per-tag clear button (20x20). Both are pointer targets, so + * users with limited dexterity had to hit a target under half the required area. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +const MIN_TARGET = 24; + +describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { + const mountId = 'vs-a11y-target-size'; + + /** Assert both dimensions of the first match are at least 24 CSS px. */ + const assertMinTarget = (selector: string, label: string) => { + cy.get(`#${mountId}`) + .find(selector) + .first() + .then(($el) => { + const rect = $el[0].getBoundingClientRect(); + + expect(rect.width, `${label} width`).to.be.at.least(MIN_TARGET); + expect(rect.height, `${label} height`).to.be.at.least(MIN_TARGET); + }); + }; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('gives the Select All checkbox a large enough target', () => { + mount({ multiple: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + assertMinTarget('.vscomp-toggle-all-button', 'Select All button'); + }); + + it('gives the Select All checkbox a large enough target without a search input', () => { + mount({ multiple: true, search: false }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + assertMinTarget('.vscomp-toggle-all-button', 'Select All button (no search)'); + }); + + it('gives each tag clear button a large enough target', () => { + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get(`#${mountId}`).find('.vscomp-value-tag-clear-button').should('exist'); + assertMinTarget('.vscomp-value-tag-clear-button', 'tag clear button'); + }); + + it('keeps the tag clear button usable: it still removes its tag', () => { + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + cy.get(`#${mountId}`).find('.vscomp-value-tag').should('have.length', 2); + + cy.get(`#${mountId}`).find('.vscomp-value-tag-clear-button').first().click(); + + cy.get(`#${mountId}`).find('.vscomp-value-tag').should('have.length', 1); + }); + + it('does not enlarge the tag itself beyond its content', () => { + // The target grows, the visual tag should stay compact - a regression here would mean + // the fix leaked into layout rather than the hit area. + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get(`#${mountId}`) + .find('.vscomp-value-tag') + .first() + .then(($tag) => { + expect($tag[0].getBoundingClientRect().height, 'tag height').to.be.lessThan(40); + }); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.css b/dist-archive/virtual-select-1.3.0.min.css index 80a14cbf..408fe4db 100644 --- a/dist-archive/virtual-select-1.3.0.min.css +++ b/dist-archive/virtual-select-1.3.0.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist/virtual-select.min.css b/dist/virtual-select.min.css index 80a14cbf..408fe4db 100644 --- a/dist/virtual-select.min.css +++ b/dist/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 80a14cbf..408fe4db 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/src/sass/partials/variable.scss b/src/sass/partials/variable.scss index 28334fa3..e7bd48eb 100644 --- a/src/sass/partials/variable.scss +++ b/src/sass/partials/variable.scss @@ -19,7 +19,9 @@ $search-height: 40px; $checkbox-full-width: 25px; $new-option-icon-width: 30px; $search-clear-width: 30px; -$value-tag-clear-width: 20px; +/** WCAG 2.5.8 Target Size (Minimum), AA - floor for pointer targets */ +$min-target-size: 24px; +$value-tag-clear-width: $min-target-size; $option-height: 40px; $arrow-width: 30px; $arrow-size: 8px; diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 7b6118b2..3e8ffad3 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -446,6 +446,13 @@ align-items: center; cursor: pointer; display: flex; + /** + * WCAG 2.5.8: the button previously collapsed to its 25x15 content box. + * A min-* floor grows the hit area without scaling the checkbox glyph inside it. + */ + justify-content: center; + min-height: v.$min-target-size; + min-width: v.$min-target-size; } .vscomp-search-input, From ea14b7a453c6bae79393777b5bbdf96b9b6247db Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 13:34:19 +0100 Subject: [PATCH 08/57] fix(a11y): navigate options with the arrows from the search input (AI-7 / A11Y-01 + A11Y-05) Opening the dropdown focuses the search input, and both arrow handlers early-returned in exactly that state so the caret could move. The consequence was that in the default flow the arrows did nothing at all: no option could ever be highlighted from the keyboard, and nothing was announced. A user had to discover an undocumented Tab into the listbox first. WCAG 2.1.1 (A). The highlight was also published as aria-activedescendant on the wrapper and on $dropboxContainer - a plain div with no role, where the attribute is meaningless - and never on the element that actually held focus, so the active option was not conveyed even once navigation did work. WCAG 4.1.2 (A). - Up/Down now drive the list while DOM focus stays in the field (WAI-ARIA APG editable-combobox), via a shared navigateOptions() - the search input becomes a combobox over the listbox: role="combobox", aria-autocomplete="list", aria-expanded kept in sync on open/close, and aria-controls pointing at the options container, which needed an id - aria-activedescendant is written to the wrapper and the search input through one setActiveDescendant() helper, and no longer to the role-less container; it is cleared when the highlight is removed and when the dropdown closes BEHAVIOUR CHANGE, user-visible: Up/Down in the search input no longer move the text caret. Home/End and Left/Right do, and are unchanged. This reverses a deliberate earlier decision, because that decision is what caused the Level A failure above. It must be called out in the 1.4.0 release notes. Adds cypress/e2e/a11y-search-arrow-navigation.cy.ts (12 cases; 9 failed before this change), opted into testIsolation so leftover focus between cases cannot make the focus assertions flaky. examples.cy.ts updates, all test-side, none loosening a real assertion: - aria-activedescendant assertions retargeted from the role-less container to the combobox, plus a new assertion that the container does not carry it. The old assertion encoded the A11Y-05 defect. - the Up/Down caret cases moved to Home/End, with added assertions that the arrows now highlight an option and that focus stays in the field. The old cases encoded A11Y-01. - press counts reduced by one where the first press used to be swallowed, and a known starting state added per keyboard case since cy.open() toggles. - one racy press replaced with a real key press: the virtualiser replaces .vscomp-option nodes on every render, so chaining .type() onto them races the rebuild. Suite: 306 tests, 304 pass, 2 fail. Both remaining failures are pre-existing and fail identically at baseline 992f6a9; a third baseline failure ("keeps focus on the last option when navigating past the end of the list") is fixed by this change. Also adds the versioned post-remediation assessment (AUDIT-REPORT-v1.4.0.md) and updates ACTION-ITEMS.md with status plus five follow-ups, notably that SEC-01 is still live for the OutSystems wrapper because it forwards enableSecureText explicitly. (cherry picked from commit 5dd2a4eafa9411e031c29a9c4f6c0e276bc46049) --- .../e2e/a11y-search-arrow-navigation.cy.ts | 207 ++++++++++++++++++ cypress/e2e/a11y-target-size.cy.ts | 12 +- cypress/e2e/examples.cy.ts | 106 ++++++--- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 74 ++++--- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 74 ++++--- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 72 +++--- 9 files changed, 429 insertions(+), 122 deletions(-) create mode 100644 cypress/e2e/a11y-search-arrow-navigation.cy.ts diff --git a/cypress/e2e/a11y-search-arrow-navigation.cy.ts b/cypress/e2e/a11y-search-arrow-navigation.cy.ts new file mode 100644 index 00000000..7cf0db7b --- /dev/null +++ b/cypress/e2e/a11y-search-arrow-navigation.cy.ts @@ -0,0 +1,207 @@ +/** cSpell:ignore vscomp activedescendant combobox autocomplete */ + +/** + * Regression test for AI-7 / [A11Y-01 + A11Y-05] — WCAG 2.1.1 (A) and 4.1.2 (A). + * + * Opening the dropdown puts focus in the search input, and both arrow handlers + * early-returned in that state, so ArrowDown/ArrowUp did nothing at all: no option was + * highlighted and nothing was announced. Users had to discover an undocumented Tab into + * the listbox first. + * + * The highlight was also published as aria-activedescendant on the wrapper and on the + * role-less $dropboxContainer, never on the element that actually had focus, so even when + * navigation did work the active option was not conveyed. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +/** + * testIsolation is disabled project-wide, but these cases repeatedly open, filter and close + * a dropdown while asserting on focus. Leftover focus and pending re-renders from a previous + * case leak across tests and make the focus assertions flaky for reasons unrelated to the + * component, so this spec asks for a clean page per test. + */ +describe('A11y: arrow-key navigation from the search input (AI-7)', { testIsolation: true }, () => { + const mountId = 'vs-a11y-search-arrows'; + + const searchInput = () => cy.get(`#${mountId}`).find('.vscomp-search-input'); + const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); + const focusedOption = () => cy.get(`#${mountId}`).find('.vscomp-option.focused'); + + /** aria-activedescendant on the search input must name the highlighted option. */ + const assertActiveDescendantMatchesHighlight = () => { + focusedOption() + .invoke('attr', 'id') + .then((optionId) => { + expect(optionId, 'highlighted option has an id').to.be.a('string'); + searchInput().should('have.attr', 'aria-activedescendant', optionId); + }); + }; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), search: true, ...extra })); + }; + + const open = () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + searchInput().focus(); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('search input semantics', () => { + beforeEach(() => { + mount(); + open(); + }); + + it('is a combobox controlling the listbox', () => { + searchInput().should('have.attr', 'role', 'combobox'); + searchInput().should('have.attr', 'aria-autocomplete', 'list'); + + listbox() + .invoke('attr', 'id') + .then((listboxId) => { + expect(listboxId, 'listbox has an id to point at').to.be.a('string'); + searchInput().should('have.attr', 'aria-controls', listboxId); + }); + }); + + it('reports the expanded state', () => { + searchInput().should('have.attr', 'aria-expanded', 'true'); + + searchInput().type('{esc}'); + + searchInput().should('have.attr', 'aria-expanded', 'false'); + }); + + it('does not publish the highlight on the role-less dropbox container', () => { + searchInput().type('{downarrow}'); + + // aria-activedescendant on an element with no listbox/combobox role is meaningless. + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('not.have.attr', 'aria-activedescendant'); + }); + }); + + context('ArrowDown / ArrowUp', () => { + beforeEach(() => { + mount(); + open(); + }); + + it('highlights the first option on ArrowDown and announces it', () => { + searchInput().type('{downarrow}'); + + focusedOption().should('have.attr', 'data-value', 'o1'); + assertActiveDescendantMatchesHighlight(); + }); + + it('keeps DOM focus in the search input, so typing continues to work', () => { + searchInput().type('{downarrow}'); + + // The point of driving the highlight by aria-activedescendant: focus never leaves + // the field, so the user can keep filtering. + cy.focused().should('have.class', 'vscomp-search-input'); + + // Deliberately a single character. Each keystroke re-renders the option list and can + // trigger a scroll-driven re-render on top of that, which Cypress's batched typing + // outruns - a multi-character type() here drops characters and makes the test flaky + // for reasons that have nothing to do with the component. One character proves the + // contract: the field still receives input and the highlight follows the filtered set. + searchInput().type('4'); + + searchInput().should('have.value', '4'); + cy.focused().should('have.class', 'vscomp-search-input'); + focusedOption().should('have.attr', 'data-value', 'o4'); + }); + + it('moves down through the options', () => { + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o1'); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o2'); + assertActiveDescendantMatchesHighlight(); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o3'); + }); + + it('moves back up through the options', () => { + searchInput().type('{downarrow}{downarrow}{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o3'); + + searchInput().type('{uparrow}'); + + focusedOption().should('have.attr', 'data-value', 'o2'); + assertActiveDescendantMatchesHighlight(); + }); + + it('selects the highlighted option with Enter', () => { + searchInput().type('{downarrow}{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o2'); + + searchInput().type('{enter}'); + + cy.get(`#${mountId}`).then(($e) => { + expect($e[0].virtualSelect.selectedValues).to.deep.equal(['o2']); + }); + }); + + it('tracks the filtered set after typing', () => { + searchInput().type('Option 4'); + + searchInput().type('{downarrow}'); + + focusedOption().should('have.attr', 'data-value', 'o4'); + assertActiveDescendantMatchesHighlight(); + }); + + it('clears aria-activedescendant when the dropdown closes', () => { + searchInput().type('{downarrow}'); + searchInput().should('have.attr', 'aria-activedescendant').and('not.be.empty'); + + searchInput().type('{esc}'); + + cy.get(`#${mountId}`) + .find('.vscomp-search-input') + .should(($input) => { + expect($input.attr('aria-activedescendant') || '').to.equal(''); + }); + }); + }); + + context('multi-select', () => { + it('navigates and selects without closing the dropdown', () => { + mount({ multiple: true }); + open(); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o1'); + searchInput().type('{enter}'); + + searchInput().type('{downarrow}'); + searchInput().type('{enter}'); + + cy.get(`#${mountId}`).then(($e) => { + expect($e[0].virtualSelect.selectedValues).to.have.members(['o1', 'o2']); + }); + searchInput().should('have.attr', 'aria-expanded', 'true'); + }); + }); + + context('keyboard navigation without a search input', () => { + it('still works when search is disabled', () => { + mount({ search: false }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { keyCode: 40, which: 40 }); + + focusedOption().should('exist'); + }); + }); +}); diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts index b513725e..c80e3b48 100644 --- a/cypress/e2e/a11y-target-size.cy.ts +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -15,7 +15,13 @@ const MIN_TARGET = 24; describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { const mountId = 'vs-a11y-target-size'; - /** Assert both dimensions of the first match are at least 24 CSS px. */ + /** + * Assert both dimensions of the first match are at least 24 CSS px. + * + * getBoundingClientRect() returns fractional values (a 24px box can measure + * 23.999998 under device-pixel rounding), so compare on rounded values - otherwise the + * assertion fails on sub-pixel noise rather than on a real target-size problem. + */ const assertMinTarget = (selector: string, label: string) => { cy.get(`#${mountId}`) .find(selector) @@ -23,8 +29,8 @@ describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { .then(($el) => { const rect = $el[0].getBoundingClientRect(); - expect(rect.width, `${label} width`).to.be.at.least(MIN_TARGET); - expect(rect.height, `${label} height`).to.be.at.least(MIN_TARGET); + expect(Math.round(rect.width), `${label} width`).to.be.at.least(MIN_TARGET); + expect(Math.round(rect.height), `${label} height`).to.be.at.least(MIN_TARGET); }); }; diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 08f8f2b3..656caf47 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -161,10 +161,19 @@ describe('Accessibility attributes - virtualized options metadata', () => { .should('exist') .as('listboxContainer'); + // aria-activedescendant belongs on the element that holds focus and has a role that + // supports it - here the role="combobox" wrapper. It used to be asserted on + // .vscomp-dropbox-container, a plain div with no role, where it is meaningless + // (audit A11Y-05). That container is now checked for its *absence* below. + cy.getVs(id) + .find('.vscomp-ele-wrapper') + .should('exist') + .as('activeDescendantHost'); + cy.getDropbox(null, id) .parent('.vscomp-dropbox-container') .should('exist') - .as('listboxRegion'); + .as('roleLessContainer'); // Get the combobox wrapper ID for reference cy.getVs(id) @@ -195,12 +204,15 @@ describe('Accessibility attributes - virtualized options metadata', () => { .invoke('attr', 'id') .as('firstOptionId'); - // Verify aria-activedescendant is set on listbox container when option is focused + // Verify aria-activedescendant names the focused option on the combobox cy.get('@firstOptionId').then((firstOptionId) => { - cy.get('@listboxRegion') + cy.get('@activeDescendantHost') .should('have.attr', 'aria-activedescendant', firstOptionId); }); + // ...and is not published on the role-less container (audit A11Y-05) + cy.get('@roleLessContainer').should('not.have.attr', 'aria-activedescendant'); + // Navigate to second option using arrow key cy.get('@firstOption').type('{downarrow}'); cy.wait(100); // Wait for focus to update @@ -219,7 +231,7 @@ describe('Accessibility attributes - virtualized options metadata', () => { // Verify aria-activedescendant updates to second option cy.get('@secondOptionId').then((secondOptionId) => { - cy.get('@listboxRegion') + cy.get('@activeDescendantHost') .should('have.attr', 'aria-activedescendant', secondOptionId); }); @@ -230,31 +242,39 @@ describe('Accessibility attributes - virtualized options metadata', () => { /** - * Arrow key behavior tests for search input - * Tests the fix that allows normal cursor movement in search input - * while preserving option navigation when focus moves away from search + * Arrow key behavior tests for search input. + * + * Up/Down in the search input navigate the option list (WAI-ARIA APG editable-combobox), + * which is what audit finding A11Y-01 required: they used to be swallowed so that no option + * could ever be highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in + * the field is served by Left/Right and Home/End, covered by the suites below. */ describe('Arrow key behavior in search input - cursor movement', () => { const idMultiple = 'multiple-select' - it('should allow cursor movement to beginning with up arrow in search input', () => { + it('moves the caret to the beginning with Home, and navigates options with Up arrow', () => { cy.open(idMultiple); // Type some text in search input cy.getVs(idMultiple).typeValue('ption 9', true); - // Press Up arrow - should move cursor to beginning - cy.getVs(idMultiple).pressKeys('ArrowUp'); + // Home moves the caret to the beginning (Up arrow now drives the option list instead) + cy.getVs(idMultiple).pressKeys('Home'); // Type 'O' at cursor position (should be at beginning) cy.getVs(idMultiple).typeValue('O'); // Verify the text has 'O' at the beginning cy.getVs(idMultiple).checkOptionLabelExists('Option 9'); + + // Up/Down highlight an option without taking focus out of the field + cy.getVs(idMultiple).pressKeys('ArrowDown'); + cy.getDropbox(null, idMultiple).find('.vscomp-option.focused').should('exist'); + cy.checkActiveElementHasClass('vscomp-search-input'); }); - it('should allow cursor movement to end with down arrow in search input', () => { - // Clear and test Down arrow - use actual dropdown data + it('moves the caret to the end with End key in search input', () => { + // Clear and test End - use actual dropdown data cy.getVs(idMultiple).typeValue('Option 1', true); - // Press Down arrow - should move cursor to end - cy.getVs(idMultiple).pressKeys('ArrowDown'); + // End moves the caret to the end (Down arrow now drives the option list instead) + cy.getVs(idMultiple).pressKeys('End'); // Type '0' at cursor position (should be at end, making "Option 10") cy.getVs(idMultiple).typeValue('0'); // Verify the text has '0' at the end @@ -343,18 +363,22 @@ describe('Arrow key behavior - Home and End keys in search input', () => { describe('Arrow key behavior - focus management and accessibility', () => { const idMultiple = 'multiple-select' - it('should allow normal text editing with arrow keys in search', () => { + it('should allow normal text editing in search while arrows navigate the list', () => { cy.open(idMultiple); // Clear and test more text editing using realistic data cy.getVs(idMultiple).typeValue('tion 123', true); - // Use Up arrow to go to beginning - cy.getVs(idMultiple).pressKeys('ArrowUp'); + // Home goes to the beginning (Up/Down are option navigation, per A11Y-01) + cy.getVs(idMultiple).pressKeys('Home'); cy.getVs(idMultiple).typeValue('Op'); cy.getVs(idMultiple).checkOptionLabelExists('Option 123'); - // Use Down arrow to go to end - cy.getVs(idMultiple).pressKeys('ArrowDown'); + // End goes back to the end + cy.getVs(idMultiple).pressKeys('End'); cy.getVs(idMultiple).typeValue('44'); cy.getVs(idMultiple).checkOptionLabelExists('Option 12344'); + + // Editing stays possible because navigation never moves DOM focus off the input + cy.getVs(idMultiple).pressKeys('ArrowDown'); + cy.checkActiveElementHasClass('vscomp-search-input'); }); it('should close multiple-select dropdown', () => { @@ -548,12 +572,16 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + // One press reaches the group title. This needed two before the A11Y-01 fix, because + // the first ArrowDown was swallowed while the search input held focus. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getDropbox(null, id) @@ -573,11 +601,14 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).pressKeys(['ArrowDown', 'ArrowDown']); + cy.getVs(id).pressKeys('ArrowDown'); cy.getVs(id).pressKeys('Enter'); cy.getVs(id).hasValueText('3 options selected'); cy.getVs(id).pressKeys('Enter'); @@ -588,6 +619,9 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); @@ -614,23 +648,24 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); - cy.getDropbox(null, id) - .find('.vscomp-option.group-title') - .first() - .should('have.class', 'focused') - .type('{downarrow}'); + cy.getDropbox(null, id).find('.vscomp-option.group-title').first().should('have.class', 'focused'); - cy.getDropbox(null, id) - .find('.vscomp-option[data-value="1-1"]') - .should('have.class', 'focused') - .type('{enter}'); + /** pressKeys() sends a real key press to the search input rather than chaining .type() + * onto an option node: the virtualiser replaces those nodes on every render, which + * fails the command with "the page updated while this command was executing". */ + cy.getVs(id).pressKeys('ArrowDown'); + cy.getDropbox(null, id).find('.vscomp-option[data-value="1-1"]').should('have.class', 'focused'); + + cy.getVs(id).pressKeys('Enter'); cy.getVs(id).hasValueText('Option 1-1'); }); @@ -639,14 +674,19 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); - Cypress._.times(11, () => { + /** Deliberately more presses than there are rows: navigation clamps at the end, which + * is the "navigating past the end" case under test, and this avoids hard-coding a count + * that shifts whenever the demo's option list changes. */ + Cypress._.times(20, () => { cy.getDropbox(null, id).find('.vscomp-option.focused').type('{downarrow}'); }); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 96d7c5fb..aa47eb9b 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 3ab636e1..496ac36d 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -854,7 +854,8 @@ class VirtualSelect {
-
@@ -1052,7 +1053,9 @@ class VirtualSelect { ${this.searchFormLabel} + id="vscomp-search-input-${this.uniqueId}" + role="combobox" aria-autocomplete="list" aria-expanded="false" + aria-controls="vscomp-options-container-${this.uniqueId}"> ×`; } const html = `
@@ -1223,33 +1226,34 @@ class VirtualSelect { this.openDropbox(); } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction: 'next' + direction }); } else { this.openDropbox(); } } + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); - if (this.isOpened()) { - this.focusOption({ - direction: 'previous' - }); - } else { - this.openDropbox(); - } + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -3073,6 +3077,8 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3132,9 +3138,9 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** no option is active once the list is gone */ + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -4053,11 +4059,23 @@ class VirtualSelect { if (document.activeElement !== this.$searchInput) { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 96d7c5fb..aa47eb9b 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 3ab636e1..496ac36d 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -854,7 +854,8 @@ class VirtualSelect {
-
@@ -1052,7 +1053,9 @@ class VirtualSelect { ${this.searchFormLabel} + id="vscomp-search-input-${this.uniqueId}" + role="combobox" aria-autocomplete="list" aria-expanded="false" + aria-controls="vscomp-options-container-${this.uniqueId}"> ×`; } const html = `
@@ -1223,33 +1226,34 @@ class VirtualSelect { this.openDropbox(); } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction: 'next' + direction }); } else { this.openDropbox(); } } + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); - if (this.isOpened()) { - this.focusOption({ - direction: 'previous' - }); - } else { - this.openDropbox(); - } + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -3073,6 +3077,8 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3132,9 +3138,9 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** no option is active once the list is gone */ + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -4053,11 +4059,23 @@ class VirtualSelect { if (document.activeElement !== this.$searchInput) { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 96d7c5fb..aa47eb9b 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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 setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/virtual-select.js b/src/virtual-select.js index 21e0f176..3ff1a5a9 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -263,7 +263,8 @@ export class VirtualSelect {
-
@@ -489,7 +490,9 @@ export class VirtualSelect { ${this.searchFormLabel} + id="vscomp-search-input-${this.uniqueId}" + role="combobox" aria-autocomplete="list" aria-expanded="false" + aria-controls="vscomp-options-container-${this.uniqueId}"> ×`; } @@ -683,32 +686,34 @@ export class VirtualSelect { } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { - this.focusOption({ direction: 'next' }); + this.focusOption({ direction }); } else { this.openDropbox(); } } - onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } - if (this.isOpened()) { - this.focusOption({ direction: 'previous' }); - } else { - this.openDropbox(); - } + onUpArrowPress(e) { + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { @@ -2773,6 +2778,8 @@ export class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); @@ -2850,9 +2857,9 @@ export class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** no option is active once the list is gone */ + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { @@ -3936,11 +3943,22 @@ export class VirtualSelect { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ From 5157c53bbef1beab2e3afba97b0e5b3be43c17f8 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 17:26:05 +0100 Subject: [PATCH 09/57] test: open the dropdown deterministically in the flag-icon case `Add image/icon > has flag icon on selected item` failed because cy.open() is a click, i.e. a toggle: the preceding case leaves this dropdown open, so cy.open() closed it and the option click then landed on a dropbox with `display: none`. Open only when actually closed, and re-establish the scroll position so option 16 is rendered whether or not the preceding case ran. Corrects an earlier reading of this failure. It was previously attributed to the popover hiding the dropbox while the virtualised list is scrolled, and a product ticket (AI-1d) was drafted for that. The fix confirms the real cause is the toggle, so AI-1d is withdrawn - there is no product defect here. Baseline re-measured directly to keep the comparison honest: 992f6a9's own bundle and its own examples.cy.ts were checked out and run, giving 216 pass / 3 fail. Both tests reported as newly failing were in that set. Two of the three are now fixed. Suite: 306 tests, 305 pass, 1 fail (was 216/3 at baseline). The remaining failure, `Option group > activates group select/deselect with Enter when group title is focused`, fails identically at baseline and is filed as AI-1f with a lead but no diagnosis: the first Enter selects the group, the second does not deselect it, and the keyboard path routes through onGroupTitleClick(), which reads its direction from the `selected` class on an element the re-render replaces between presses. Clicking the group title toggles correctly, so it is specific to the keyboard path. (cherry picked from commit f7ae693c4bd1d7bce1a53884dbbadf1809d78f57) --- cypress/e2e/examples.cy.ts | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 656caf47..8a155cbe 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -1410,7 +1410,22 @@ describe('Add image/icon', () => { }); it('has flag icon on selected item', () => { - cy.open(id).selectOption(16).hasSelectedFlagIcon(); + /** + * cy.open() is a click, i.e. a toggle. The preceding case leaves this dropdown open, so + * clicking here closed it and the option click then landed on a dropbox with + * `display: none`. Open only when actually closed, and re-establish the scroll position + * so option 16 is rendered whether or not the preceding case ran. + */ + cy.getVs(id).then(($e) => { + const vs = $e[0].virtualSelect; + + if (!vs.isOpened()) { + vs.openDropbox(); + } + }); + cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + + cy.getVs(id).scrollOptions(700).selectOption(16).hasSelectedFlagIcon(); }); }); From 1f57f1baf1ebd01fdca193d03d97a7bb354676c4 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 18:00:40 +0100 Subject: [PATCH 10/57] perf: take the O(n) ARIA scan off the render path and coalesce scroll re-renders (AI-5 / PERF-01 + PERF-02) Two costs sat directly on the scroll path: - calculateAriaMetadata() walks every option and ran at the top of every renderOptions() (~3.9 ms/call at 100k options), even though aria-setsize/aria-posinset only change when the filtered set or its order changes - never when the virtualisation window moves. - onOptionsScroll was bound with no throttling, so a drag produced one full re-render per scroll event (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU) and kept the main thread blocked for the whole gesture. The scan is now guarded by an ariaMetadataDirty flag, set by everything that alters the filtered set or its order: setVisibleOptionsCount(), setSortedOptions(), setNewOption() and removeNewOption(). A flag rather than an enumeration of call sites, so a future code path that changes the set cannot silently skip the recompute by being forgotten here. Scroll re-renders are coalesced to at most one per animation frame, and the pending frame is cancelled in destroy() so it cannot run against detached DOM. No API or behaviour change: the same attributes end up on the same elements, just computed when they can actually differ. Adds cypress/e2e/perf-scroll-aria.cy.ts (6 cases): zero ARIA rescans across five scroll positions, 20 synchronous scroll events producing fewer than 20 re-renders, setsize/posinset still correct after scrolling, metadata recomputed on search and on setOptions, and the queued frame cancelled on destroy. (cherry picked from commit 72ab7210aa70b4a0f0ece4dead4b7361cdd5950e) --- cypress/e2e/perf-scroll-aria.cy.ts | 160 +++++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 46 ++++++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 46 ++++++- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 48 ++++++- 7 files changed, 294 insertions(+), 12 deletions(-) create mode 100644 cypress/e2e/perf-scroll-aria.cy.ts diff --git a/cypress/e2e/perf-scroll-aria.cy.ts b/cypress/e2e/perf-scroll-aria.cy.ts new file mode 100644 index 00000000..ff70fdc8 --- /dev/null +++ b/cypress/e2e/perf-scroll-aria.cy.ts @@ -0,0 +1,160 @@ +/** cSpell:ignore vscomp posinset setsize */ + +/** + * Regression test for AI-5 / [PERF-01 + PERF-02] — INP / long tasks. + * + * Two costs sat on the scroll path. `calculateAriaMetadata()` walked every option and ran + * at the top of every `renderOptions()`, and `onOptionsScroll` was bound with no throttling, + * so a single drag produced one full O(n) re-render per scroll event (~9.5 ms at 100k + * unthrottled, ~44 ms at 4x CPU) and blocked the main thread for the whole gesture. + * + * The ARIA scan now runs only when the filtered set or its order changes, and scroll + * re-renders are coalesced to at most one per animation frame. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('Perf: scroll path does no O(n) work per event (AI-5)', { testIsolation: true }, () => { + const mountId = 'vs-perf-scroll'; + + type Vs = { + calculateAriaMetadata: () => void; + setVisibleOptions: () => void; + $optionsContainer: HTMLElement; + ariaSetSize: number; + scrollAnimationFrame: number | null; + destroy: () => void; + }; + + const instance = () => cy.get(`#${mountId}`).then(($e) => $e[0].virtualSelect as Vs); + + /** Count calls to an instance method without changing its behaviour. */ + const countCalls = (vs: Record, method: string, sink: { n: number }) => { + const original = vs[method].bind(vs); + + // eslint-disable-next-line no-param-reassign + vs[method] = (...args: unknown[]) => { + sink.n += 1; + return original(...args); + }; + }; + + const mount = (count: number, extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(count), search: true, ...extra })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('does not rescan ARIA metadata while scrolling', () => { + mount(2000); + + const calls = { n: 0 }; + + instance().then((vs) => countCalls(vs as unknown as Record, 'calculateAriaMetadata', calls)); + + // Several distinct scroll positions, i.e. several real scroll events and re-renders. + [200, 600, 1200, 2000, 3000].forEach((top) => { + cy.get(`#${mountId}`).find('.vscomp-options-container').scrollTo(0, top); + }); + cy.wait(200); + + cy.wrap(null).should(() => { + expect(calls.n, 'calculateAriaMetadata calls during scrolling').to.equal(0); + }); + }); + + it('coalesces a burst of scroll events into at most one re-render per frame', () => { + mount(2000); + + const renders = { n: 0 }; + + instance().then((vs) => countCalls(vs as unknown as Record, 'setVisibleOptions', renders)); + + // Dispatch a burst synchronously: without coalescing this is one full re-render each. + cy.get(`#${mountId}`).then(($e) => { + const container = ($e[0].virtualSelect as Vs).$optionsContainer; + + for (let i = 1; i <= 20; i += 1) { + container.scrollTop = i * 40; + container.dispatchEvent(new Event('scroll')); + } + }); + + cy.wait(200); + + cy.wrap(null).should(() => { + expect(renders.n, '20 scroll events must not produce 20 re-renders').to.be.lessThan(20); + expect(renders.n, 'the final position must still be rendered').to.be.greaterThan(0); + }); + }); + + it('still reports correct aria-setsize and aria-posinset after scrolling', () => { + mount(2000); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '2000'); + + cy.get(`#${mountId}`).find('.vscomp-options-container').scrollTo(0, 4000); + cy.wait(200); + + // setsize is a property of the filtered set, so scrolling must not change it... + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '2000'); + // ...while posinset must have advanced with the window. + cy.get(`#${mountId}`) + .find('.vscomp-option[aria-posinset]') + .first() + .invoke('attr', 'aria-posinset') + .then((pos) => { + expect(Number(pos), 'first rendered option advanced after scrolling').to.be.greaterThan(1); + }); + }); + + it('recomputes metadata when the filtered set changes', () => { + mount(2000); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option 15'); + + // "Option 15", "Option 150".."Option 159", "Option 1500".."Option 1599" -> a smaller set. + cy.get(`#${mountId}`) + .find('.vscomp-option[aria-setsize]') + .first() + .invoke('attr', 'aria-setsize') + .then((size) => { + expect(Number(size), 'setsize reflects the filtered set, not the full one').to.be.lessThan(2000); + expect(Number(size), 'setsize is still meaningful').to.be.greaterThan(0); + }); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-posinset]').first().should('have.attr', 'aria-posinset', '1'); + }); + + it('recomputes metadata when the option set is replaced', () => { + mount(2000); + + cy.get(`#${mountId}`).then(($e) => $e[0].setOptions?.(makeOptions(7))); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '7'); + }); + + it('cancels a queued scroll re-render on destroy', () => { + mount(2000); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect as Vs; + + // Queue a frame, then tear down before it can run. + vs.$optionsContainer.scrollTop = 400; + vs.$optionsContainer.dispatchEvent(new Event('scroll')); + expect(vs.scrollAnimationFrame, 'a frame is queued').to.not.eq(null); + + vs.destroy(); + expect(vs.scrollAnimationFrame, 'the queued frame is cancelled on destroy').to.eq(null); + }); + + // A leaked frame would throw against detached DOM and fail the test via an uncaught error. + cy.wait(200); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index aa47eb9b..814dd1f6 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 496ac36d..572e1d59 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -889,8 +889,16 @@ class VirtualSelect { return html; } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -1290,8 +1298,24 @@ class VirtualSelect { this.reset(); } } + + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + if (this.isDestroyed) { + return; + } + this.setVisibleOptions(true); + }); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1751,6 +1775,7 @@ class VirtualSelect { this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** @@ -2214,6 +2239,8 @@ class VirtualSelect { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2511,6 +2538,8 @@ class VirtualSelect { * virtualisation window, which is not what a "N results available" message means. */ this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2599,6 +2628,9 @@ class VirtualSelect { if (!value) { return; } + + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; @@ -3667,6 +3699,8 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3919,6 +3953,12 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index aa47eb9b..814dd1f6 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 496ac36d..572e1d59 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -889,8 +889,16 @@ class VirtualSelect { return html; } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -1290,8 +1298,24 @@ class VirtualSelect { this.reset(); } } + + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + if (this.isDestroyed) { + return; + } + this.setVisibleOptions(true); + }); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1751,6 +1775,7 @@ class VirtualSelect { this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** @@ -2214,6 +2239,8 @@ class VirtualSelect { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2511,6 +2538,8 @@ class VirtualSelect { * virtualisation window, which is not what a "N results available" message means. */ this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2599,6 +2628,9 @@ class VirtualSelect { if (!value) { return; } + + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; @@ -3667,6 +3699,8 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3919,6 +3953,12 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index aa47eb9b..814dd1f6 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/virtual-select.js b/src/virtual-select.js index 3ff1a5a9..d6882435 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -306,8 +306,16 @@ export class VirtualSelect { } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); @@ -757,8 +765,26 @@ export class VirtualSelect { } } + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + + if (this.isDestroyed) { + return; + } + + this.setVisibleOptions(true); + }); } onOptionsClick(e) { @@ -1266,6 +1292,7 @@ export class VirtualSelect { this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** @@ -1786,6 +1813,8 @@ export class VirtualSelect { } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { @@ -2126,6 +2155,8 @@ export class VirtualSelect { * virtualisation window, which is not what a "N results available" message means. */ this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2229,6 +2260,9 @@ export class VirtualSelect { return; } + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; + const newOption = this.getNewOption(); if (newOption) { @@ -3488,6 +3522,8 @@ export class VirtualSelect { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3773,6 +3809,12 @@ export class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); From b36ef0b769a9d12b0a619b3d9d588bc6427451cd Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:15:46 +0100 Subject: [PATCH 11/57] fix(a11y): strip markup and escape quotes in every aria-label Option labels may legitimately contain markup - a flag icon, , a
- and those labels are also interpolated into aria-label attributes, where markup is meaningless. It reached the screen reader as tag soup, and a double quote in a label closed the attribute early so the rest of the accessible name was silently lost. Adds Utils.getAriaLabelText(): tags collapse to a single space so adjacent words do not run together ("Paris
France" must not become "ParisFrance"), whitespace is collapsed, then the remaining quotes are escaped. Applied to the group header name, the group name carried into each child's label, the customData group_name/description, and the option label itself. Also replaces the inline strip on the tag clear button, which removed tags but never escaped quotes - the same attribute breakout, in the one place that already knew about the problem. WCAG 4.1.2 Name, Role, Value (A) and 1.1.1 Non-text Content (A). Non-breaking: only the text inside aria-label changes, and only where it was malformed. No roles, attributes or DOM structure change. (cherry picked from commit f9d37b19880ce1765452f9990888ef806eb8cfac) --- cypress/e2e/a11y-aria-label.cy.ts | 94 ++++++++++++++++++++++++ cypress/e2e/a11y-reduced-motion.cy.ts | 91 +++++++++++++++++++++++ cypress/e2e/perf-text-measurer.cy.ts | 84 +++++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 42 ++++++++--- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 42 ++++++++--- docs/assets/virtual-select.min.js | 2 +- src/utils/utils.js | 22 ++++++ src/virtual-select.js | 24 +++--- 10 files changed, 369 insertions(+), 36 deletions(-) create mode 100644 cypress/e2e/a11y-aria-label.cy.ts create mode 100644 cypress/e2e/a11y-reduced-motion.cy.ts create mode 100644 cypress/e2e/perf-text-measurer.cy.ts diff --git a/cypress/e2e/a11y-aria-label.cy.ts b/cypress/e2e/a11y-aria-label.cy.ts new file mode 100644 index 00000000..58bc009c --- /dev/null +++ b/cypress/e2e/a11y-aria-label.cy.ts @@ -0,0 +1,94 @@ +/** cSpell:ignore vscomp */ + +/** + * Accessible names must be plain text. + * + * Option labels may legitimately contain markup - a flag icon, , a
. Those labels are + * also interpolated into aria-label attributes, where markup is meaningless: it reached the + * screen reader as tag soup ("i class= flag France"), and a double quote in a label closed + * the attribute early so the rest of the name was silently lost. + * + * WCAG 4.1.2 Name, Role, Value (A) and 1.1.1 Non-text Content (A). + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('A11y: accessible names are plain text', { testIsolation: true }, () => { + const mountId = 'vs-aria-label'; + + const mount = (options: unknown[], extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options, ...extra })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + const option = (value: string) => cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${value}"]`); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('strips markup from a grouped option name', () => { + mount([{ label: 'Europe', options: [{ label: ' France', value: 'fr' }] }]); + + option('fr').should('have.attr', 'aria-label').and('contain', 'France').and('not.contain', ' { + mount([{ label: 'Europe', options: [{ label: 'France', value: 'fr' }] }]); + + option('fr') + .should('have.attr', 'aria-label') + .and('contain', 'Europe') + .and('not.contain', ''); + }); + + it('does not run words together where a tag was removed', () => { + mount([{ label: 'Europe', options: [{ label: 'Paris
France', value: 'fr' }] }]); + + // "ParisFrance" would be the result of stripping tags to an empty string. + option('fr').should('have.attr', 'aria-label').and('contain', 'Paris France'); + }); + + it('keeps a double quote in the label from truncating the name', () => { + mount([{ label: 'Europe', options: [{ label: 'The "City" of Light', value: 'fr' }] }]); + + option('fr') + .should('have.attr', 'aria-label') + .and('contain', 'City') + // Everything after the quote survived, i.e. the attribute was not broken out of. + .and('contain', 'Light'); + }); + + it('strips markup from the group header name too', () => { + mount([{ label: ' Europe', options: [{ label: 'France', value: 'fr' }] }], { + multiple: true, + }); + + cy.get(`#${mountId}`) + .find('.vscomp-option.group-title') + .first() + .should('have.attr', 'aria-label') + .and('contain', 'Europe') + .and('not.contain', ' { + mount([{ label: ' France', value: 'fr' }], { + multiple: true, + showValueAsTags: true, + ariaLabelTagClearButtonText: 'Remove option', + }); + + option('fr').click(); + + cy.get(`#${mountId}`) + .find('.vscomp-value-tag-clear-button') + .should('have.attr', 'aria-label') + .and('contain', 'France') + .and('contain', 'Remove option') + .and('not.contain', ' { + const mountId = 'vs-reduced-motion'; + + it('zeroes the JS-driven open/close durations when reduce is requested', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + + cy.window().then((win) => { + // Force the query to report "reduce" before the instance reads it. + const originalMatchMedia = win.matchMedia.bind(win); + + win.matchMedia = ((query: string) => + query.includes('prefers-reduced-motion') + ? ({ + matches: true, + media: query, + addEventListener() {}, + removeEventListener() {}, + } as unknown as MediaQueryList) + : originalMatchMedia(query)) as typeof win.matchMedia; + + mountVs(win, mountId, { options: makeOptions(5) }); + }); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect; + + expect(vs.showDuration, 'showDuration under reduced motion').to.equal(0); + expect(vs.hideDuration, 'hideDuration under reduced motion').to.equal(0); + }); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('keeps the configured durations when reduce is not requested', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5) })); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect; + + expect(vs.showDuration, 'default showDuration').to.be.greaterThan(0); + expect(vs.hideDuration, 'default hideDuration').to.be.greaterThan(0); + }); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('ships a stylesheet rule that zeroes the transitions', () => { + cy.visit('get-started'); + + // Read the stylesheet the page actually loaded, rather than re-fetching the file: this + // proves the rule survived the build and is live in the document. + cy.document().then((doc) => { + const sheets = Array.from(doc.styleSheets).filter((sheet) => (sheet.href || '').includes('virtual-select')); + + expect(sheets.length, 'the component stylesheet is loaded').to.be.greaterThan(0); + + const mediaRules = sheets.flatMap((sheet) => { + try { + return Array.from(sheet.cssRules); + } catch { + // cross-origin sheets are not readable; none of ours are + return []; + } + }); + + // Duck-typed rather than `instanceof CSSMediaRule`: spec code and the application run + // in different realms, so the constructors are not the same object. + const reducedMotion = mediaRules.filter((rule) => + String((rule as CSSMediaRule).conditionText || '').includes('prefers-reduced-motion'), + ) as CSSMediaRule[]; + + expect(reducedMotion.length, 'a prefers-reduced-motion block is present').to.be.greaterThan(0); + expect(reducedMotion[0].cssText, 'it zeroes the transitions').to.include('transition-duration: 0s'); + expect(reducedMotion[0].cssText, 'it covers the dropbox').to.include('vscomp-dropbox'); + }); + }); +}); diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts new file mode 100644 index 00000000..4206a1f5 --- /dev/null +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -0,0 +1,84 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-17 / [PERF-03] - INP / forced synchronous layout. + * + * willTextOverflow() created a div, read getComputedStyle twice, appended it to , + * read clientWidth and removed it again - once per selected tag. Each mutation invalidates + * layout for the read that follows, so a render with many tags meant a burst of forced + * synchronous layouts. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('Perf: one shared text measurer (AI-17)', { testIsolation: true }, () => { + const mountId = 'vs-measurer'; + + const mount = () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { options: makeOptions(5), multiple: true, showValueAsTags: true }), + ); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + it('reuses a single off-screen node instead of one per tag', () => { + mount(); + + // Several tags, i.e. several willTextOverflow() calls per render. + ['o1', 'o2', 'o3', 'o4'].forEach((v) => { + cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${v}"]`).click(); + }); + + cy.get('.vscomp-text-measurer').should('have.length', 1); + }); + + it('keeps the measurer out of the accessibility tree and out of flow', () => { + mount(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get('.vscomp-text-measurer').should('have.attr', 'aria-hidden', 'true'); + cy.get('.vscomp-text-measurer').should('have.css', 'position', 'absolute'); + }); + + it('still detects overflow, so tag tooltips are unaffected', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: 'A label far too long to fit inside a narrow tag without being clipped', value: 'long' }, + { label: 'Ok', value: 'short' }, + ], + multiple: true, + showValueAsTags: true, + }), + ); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="long"]').click(); + // Overflowing text still gets a tooltip, i.e. the measurement still works. + cy.get(`#${mountId}`).find('.vscomp-value-tag').first().should('have.attr', 'data-tooltip'); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('removes the measurer once the last instance is destroyed', () => { + mount(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + cy.get('.vscomp-text-measurer').should('exist'); + + cy.window().then((win) => unmountVs(win, mountId)); + + // The docs page hosts other instances, so only assert removal once none remain. + cy.window().then((win) => { + // @ts-expect-error - bundle global + const remaining = win.VirtualSelect.activeInstances?.size ?? 0; + + if (remaining === 0) { + cy.get('.vscomp-text-measurer').should('not.exist'); + } + }); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 814dd1f6..9cc3718d 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 572e1d59..00885162 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -221,6 +221,24 @@ class Utils { return text.replace(/"/g, '"'); } + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together ("France
Paris" must not become "FranceP(no space)"), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text @@ -961,14 +979,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } if (isSelected) { @@ -985,13 +1003,13 @@ class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } if (hasLabelRenderer) { @@ -2382,11 +2400,13 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` ${label} diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 814dd1f6..9cc3718d 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 572e1d59..00885162 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -221,6 +221,24 @@ class Utils { return text.replace(/"/g, '"'); } + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together ("France
Paris" must not become "FranceP(no space)"), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text @@ -961,14 +979,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } if (isSelected) { @@ -985,13 +1003,13 @@ class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } if (hasLabelRenderer) { @@ -2382,11 +2400,13 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` ${label} diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 814dd1f6..9cc3718d 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=this.secureText(t.getString(s.customData.group_name)),i=this.secureText(t.getString(s.customData.description));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${s.label}, ${o}"`}else y=`aria-label="${d}, ${s.label}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 5dd677ba..dd147670 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -218,6 +218,28 @@ export class Utils { return text.replace(/"/g, '"'); } + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together (so "France
Paris" does not collapse into one word), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text) + .replace(/<[^>]+>/gi, ' ') + .replace(/\s+/g, ' ') + .trim(); + + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text diff --git a/src/virtual-select.js b/src/virtual-select.js index d6882435..5b1049d8 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -378,15 +378,15 @@ export class VirtualSelect { } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } @@ -406,15 +406,15 @@ export class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } @@ -1974,11 +1974,13 @@ export class VirtualSelect { const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` From 46908dab29e3bbf83394076d5c893eaf4ad18ed5 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:18:33 +0100 Subject: [PATCH 12/57] perf: reuse one text measurer instead of creating a node per tag Deciding whether a selected tag's text overflows (and therefore needs a tooltip) used to create a div, read getComputedStyle twice, append it to , read clientWidth and remove it again - once per tag. Each DOM mutation invalidates layout for the read that follows, so rendering many tags produced a burst of forced synchronous layouts. Now one reusable off-screen node, created lazily and shared, and a single getComputedStyle read for every property. Font weight and letter spacing are applied too: both change advance width, so ignoring them under-reported overflow and could drop a tooltip that was needed. The node is absolutely positioned off-screen and aria-hidden, so it cannot affect layout or be announced, and it is removed in the existing last-instance teardown alongside the global listeners and the shared observer - nothing of ours is left in the document. Non-breaking: same boolean result, same tooltip behaviour. (cherry picked from commit 10cecf3f28079120ce98df195adc18698f20693e) --- cypress/e2e/perf-text-measurer.cy.ts | 12 ++-- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 83 ++++++++++++++++++++---- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 83 ++++++++++++++++++++---- docs/assets/virtual-select.min.js | 2 +- src/utils/utils.js | 77 ++++++++++++++++++---- src/virtual-select.js | 2 + 8 files changed, 219 insertions(+), 44 deletions(-) diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts index 4206a1f5..a15c2579 100644 --- a/cypress/e2e/perf-text-measurer.cy.ts +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -1,17 +1,17 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-17 / [PERF-03] - INP / forced synchronous layout. + * Measuring whether a tag's text overflows must not thrash layout. * - * willTextOverflow() created a div, read getComputedStyle twice, appended it to , - * read clientWidth and removed it again - once per selected tag. Each mutation invalidates - * layout for the read that follows, so a render with many tags meant a burst of forced - * synchronous layouts. + * The check runs once per selected tag. It used to create a div, read getComputedStyle twice, + * append it to , read clientWidth and remove it again - and each DOM mutation + * invalidates layout for the read that follows, so rendering many tags produced a burst of + * forced synchronous layouts. */ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('Perf: one shared text measurer (AI-17)', { testIsolation: true }, () => { +describe('Perf: one shared text measurer', { testIsolation: true }, () => { const mountId = 'vs-measurer'; const mount = () => { diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 9cc3718d..0d702be8 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 00885162..42b97b55 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -198,17 +198,64 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { + fontSize, + fontFamily, + fontWeight, + letterSpacing + } = window.getComputedStyle(container); + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + return $measurer.clientWidth > container.clientWidth; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -227,7 +274,7 @@ class Utils { * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that * markup became tag soup in the accessible name, and a double quote in the label broke out * of the attribute and truncated the name. Tags collapse to a single space so adjacent - * words do not run together ("France
Paris" must not become "FranceP(no space)"), then the + * words do not run together (so "France
Paris" does not collapse into one word), then the * remaining quotes are escaped. * * @static @@ -347,6 +394,13 @@ class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -705,6 +759,9 @@ class DomUtils { }); } } +;// ./src/utils/index.js + + ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -1500,6 +1557,8 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 9cc3718d..0d702be8 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 00885162..42b97b55 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -198,17 +198,64 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { + fontSize, + fontFamily, + fontWeight, + letterSpacing + } = window.getComputedStyle(container); + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + return $measurer.clientWidth > container.clientWidth; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -227,7 +274,7 @@ class Utils { * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that * markup became tag soup in the accessible name, and a double quote in the label broke out * of the attribute and truncated the name. Tags collapse to a single space so adjacent - * words do not run together ("France
Paris" must not become "FranceP(no space)"), then the + * words do not run together (so "France
Paris" does not collapse into one word), then the * remaining quotes are escaped. * * @static @@ -347,6 +394,13 @@ class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -705,6 +759,9 @@ class DomUtils { }); } } +;// ./src/utils/index.js + + ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -1500,6 +1557,8 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 9cc3718d..0d702be8 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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 getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 dd147670..721c662e 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -195,17 +195,65 @@ export class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { fontSize, fontFamily, fontWeight, letterSpacing } = window.getComputedStyle(container); + + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + + return $measurer.clientWidth > container.clientWidth; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = + 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -350,3 +398,10 @@ export class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; diff --git a/src/virtual-select.js b/src/virtual-select.js index 5b1049d8..7d8f91ce 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -969,6 +969,8 @@ export class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } From 4a0d6f32a51be526a3454de7f3f50112e1c0541e Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:19:50 +0100 Subject: [PATCH 13/57] feat(a11y): honour the reduce-motion preference The dropbox slide ignored the user's OS-level "reduce motion" setting. The animation is driven from both CSS and JS, so a stylesheet rule alone is not enough: the popover would still animate for showDuration/hideDuration milliseconds. Both are handled now - a prefers-reduced-motion block zeroes the transitions, and showDuration/hideDuration resolve to 0 when the query matches. Utils.prefersReducedMotion() reads the query per call rather than caching it, so a preference changed after page load is picked up by the next instance, and it is guarded for environments without matchMedia. The loader spin is deliberately left running. It is a status indicator rather than decoration, and a frozen spinner reads as a broken UI instead of "working"; screen reader users get the same information from the live region, so nothing is lost by keeping it. Recorded in the stylesheet so the omission is not mistaken for an oversight. Non-breaking: no API change, and behaviour differs only for users who asked for reduced motion. (cherry picked from commit 600c4f7656a869e7c03ffa63ee60c45668fc7547) --- cypress/e2e/a11y-reduced-motion.cy.ts | 9 +++++---- dist-archive/virtual-select-1.3.0.min.css | 2 +- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 23 +++++++++++++++++++++++ dist/virtual-select.min.css | 2 +- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 23 +++++++++++++++++++++++ docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- src/sass/partials/virtual-select.scss | 16 ++++++++++++++++ src/utils/utils.js | 13 +++++++++++++ src/virtual-select.js | 10 ++++++++++ 12 files changed, 96 insertions(+), 10 deletions(-) diff --git a/cypress/e2e/a11y-reduced-motion.cy.ts b/cypress/e2e/a11y-reduced-motion.cy.ts index 51be215a..d266ab87 100644 --- a/cypress/e2e/a11y-reduced-motion.cy.ts +++ b/cypress/e2e/a11y-reduced-motion.cy.ts @@ -1,15 +1,16 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-19 / [A11Y-17] - WCAG 2.3.3 (AAA) and general motion hygiene. + * The dropdown must respect the user's OS-level "reduce motion" preference. * - * The open/close animation is driven from both CSS and JS, so it ignored the user's - * OS-level reduced-motion preference in both places. + * The open/close animation is driven from both CSS and JS, so honouring the preference in the + * stylesheet alone is not enough - the popover would still animate for + * showDuration/hideDuration milliseconds. */ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: prefers-reduced-motion (AI-19)', { testIsolation: true }, () => { +describe('A11y: prefers-reduced-motion', { testIsolation: true }, () => { const mountId = 'vs-reduced-motion'; it('zeroes the JS-driven open/close durations when reduce is requested', () => { diff --git a/dist-archive/virtual-select-1.3.0.min.css b/dist-archive/virtual-select-1.3.0.min.css index 408fe4db..9c470541 100644 --- a/dist-archive/virtual-select-1.3.0.min.css +++ b/dist-archive/virtual-select-1.3.0.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 0d702be8..24dedcaa 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 42b97b55..a53ff582 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -227,6 +227,19 @@ class Utils { return $measurer.clientWidth > container.clientWidth; } + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + /** * The shared, lazily created off-screen node used to measure text width. * @@ -1823,6 +1836,16 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ diff --git a/dist/virtual-select.min.css b/dist/virtual-select.min.css index 408fe4db..9c470541 100644 --- a/dist/virtual-select.min.css +++ b/dist/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 0d702be8..24dedcaa 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 42b97b55..a53ff582 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -227,6 +227,19 @@ class Utils { return $measurer.clientWidth > container.clientWidth; } + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + /** * The shared, lazily created off-screen node used to measure text width. * @@ -1823,6 +1836,16 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 408fe4db..9c470541 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 0d702be8..24dedcaa 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 3e8ffad3..36536a4b 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -688,3 +688,19 @@ } } } + +/** + * Users who ask the operating system to reduce motion should not get the dropbox slide. + * + * The loader spin is deliberately left alone: it is a status indicator rather than decoration, + * and a frozen spinner reads as a broken UI instead of "working". Screen reader users get the + * same information from the live region, so nothing is lost by keeping it. + */ +@media (prefers-reduced-motion: reduce) { + .vscomp-dropbox-container, + .vscomp-dropbox, + .vscomp-wrapper .vscomp-toggle-button, + .vscomp-dropbox-wrapper { + transition-duration: 0s !important; + } +} diff --git a/src/utils/utils.js b/src/utils/utils.js index 721c662e..b013f6ce 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -221,6 +221,19 @@ export class Utils { return $measurer.clientWidth > container.clientWidth; } + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + /** * The shared, lazily created off-screen node used to measure text width. * diff --git a/src/virtual-select.js b/src/virtual-select.js index 7d8f91ce..8e79555f 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1259,6 +1259,16 @@ export class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ From 62368a0a7954b23d92bb962c7f9f4d8112e9f12b Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:38:02 +0100 Subject: [PATCH 14/57] docs(test): describe what each spec protects instead of citing audit IDs The specs led with internal audit identifiers ("Regression test for AI-2 / [A11Y-02]"), which tell a developer reading the file nothing. Each header now states the behaviour being protected and cites the WCAG criterion or standard, which is something they can look up. Also drops the identifiers from describe() titles, so a failing test names the broken behaviour rather than a backlog row. WCAG criterion numbers and OWASP references are kept deliberately: those are external standards, not internal bookkeeping. No test logic changes. Suite unchanged at 325 tests, 324 passing. (cherry picked from commit 08c9c81bc834f98b5091c3b826f3a551042e27de) --- cypress/e2e/a11y-escape-close.cy.ts | 6 ++++-- cypress/e2e/a11y-listbox-multiselectable.cy.ts | 6 ++++-- cypress/e2e/a11y-live-region.cy.ts | 6 ++++-- cypress/e2e/a11y-required-error.cy.ts | 6 ++++-- cypress/e2e/a11y-search-arrow-navigation.cy.ts | 7 +++++-- cypress/e2e/a11y-select-all.cy.ts | 6 ++++-- cypress/e2e/a11y-target-size.cy.ts | 6 ++++-- cypress/e2e/examples.cy.ts | 18 +++++++++--------- cypress/e2e/perf-scroll-aria.cy.ts | 6 ++++-- cypress/e2e/security-global-defaults.cy.ts | 6 ++++-- 10 files changed, 46 insertions(+), 27 deletions(-) diff --git a/cypress/e2e/a11y-escape-close.cy.ts b/cypress/e2e/a11y-escape-close.cy.ts index 4bab4d3e..dd30e395 100644 --- a/cypress/e2e/a11y-escape-close.cy.ts +++ b/cypress/e2e/a11y-escape-close.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-2 / [A11Y-02] — WCAG 2.1.1 & 2.1.2 (Level A). + * Escape must dismiss the dropdown, whatever layout it is rendered in. + * + * WCAG 2.1.1 Keyboard (A) and 2.1.2 No Keyboard Trap (A). * * Escape only closed the dropdown when an external `dropboxWrapper` existed or the dropdown * was shown as a popup. With the default `dropboxWrapper: 'self'` on a desktop viewport the @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: Escape closes the dropdown (AI-2)', () => { +describe('A11y: Escape closes the dropdown', () => { const mountId = 'vs-a11y-escape'; const isExpanded = (expected: boolean) => diff --git a/cypress/e2e/a11y-listbox-multiselectable.cy.ts b/cypress/e2e/a11y-listbox-multiselectable.cy.ts index b19f9e27..80f04e13 100644 --- a/cypress/e2e/a11y-listbox-multiselectable.cy.ts +++ b/cypress/e2e/a11y-listbox-multiselectable.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp multiselectable */ /** - * Regression test for AI-10 / [A11Y-06] — WCAG 4.1.2 (A). + * A multi-select listbox must say so, or assistive technology presents it as single-select. + * + * WCAG 4.1.2 Name, Role, Value (A). * * The options container carries role="listbox" but never advertised that more than one * option could be chosen, so assistive technology presented a multi-select dropdown with @@ -10,7 +12,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: listbox advertises multi-selection (AI-10)', () => { +describe('A11y: listbox advertises multi-selection', () => { const mountId = 'vs-a11y-multiselectable'; const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts index 228d1448..4ec76a66 100644 --- a/cypress/e2e/a11y-live-region.cy.ts +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-6 / [A11Y-03] — WCAG 4.1.3 Status Messages (AA). + * Status changes must be announced, not shown only on screen. + * + * WCAG 4.1.3 Status Messages (AA). * * The component shipped a `.vscomp-live-region` rule in the stylesheet but no JavaScript * ever created the element, so there were zero live regions in the DOM. Search result @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: status announcements via a live region (AI-6)', () => { +describe('A11y: status announcements via a live region', () => { const mountId = 'vs-a11y-live'; const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts index e09dd293..89e8fafd 100644 --- a/cypress/e2e/a11y-required-error.cy.ts +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-4 / [A11Y-07] — WCAG 3.3.1 (A), 1.4.1 (A) and 4.1.2 (A). + * A required field, and a failed validation, must be perceivable without relying on colour. + * + * WCAG 3.3.1 Error Identification (A), 1.4.1 Use of Colour (A), 4.1.2 Name/Role/Value (A). * * `required` was never exposed: the wrapper carried no aria-required, and a failed * validate() only toggled a `has-error` class that changed the toggle button's border @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: required and error state are exposed (AI-4)', () => { +describe('A11y: required and error state are exposed', () => { const mountId = 'vs-a11y-required'; const wrapper = () => cy.get(`#${mountId}`).find('.vscomp-wrapper'); diff --git a/cypress/e2e/a11y-search-arrow-navigation.cy.ts b/cypress/e2e/a11y-search-arrow-navigation.cy.ts index 7cf0db7b..6c529337 100644 --- a/cypress/e2e/a11y-search-arrow-navigation.cy.ts +++ b/cypress/e2e/a11y-search-arrow-navigation.cy.ts @@ -1,7 +1,10 @@ /** cSpell:ignore vscomp activedescendant combobox autocomplete */ /** - * Regression test for AI-7 / [A11Y-01 + A11Y-05] — WCAG 2.1.1 (A) and 4.1.2 (A). + * The arrow keys must navigate the option list from the search input, and the highlighted + * option must be announced. + * + * WCAG 2.1.1 Keyboard (A) and 4.1.2 Name, Role, Value (A). * * Opening the dropdown puts focus in the search input, and both arrow handlers * early-returned in that state, so ArrowDown/ArrowUp did nothing at all: no option was @@ -21,7 +24,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; * case leak across tests and make the focus assertions flaky for reasons unrelated to the * component, so this spec asks for a clean page per test. */ -describe('A11y: arrow-key navigation from the search input (AI-7)', { testIsolation: true }, () => { +describe('A11y: arrow-key navigation from the search input', { testIsolation: true }, () => { const mountId = 'vs-a11y-search-arrows'; const searchInput = () => cy.get(`#${mountId}`).find('.vscomp-search-input'); diff --git a/cypress/e2e/a11y-select-all.cy.ts b/cypress/e2e/a11y-select-all.cy.ts index dca4d319..3a5fc8ae 100644 --- a/cypress/e2e/a11y-select-all.cy.ts +++ b/cypress/e2e/a11y-select-all.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-3 / [A11Y-04] — WCAG 4.1.2, 1.3.1 (Level A) and 2.1.1 (Level A). + * The Select All control must behave and be announced as a checkbox. + * + * WCAG 4.1.2 Name/Role/Value (A), 1.3.1 Info and Relationships (A), 2.1.1 Keyboard (A). * * "Select All" was a bare : exposed to assistive * technology as a generic element with no role and no checked state, so its state changes were @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: Select All exposes checkbox semantics (AI-3)', () => { +describe('A11y: Select All exposes checkbox semantics', () => { const mountId = 'vs-a11y-select-all'; const toggleAll = () => cy.get(`#${mountId}`).find('.vscomp-toggle-all-button'); diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts index c80e3b48..eb004592 100644 --- a/cypress/e2e/a11y-target-size.cy.ts +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-11 / [A11Y-13] — WCAG 2.5.8 Target Size (Minimum), AA. + * Every pointer target must be at least 24x24 CSS px. + * + * WCAG 2.5.8 Target Size (Minimum), AA. * * Two controls were smaller than the 24x24 CSS px minimum: the "Select All" checkbox * (measured 25x15) and the per-tag clear button (20x20). Both are pointer targets, so @@ -12,7 +14,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; const MIN_TARGET = 24; -describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { +describe('A11y: pointer targets meet the 24x24 minimum', () => { const mountId = 'vs-a11y-target-size'; /** diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 8a155cbe..159cf19f 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -163,8 +163,8 @@ describe('Accessibility attributes - virtualized options metadata', () => { // aria-activedescendant belongs on the element that holds focus and has a role that // supports it - here the role="combobox" wrapper. It used to be asserted on - // .vscomp-dropbox-container, a plain div with no role, where it is meaningless - // (audit A11Y-05). That container is now checked for its *absence* below. + // .vscomp-dropbox-container, a plain div with no role, where the attribute is + // meaningless. That container is now checked for its *absence* below. cy.getVs(id) .find('.vscomp-ele-wrapper') .should('exist') @@ -210,7 +210,7 @@ describe('Accessibility attributes - virtualized options metadata', () => { .should('have.attr', 'aria-activedescendant', firstOptionId); }); - // ...and is not published on the role-less container (audit A11Y-05) + // ...and is not published on the role-less container, which has no role to carry it cy.get('@roleLessContainer').should('not.have.attr', 'aria-activedescendant'); // Navigate to second option using arrow key @@ -245,9 +245,9 @@ describe('Accessibility attributes - virtualized options metadata', () => { * Arrow key behavior tests for search input. * * Up/Down in the search input navigate the option list (WAI-ARIA APG editable-combobox), - * which is what audit finding A11Y-01 required: they used to be swallowed so that no option - * could ever be highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in - * the field is served by Left/Right and Home/End, covered by the suites below. + * They used to be swallowed while the search input had focus, so no option could ever be + * highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in the field is + * served by Left/Right and Home/End, covered by the suites below. */ describe('Arrow key behavior in search input - cursor movement', () => { @@ -367,7 +367,7 @@ describe('Arrow key behavior - focus management and accessibility', () => { cy.open(idMultiple); // Clear and test more text editing using realistic data cy.getVs(idMultiple).typeValue('tion 123', true); - // Home goes to the beginning (Up/Down are option navigation, per A11Y-01) + // Home goes to the beginning; Up/Down are option navigation cy.getVs(idMultiple).pressKeys('Home'); cy.getVs(idMultiple).typeValue('Op'); cy.getVs(idMultiple).checkOptionLabelExists('Option 123'); @@ -580,8 +580,8 @@ describe('Option group', () => { cy.open(id); cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); - // One press reaches the group title. This needed two before the A11Y-01 fix, because - // the first ArrowDown was swallowed while the search input held focus. + // One press reaches the group title. This needed two while the first ArrowDown was + // still being swallowed by the focused search input. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getDropbox(null, id) diff --git a/cypress/e2e/perf-scroll-aria.cy.ts b/cypress/e2e/perf-scroll-aria.cy.ts index ff70fdc8..20d1288d 100644 --- a/cypress/e2e/perf-scroll-aria.cy.ts +++ b/cypress/e2e/perf-scroll-aria.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp posinset setsize */ /** - * Regression test for AI-5 / [PERF-01 + PERF-02] — INP / long tasks. + * Scrolling a large list must not do work proportional to the whole list. + * + * Measured against INP / long tasks and a 16.7 ms frame budget. * * Two costs sat on the scroll path. `calculateAriaMetadata()` walked every option and ran * at the top of every `renderOptions()`, and `onOptionsScroll` was bound with no throttling, @@ -14,7 +16,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('Perf: scroll path does no O(n) work per event (AI-5)', { testIsolation: true }, () => { +describe('Perf: scroll path does no O(n) work per event', { testIsolation: true }, () => { const mountId = 'vs-perf-scroll'; type Vs = { diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts index 28176ff2..3807f196 100644 --- a/cypress/e2e/security-global-defaults.cy.ts +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-1 / [SEC-01] — OWASP A03:2021 (Injection) / DOM XSS. + * A host application must be able to turn option-text escaping on for every dropdown at once. + * + * OWASP A03:2021 (Injection) / DOM XSS. * * Option label/value/description are interpolated into innerHTML, and `secureText()` is a * no-op unless `enableSecureText` is on — which it is not by default. A host application @@ -14,7 +16,7 @@ import { mountVs, unmountVs } from '../support/mount'; -describe('Security: global defaults for enableSecureText (AI-1)', () => { +describe('Security: global defaults for enableSecureText', () => { const mountId = 'vs-sec-global'; const payload = ''; From 965e904228ecd625d209b0cd7b1da868aeb60ff1 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 21:52:16 +0100 Subject: [PATCH 15/57] fix(a11y): drop the option highlight when the dropbox closes (AI-1f) closeDropbox() is asynchronous for every default instance: initDropboxPopover() runs whenever !keepAlwaysOpen && !showAsPopup, so the close goes through dropboxPopover.hide() and afterHidePopper() - the only caller of removeOptionFocus() - does not run until the hide transition ends. Measured live: for ~150-200ms after closeDropbox() returns, isOpened() is still true, the previous .focused option is still in the DOM and focusedOptionIndex still holds its index. Reopening inside that window resumed arrow navigation from a row the user could no longer see, one step past where they expected - which on a grouped multi-select put Enter on the first child option instead of the group title. Clear the highlight next to the existing setActiveDescendant('') instead of waiting for the transition. removeOptionFocus() is a no-op when nothing is highlighted, so the afterHidePopper() call stays for the silent path. toggleOptionFocusedState() also moved DOM focus on both edges, so clearing a highlight focused the element it had just un-highlighted. Harmless during navigation (the next call immediately focuses the new option) but wrong on close, where it pulled focus into a dropbox being hidden and fought the wrapper refocus. It now moves focus only when taking the highlight. This is what the red examples.cy.ts case was actually hitting. It was filed as "Enter on a group title selects but does not deselect"; the run log shows it failed on the first assertion, not the second, and the toggle itself works in both directions against the unfixed bundle. Spec: a11y-close-clears-highlight.cy.ts (5), confirmed failing before the fix. (cherry picked from commit af297eceebc2c78dc3aa8f70844d6e9fe1dbed59) --- cypress/e2e/a11y-close-clears-highlight.cy.ts | 124 ++++++++++++++++++ dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 24 +++- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 24 +++- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 23 +++- 7 files changed, 192 insertions(+), 9 deletions(-) create mode 100644 cypress/e2e/a11y-close-clears-highlight.cy.ts diff --git a/cypress/e2e/a11y-close-clears-highlight.cy.ts b/cypress/e2e/a11y-close-clears-highlight.cy.ts new file mode 100644 index 00000000..95500354 --- /dev/null +++ b/cypress/e2e/a11y-close-clears-highlight.cy.ts @@ -0,0 +1,124 @@ +/** cSpell:ignore vscomp */ + +/** + * Closing the dropbox must end option navigation, immediately. + * + * Every default instance closes through a popover hide transition, so `afterHidePopper()` - + * the only place that dropped the highlight - ran ~200ms after `closeDropbox()` returned. + * Until then the previous `.focused` option and `focusedOptionIndex` survived the close, so a + * dropdown reopened inside that window resumed navigation one step further down the list than + * the user could see. On a grouped multi-select that shifted Enter off the group title and onto + * its first child, so "select the whole group" silently became "select one option". + * + * WCAG 2.1.1 Keyboard (A) and 4.1.2 Name, Role, Value (A) - `aria-activedescendant` and the + * visible highlight have to agree with where the next arrow key will actually go. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +const GROUPS = [ + { label: 'Group 1', options: [{ label: 'Option 1-1', value: '1-1' }, { label: 'Option 1-2', value: '1-2' }] }, + { label: 'Group 2', options: [{ label: 'Option 2-1', value: '2-1' }] }, +]; + +describe('A11y: closing the dropbox clears option navigation state', { testIsolation: true }, () => { + const mountId = 'vs-close-clears-highlight'; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: GROUPS, multiple: true, ...extra })); + }; + + const openAndHighlightFirst = () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('drops the highlight in the same tick as the close, not when the transition ends', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + + /** + * Read in the same tick the close was requested. isOpened() is still true here, which + * is the point: this pins the asynchronous popover path rather than the synchronous + * fallback, so the test cannot pass for the wrong reason. + */ + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + expect(vs.$dropboxContainer.querySelector('.vscomp-option.focused'), 'highlighted option').to.equal(null); + expect(vs.focusedOptionIndex, 'focusedOptionIndex').to.equal(null); + }); + }); + + it('clears aria-activedescendant on close', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.attr', 'aria-activedescendant'); + + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('not.have.attr', 'aria-activedescendant'); + }); + + it('starts navigation at the first option again after a close and reopen', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + + // data-index 1 here would mean the pre-close highlight was carried over. + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); + }); + + it('toggles a whole group on and off with Enter on its group title', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.class', 'group-title'); + + /** + * Asserted on the value array rather than on `.vscomp-value`: the rendered text switches + * between a list of labels and an "N options selected" summary depending on + * `noOfDisplayValues`, which has nothing to do with what this case is about. + */ + cy.get(`#${mountId}`).pressKeys('Enter'); + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.selectedValues, 'after the first Enter').to.deep.equal(['1-1', '1-2']); + }); + + cy.get(`#${mountId}`).pressKeys('Enter'); + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.selectedValues, 'after the second Enter').to.deep.equal([]); + }); + }); + + /** + * Negative control for the change that stopped clearing the highlight from moving DOM focus: + * Escape must still hand focus back to the combobox rather than leaving it on an option + * inside a dropbox that is being hidden. + */ + it('still returns focus to the combobox when Escape closes the dropbox', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { key: 'Escape', keyCode: 27, which: 27 }); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); +}); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 24dedcaa..ffc4d86f 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index a53ff582..f198eb67 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -3273,7 +3273,20 @@ class VirtualSelect { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); DomUtils.setAria(this.$searchInput, 'expanded', false); - /** no option is active once the list is gone */ + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { @@ -4198,7 +4211,14 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 24dedcaa..ffc4d86f 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 a53ff582..f198eb67 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -3273,7 +3273,20 @@ class VirtualSelect { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); DomUtils.setAria(this.$searchInput, 'expanded', false); - /** no option is active once the list is gone */ + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { @@ -4198,7 +4211,14 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 24dedcaa..ffc4d86f 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/virtual-select.js b/src/virtual-select.js index 8e79555f..0233abd6 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -2906,7 +2906,20 @@ export class VirtualSelect { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); DomUtils.setAria(this.$searchInput, 'expanded', false); - /** no option is active once the list is gone */ + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); this.setActiveDescendant(''); } @@ -3995,7 +4008,13 @@ export class VirtualSelect { DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } From 3abcf9710d5ced506f6df61cee173f4a18f61cc4 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 21:52:36 +0100 Subject: [PATCH 16/57] test: open from an asserted state instead of toggling (AI-1e) examples.cy.ts runs with testIsolation: false, so every instance survives between cases, and cy.open() is a click - therefore a toggle - preceded by a fixed wait(200) that races the hide transition. Whether a case started open or closed, with or without a carried-over highlight, silently changed how many key presses the next one needed. cy.openFresh(id) replaces the six-line reset() + closeDropbox() + cy.open() preamble in all five Option-group keyboard cases. It asserts its way into the starting state rather than waiting a fixed time for it: clear the value, close, wait for the `closed` class, click, wait for it to be gone, then assert no option carries the highlight. All three inputs a press count can depend on - open/closed, value, highlight - are pinned before the first key press. Neither approach the v1.4.0 assessment rejected was retried: this is not testIsolation: true (which would break the `go to section` pattern every describe relies on) and not API-opening (which leaves focus outside the component and trips the dropbox focus sentinels). examples.cy.ts also drops from ~13 min to ~2 min, because several cases had been reaching their assertions only after Cypress retry timeouts. (cherry picked from commit fd60b7c43b49ab5537c7d059337787f91241f5f3) --- cypress/e2e/examples.cy.ts | 53 +++++-------------------------------- cypress/support/commands.ts | 30 +++++++++++++++++++++ cypress/support/index.d.ts | 9 +++++++ 3 files changed, 46 insertions(+), 46 deletions(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 159cf19f..6a57e85b 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -569,17 +569,10 @@ describe('Option group', () => { }); it('includes group title in keyboard navigation and exposes it to assistive technologies', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + /** openFresh() guarantees closed -> open with no highlight, so one press is one press + * regardless of what the previous test left behind. */ + cy.openFresh(id); - cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); // One press reaches the group title. This needed two while the first ArrowDown was // still being swallowed by the focused search input. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -598,15 +591,7 @@ describe('Option group', () => { }); it('activates group select/deselect with Enter when group title is focused', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).pressKeys('ArrowDown'); cy.getVs(id).pressKeys('Enter'); @@ -616,15 +601,7 @@ describe('Option group', () => { }); it('navigates between group title and group options with arrow keys', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -645,15 +622,7 @@ describe('Option group', () => { }); it('opens dropdown and selects a group child option using keyboard only', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -671,15 +640,7 @@ describe('Option group', () => { }); it('keeps focus on the last option when navigating past the end of the list', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 45b7ef6c..a5685ac0 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -30,6 +30,36 @@ Cypress.Commands.add('open', (id) => { cy.getVs(id).wait(dropboxCloseDuration).click(); }); +/** + * Open a dropdown from a known state, without depending on how the previous test left it. + * + * `cy.open()` is a click, i.e. a *toggle*: on an already-open dropdown it closes instead, and + * its fixed `wait(dropboxCloseDuration)` races the hide transition, which is what made the + * keyboard cases in this suite order-coupled (`testIsolation: false` keeps every instance + * alive across tests). This command asserts its way to the state it needs instead of waiting a + * fixed time for it: + * + * 1. clear the value and ask the dropbox to close; + * 2. wait for it to actually be closed (`closed` class), so the click below always opens; + * 3. click, and wait for it to actually be open; + * 4. assert no option carries the highlight, so a following ArrowDown always lands on the + * first option and press counts stop depending on test order. + */ +Cypress.Commands.add('openFresh', (id) => { + cy.getVs(id).then(($ele) => { + const vs = $ele[0].virtualSelect; + vs.reset(false, true); + vs.closeDropbox(); + }); + + cy.getVs(id).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.getVs(id).click(); + cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + cy.getDropbox(null, id).find('.vscomp-option.focused').should('not.exist'); + + cy.getVs(id); +}); + Cypress.Commands.add('close', { prevSubject: true }, (vsElem) => { cy.get(vsElem).click(); }); diff --git a/cypress/support/index.d.ts b/cypress/support/index.d.ts index 66d9b7a9..fd2cae73 100644 --- a/cypress/support/index.d.ts +++ b/cypress/support/index.d.ts @@ -50,6 +50,15 @@ declare namespace Cypress { */ open(id: string): Chainable; + /** + * Open from a known state - closed, no value, no highlighted option - so press counts do + * not depend on what the previous test left behind. + * + * @example + * cy.openFresh('option-group-select') + */ + openFresh(id: string): Chainable; + /** * @example close() From da295adce35c415464a869830356604a6ce1c415 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 09:14:28 +0100 Subject: [PATCH 17/57] fix(a11y): keep the closing dropbox from taking the highlight back (AI-1f) Follow-up to the AI-1f fix replayed from the audit branch, from code review of it. closeDropbox() ends with setSearchValue(''), and afterSetSearchValue() unconditionally calls focusOption({ focusFirst: true }). So with a filter typed, the synchronous removeOptionFocus() earlier in closeDropbox() was immediately undone: the highlight and aria-activedescendant came back on a combobox already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option about to be display:none - verified live, keyboard focus ended on . Guarded with an isClosing flag scoped to that one call, so everything before it (the wrapper refocus in particular) still sees real state. announceSearchResults() needs no guard: it already bails unless the search input holds focus, and a11y-live-region.cy.ts pins that. Also tightens toggleFocusedProp(), which tested focusedOptionIndex for truthiness. That only works because DomUtils.getData() returns the string "0"; normalising it to a number would stop index 0 being cleared, and renderOptions() re-applies .focused from the isFocused prop, so the stale highlight would come back through the data path on the next render. Two cases added to a11y-close-clears-highlight.cy.ts (7 total). Against the pre-fix baseline 3 of the 7 fail; against the branch before this commit, the new typed-search case fails on its own. --- cypress/e2e/a11y-close-clears-highlight.cy.ts | 71 +++++++++++++++++-- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 34 +++++++-- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 34 +++++++-- docs/assets/virtual-select.min.js | 2 +- src/virtual-select.js | 28 +++++++- 7 files changed, 155 insertions(+), 18 deletions(-) diff --git a/cypress/e2e/a11y-close-clears-highlight.cy.ts b/cypress/e2e/a11y-close-clears-highlight.cy.ts index 95500354..d121cc2a 100644 --- a/cypress/e2e/a11y-close-clears-highlight.cy.ts +++ b/cypress/e2e/a11y-close-clears-highlight.cy.ts @@ -71,20 +71,62 @@ describe('A11y: closing the dropbox clears option navigation state', { testIsola cy.get(`#${mountId}`).find('.vscomp-wrapper').should('not.have.attr', 'aria-activedescendant'); }); - it('starts navigation at the first option again after a close and reopen', () => { + /** + * Reopened in the *same tick* as the close, deliberately. Waiting for the `closed` class + * first would wait out `afterHidePopper()`, which clears the highlight on its own - so the + * case could never observe the bug it exists for. This is the user-visible symptom: reopen + * before the hide transition finishes and navigation must still start at the top. + */ + it('starts navigation at the first option again when reopened mid hide-transition', () => { mount(); openAndHighlightFirst(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '1'); - cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); - cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + vs.openDropbox(); + }); - cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); cy.get(`#${mountId}`).pressKeys('ArrowDown'); - // data-index 1 here would mean the pre-close highlight was carried over. + // data-index 2 here would mean the pre-close highlight was carried over. cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); }); + /** + * The same close, with a filter typed. Clearing the filter is the last thing closeDropbox() + * does, and it used to re-highlight the first visible option - undoing the clear above and + * pulling DOM focus onto an option that is about to be hidden. + */ + it('keeps the highlight cleared when a search value has to be cleared too', () => { + mount({ search: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').type('Option'); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('exist'); + + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + expect(vs.searchValue, 'search value').to.equal(''); + expect(vs.$dropboxContainer.querySelector('.vscomp-option.focused'), 'highlighted option').to.equal(null); + expect(vs.focusedOptionIndex, 'focusedOptionIndex').to.equal(null); + expect(vs.$wrapper.getAttribute('aria-activedescendant'), 'aria-activedescendant').to.equal(null); + }); + + // Focus must not have been dragged into the dropbox that is being hidden. + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); + it('toggles a whole group on and off with Enter on its group title', () => { mount(); openAndHighlightFirst(); @@ -121,4 +163,23 @@ describe('A11y: closing the dropbox clears option navigation state', { testIsola cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); cy.focused().should('have.class', 'vscomp-wrapper'); }); + + /** + * Same control on the layout where it actually bites. showAsPopup skips initDropboxPopover(), + * so closeDropbox() runs afterHidePopper() synchronously - i.e. right after the wrapper + * refocus and while the options are still visible and therefore still focusable. That is the + * path where clearing the highlight used to steal focus for real. + */ + it('still returns focus to the combobox when a popup layout closes', () => { + mount({ showAsPopup: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('exist'); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { key: 'Escape', keyCode: 27, which: 27 }); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); }); diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index ffc4d86f..56928132 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0,this.setSearchValue(""),this.isClosing=!1}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index f198eb67..6f811848 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -1701,9 +1701,13 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - this.focusOption({ - focusFirst: true - }); + + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ + focusFirst: true + }); + } if (!this.hasServerSearch) { this.announceSearchResults(); } @@ -1874,6 +1878,7 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; this.ariaMetadataDirty = true; } @@ -3300,7 +3305,20 @@ class VirtualSelect { } else { this.afterHidePopper(); } + + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. + */ + this.isClosing = true; this.setSearchValue(''); + this.isClosing = false; } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3755,7 +3773,15 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index ffc4d86f..56928132 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0,this.setSearchValue(""),this.isClosing=!1}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 f198eb67..6f811848 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -1701,9 +1701,13 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - this.focusOption({ - focusFirst: true - }); + + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ + focusFirst: true + }); + } if (!this.hasServerSearch) { this.announceSearchResults(); } @@ -1874,6 +1878,7 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; this.ariaMetadataDirty = true; } @@ -3300,7 +3305,20 @@ class VirtualSelect { } else { this.afterHidePopper(); } + + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. + */ + this.isClosing = true; this.setSearchValue(''); + this.isClosing = false; } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3755,7 +3773,15 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index ffc4d86f..56928132 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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,x="",S="",O="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)g="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",O=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(S=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`)),e+=`
\n ${g}\n \n ${b}\n \n ${S}\n ${x}\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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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])),x=c(h(e[n])),S=e.options,O=!!S,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:x,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:O,classNames:e.classNames};if(m||""!==g||(m=!0),i&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,O){const e=y.index;v=!0,S.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:x}=this;x.options=s,x.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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0,this.setSearchValue(""),this.isClosing=!1}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bS?S-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=f/2+g-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/virtual-select.js b/src/virtual-select.js index 0233abd6..89128257 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1117,7 +1117,10 @@ export class VirtualSelect { this.toggleAllOptionsClass(); } - this.focusOption({ focusFirst: true }); + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ focusFirst: true }); + } if (!this.hasServerSearch) { this.announceSearchResults(); @@ -1303,6 +1306,7 @@ export class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; this.ariaMetadataDirty = true; } @@ -2938,7 +2942,19 @@ export class VirtualSelect { this.afterHidePopper(); } + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. + */ + this.isClosing = true; this.setSearchValue(''); + this.isClosing = false; } afterHidePopper() { @@ -3478,7 +3494,15 @@ export class VirtualSelect { } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } From ae438239672a88d9485d0d5ba5cff4a5af208a5f Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 09:14:47 +0100 Subject: [PATCH 18/57] test: pin the search value and scroll position in openFresh() (AI-1e) From code review of the AI-1e work replayed from the audit branch. openFresh() claimed to pin every input a press count can depend on, but missed two: - scrollTop. focusOption() resolves "the first option" through getFirstVisibleOptionIndex(), i.e. scrollTop / optionHeight, and opening does not reset it: setScrollTop() returns early with no selection (which openFresh guarantees by resetting) and scrollToTop() only runs under showSelectedOptionsFirst. The last converted case scrolls to the bottom of the list, so any keyboard case added after it would have inherited that position. - the search value. It was only being cleared as a side effect of closeDropbox(), which returns early when the dropdown is already closed - and reset() never touches it. A case that left the instance closed with a filter applied would have opened onto a filtered list with every assertion still passing. Both are now set explicitly and then asserted, so the command fails loudly rather than silently opening from the wrong state. The setSearchValue() call is guarded for instances built with search: false, which have no $searchInput. --- cypress/support/commands.ts | 24 +++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index a5685ac0..6892e44e 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -39,16 +39,31 @@ Cypress.Commands.add('open', (id) => { * alive across tests). This command asserts its way to the state it needs instead of waiting a * fixed time for it: * - * 1. clear the value and ask the dropbox to close; + * 1. clear the value, the filter and the scroll position, and ask the dropbox to close; * 2. wait for it to actually be closed (`closed` class), so the click below always opens; * 3. click, and wait for it to actually be open; * 4. assert no option carries the highlight, so a following ArrowDown always lands on the * first option and press counts stop depending on test order. + * + * All four inputs a press count can depend on are pinned, not three. `scrollTop` is one of + * them because `focusOption()` resolves "the first option" through + * `getFirstVisibleOptionIndex()`, i.e. `scrollTop / optionHeight` - and opening does not reset + * it (`setScrollTop()` returns early with no selection, and `scrollToTop()` only runs under + * `showSelectedOptionsFirst`). The filter is cleared explicitly rather than relying on + * `closeDropbox()` doing it, because `closeDropbox()` returns early when already closed and + * `reset()` never touches the search value. */ Cypress.Commands.add('openFresh', (id) => { cy.getVs(id).then(($ele) => { const vs = $ele[0].virtualSelect; vs.reset(false, true); + + /** guarded: instances built with search: false have no $searchInput to write to */ + if (vs.$searchInput) { + vs.setSearchValue(''); + } + + vs.$optionsContainer.scrollTop = 0; vs.closeDropbox(); }); @@ -57,6 +72,13 @@ Cypress.Commands.add('openFresh', (id) => { cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); cy.getDropbox(null, id).find('.vscomp-option.focused').should('not.exist'); + cy.getVs(id).should(($ele) => { + const vs = $ele[0].virtualSelect; + + expect(vs.searchValue, 'search value').to.equal(''); + expect(vs.$optionsContainer.scrollTop, 'options scrollTop').to.equal(0); + }); + cy.getVs(id); }); From fba6917130afacf848a4b48d5f7cca478a605d12 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 00:34:45 +0100 Subject: [PATCH 19/57] fix(a11y): close the dropdown on Escape in every layout (AI-2 / A11Y-02) Escape resolved its containment target to $dropboxWrapper for all non-popup layouts. Under the default `dropboxWrapper: 'self'` there is no $dropboxWrapper, so the guard short-circuited on `undefined` and the key did nothing: on a desktop viewport the dropdown could not be dismissed from the keyboard at all. Pick the element that actually contains the focused node - $dropboxWrapper only when the dropbox is portalled out, $wrapper otherwise. WCAG 2.1.1 Keyboard (A) and 2.1.2 No Keyboard Trap (A). Adds cypress/e2e/a11y-escape-close.cy.ts covering all four layouts (self/desktop, popup, external dropboxWrapper, keepAlwaysOpen); the first three failed before this change. Adds cypress/support/mount.ts, a shared per-test mount helper. (cherry picked from commit dad63ad89a1d0a42605d7482a2806023060e6a3a) --- cypress/e2e/a11y-escape-close.cy.ts | 121 ++++++++++++++++++++++++++++ cypress/support/mount.ts | 48 +++++++++++ src/virtual-select.js | 12 ++- 3 files changed, 179 insertions(+), 2 deletions(-) create mode 100644 cypress/e2e/a11y-escape-close.cy.ts create mode 100644 cypress/support/mount.ts diff --git a/cypress/e2e/a11y-escape-close.cy.ts b/cypress/e2e/a11y-escape-close.cy.ts new file mode 100644 index 00000000..4bab4d3e --- /dev/null +++ b/cypress/e2e/a11y-escape-close.cy.ts @@ -0,0 +1,121 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-2 / [A11Y-02] — WCAG 2.1.1 & 2.1.2 (Level A). + * + * Escape only closed the dropdown when an external `dropboxWrapper` existed or the dropdown + * was shown as a popup. With the default `dropboxWrapper: 'self'` on a desktop viewport the + * guard resolved to `this.$dropboxWrapper`, which is `undefined`, so the branch was skipped + * and the dropdown stayed open — leaving keyboard users with no way to dismiss it. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: Escape closes the dropdown (AI-2)', () => { + const mountId = 'vs-a11y-escape'; + + const isExpanded = (expected: boolean) => + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.attr', 'aria-expanded', String(expected)); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('default config (dropboxWrapper: "self", desktop viewport)', () => { + beforeEach(() => { + // Wider than the 576px popup breakpoint, so showAsPopup is false — the broken path. + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(6), search: true })); + }); + + it('closes when Escape is pressed with focus on the search input', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('not.be.visible'); + }); + + it('closes when Escape is pressed with an option focused', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + // ArrowDown from the search input moves the highlight; the option itself takes DOM focus + // in non-search navigation, so target the focused option directly. + cy.get(`#${mountId}`).find('.vscomp-option').first().focus().type('{esc}'); + + isExpanded(false); + }); + + it('returns focus to the combobox after Escape so the user is not stranded', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); + }); + + // The fix reworked which element containment is tested against, so the two layouts that + // already worked are pinned here to prove they still do. + context('popup layout (viewport below the popup breakpoint)', () => { + it('still closes on Escape', () => { + cy.viewport(480, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(6), search: true })); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + }); + }); + + context('external dropboxWrapper', () => { + it('still closes on Escape when the dropbox is portalled out of the wrapper', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => { + const host = win.document.createElement('div'); + host.id = 'vs-a11y-escape-portal'; + win.document.body.appendChild(host); + + mountVs(win, mountId, { + options: makeOptions(6), + search: true, + dropboxWrapper: '#vs-a11y-escape-portal', + }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + isExpanded(true); + + cy.get('#vs-a11y-escape-portal').find('.vscomp-search-input').focus().type('{esc}'); + + isExpanded(false); + + cy.window().then((win) => win.document.getElementById('vs-a11y-escape-portal')?.remove()); + }); + }); + + context('keepAlwaysOpen', () => { + it('ignores Escape, because the dropdown is not dismissible by design', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { options: makeOptions(6), search: true, keepAlwaysOpen: true }), + ); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('{esc}'); + + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('be.visible'); + }); + }); +}); diff --git a/cypress/support/mount.ts b/cypress/support/mount.ts new file mode 100644 index 00000000..e8480291 --- /dev/null +++ b/cypress/support/mount.ts @@ -0,0 +1,48 @@ +/** cSpell:ignore vscomp */ + +/** + * Shared mount helper for the accessibility/security regression specs. + * + * The docs site is a docsify SPA, so these specs attach their own throwaway host element + * rather than relying on a demo instance whose props may change with the documentation. + * Mounting per-test keeps each assertion tied to an explicit, minimal configuration. + */ + +export type VsOptions = Record; + +/** Remove a previously mounted host (and its instance) so specs can re-mount idempotently. */ +export function unmountVs(win: Window, mountId: string): void { + const existing = win.document.getElementById(mountId); + + if (!existing) { + return; + } + + // Destroy first: an orphaned instance keeps global listeners registered. + const instance = (existing as unknown as { virtualSelect?: { destroy: () => void } }).virtualSelect; + instance?.destroy(); + existing.remove(); +} + +/** + * Create a fresh host element and initialise a VirtualSelect on it. + * + * @returns the host element the instance was mounted on + */ +export function mountVs(win: Window, mountId: string, options: VsOptions): HTMLElement { + unmountVs(win, mountId); + + const $ele = win.document.createElement('div'); + $ele.id = mountId; + win.document.body.appendChild($ele); + + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, ...options }); + + return $ele; +} + +/** Build a simple list of `count` options, values `o1..oN`. */ +export function makeOptions(count: number): Array<{ label: string; value: string }> { + return Array.from({ length: count }, (_, i) => ({ label: `Option ${i + 1}`, value: `o${i + 1}` })); +} diff --git a/src/virtual-select.js b/src/virtual-select.js index 523cbd45..0ce80740 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -619,9 +619,17 @@ export class VirtualSelect { return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if ( wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && From a213eb5a03e01a63bb3012a355f2b58b5419e6f5 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 00:50:06 +0100 Subject: [PATCH 20/57] fix(a11y): expose Select All as a checkbox with state and Space activation (AI-3 / A11Y-04) "Select All" rendered as a bare . Assistive technology saw a generic element with no role and no checked state, so every select/deselect was silent, and Space - the expected activation key for a checkbox - fell through to the page and scrolled it. Only Enter worked. - render role="checkbox" aria-checked="false" on .vscomp-toggle-all-button - sync aria-checked in toggleAllOptionsClass(), the single point all selection paths funnel through, so the exposed state cannot drift from the visual one - accept keyCode 32 alongside 13 and preventDefault so Space no longer scrolls WCAG 4.1.2 Name/Role/Value (A), 1.3.1 Info and Relationships (A), 2.1.1 Keyboard (A). Adds cypress/e2e/a11y-select-all.cy.ts (7 cases, all failing before this change), including that aria-checked follows selection driven from the options themselves. (cherry picked from commit f938209a542e375c462da5738b0d543888963290) --- cypress/e2e/a11y-select-all.cy.ts | 101 ++++++++++++++++++++++++++++++ src/virtual-select.js | 27 +++++++- 2 files changed, 125 insertions(+), 3 deletions(-) create mode 100644 cypress/e2e/a11y-select-all.cy.ts diff --git a/cypress/e2e/a11y-select-all.cy.ts b/cypress/e2e/a11y-select-all.cy.ts new file mode 100644 index 00000000..dca4d319 --- /dev/null +++ b/cypress/e2e/a11y-select-all.cy.ts @@ -0,0 +1,101 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-3 / [A11Y-04] — WCAG 4.1.2, 1.3.1 (Level A) and 2.1.1 (Level A). + * + * "Select All" was a bare : exposed to assistive + * technology as a generic element with no role and no checked state, so its state changes were + * inaudible. It also only responded to Enter — Space, the expected activation key for a + * checkbox, scrolled the page instead. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: Select All exposes checkbox semantics (AI-3)', () => { + const mountId = 'vs-a11y-select-all'; + + const toggleAll = () => cy.get(`#${mountId}`).find('.vscomp-toggle-all-button'); + const selectedCount = () => cy.get(`#${mountId}`).then(($e) => $e[0].virtualSelect.selectedValues.length); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), multiple: true, search: true })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('exposes role="checkbox" with an accessible name', () => { + toggleAll().should('have.attr', 'role', 'checkbox'); + toggleAll().should('have.attr', 'aria-label', 'Select All'); + }); + + it('starts unchecked and reports aria-checked="true" once everything is selected', () => { + toggleAll().should('have.attr', 'aria-checked', 'false'); + + toggleAll().click(); + + toggleAll().should('have.attr', 'aria-checked', 'true'); + selectedCount().should('eq', 5); + }); + + it('returns aria-checked to "false" when toggled back off', () => { + toggleAll().click(); + toggleAll().should('have.attr', 'aria-checked', 'true'); + + toggleAll().click(); + + toggleAll().should('have.attr', 'aria-checked', 'false'); + selectedCount().should('eq', 0); + }); + + it('activates on Space, the expected key for a checkbox', () => { + toggleAll().focus().type(' ', { force: true }); + + selectedCount().should('eq', 5); + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); + + it('still activates on Enter', () => { + toggleAll().focus().type('{enter}', { force: true }); + + selectedCount().should('eq', 5); + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); + + it('calls preventDefault on Space so the page does not scroll', () => { + // Synthetic keys never trigger native scrolling, so asserting scrollY would prove nothing. + // The observable contract is that the component consumed the key. + const prevented: boolean[] = []; + + cy.window().then((win) => { + // Bubble phase on document: runs after the component's wrapper handler, so + // defaultPrevented already reflects whatever that handler decided. + win.document.addEventListener('keydown', (e) => { + if (e.keyCode === 32) { + prevented.push(e.defaultPrevented); + } + }); + }); + + toggleAll().focus().type(' ', { force: true }); + + cy.wrap(null).should(() => { + expect(prevented, 'Space keydown seen and defaultPrevented').to.deep.equal([true]); + }); + }); + + it('reflects aria-checked when selection is driven from the options instead', () => { + toggleAll().should('have.attr', 'aria-checked', 'false'); + + // Select every option individually; Select All must follow along. + makeOptions(5).forEach((o) => { + cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${o.value}"]`).click(); + }); + + toggleAll().should('have.attr', 'aria-checked', 'true'); + }); +}); diff --git a/src/virtual-select.js b/src/virtual-select.js index 0ce80740..2411c002 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -450,7 +450,14 @@ export class VirtualSelect { let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + checkboxHtml = ` ${this.selectAllText} `; @@ -614,7 +621,13 @@ export class VirtualSelect { this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } @@ -3193,7 +3206,15 @@ export class VirtualSelect { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } From 5cf16bbcfb65bd1c0fb6038d86554b2e4b45c877 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 01:03:52 +0100 Subject: [PATCH 21/57] feat(a11y): announce status changes through a per-instance live region (AI-6 / A11Y-03) The stylesheet already shipped a .vscomp-live-region rule, but no code ever created the element: the component had zero live regions, so search result counts, "no results", server-search loading and selection changes were conveyed visually only. - render one visually-hidden role="status" aria-live="polite" aria-atomic="true" region per instance, inside the wrapper so it is torn down with the element - announce match counts and no-results while searching, the loading state and outcome of a server search, and every selection change - track filteredOptionsCount separately: setVisibleOptions() overwrites visibleOptionsCount with the size of the virtualisation window, which is not the number of matches - suppress announcements until construction finishes (isInitialized), so an initial value does not speak on page load, and while focus is outside the search input, so closing the dropdown does not read a stale count - identical consecutive messages are left in place, so "No results found" is not repeated on every further non-matching keystroke Announcement strings are new overridable props for localisation: searchResultsText, searchResultText, noOptionsSelectedText, selectedText, loadingText. Documented in docs/properties.md and the JSDoc typings. WCAG 4.1.3 Status Messages (AA). Adds cypress/e2e/a11y-live-region.cy.ts (14 cases, all failing before this change). (cherry picked from commit 82598ce367545676cee102c2919b42c11c74900a) --- cypress/e2e/a11y-live-region.cy.ts | 165 +++++++++++++++++++++++++++++ docs/properties.md | 5 + src/virtual-select.js | 123 +++++++++++++++++++++ src/virtual-select.types.js | 9 ++ 4 files changed, 302 insertions(+) create mode 100644 cypress/e2e/a11y-live-region.cy.ts diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts new file mode 100644 index 00000000..228d1448 --- /dev/null +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -0,0 +1,165 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-6 / [A11Y-03] — WCAG 4.1.3 Status Messages (AA). + * + * The component shipped a `.vscomp-live-region` rule in the stylesheet but no JavaScript + * ever created the element, so there were zero live regions in the DOM. Search result + * counts, "no results", server-search loading and selection changes were all conveyed + * visually only — a screen reader user typing into the search box heard nothing. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: status announcements via a live region (AI-6)', () => { + const mountId = 'vs-a11y-live'; + + const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), search: true, ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('the region itself', () => { + beforeEach(() => mount()); + + it('creates exactly one polite status region per instance', () => { + liveRegion().should('have.length', 1); + liveRegion().should('have.attr', 'role', 'status'); + liveRegion().should('have.attr', 'aria-live', 'polite'); + // Atomic so the whole message is re-read rather than just the changed words. + liveRegion().should('have.attr', 'aria-atomic', 'true'); + }); + + it('is visually hidden but not hidden from assistive technology', () => { + // aria-hidden / display:none / visibility:hidden would all silence it. + liveRegion().should('not.have.attr', 'aria-hidden'); + liveRegion().should('have.css', 'position', 'absolute'); + liveRegion().invoke('outerWidth').should('be.lessThan', 2); + }); + + it('starts empty so nothing is announced on page load', () => { + liveRegion().should('have.text', ''); + }); + }); + + context('search results', () => { + beforeEach(() => mount()); + + it('announces the number of matches while typing', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option'); + + liveRegion().should('have.text', '5 results available'); + }); + + it('uses the singular form for a single match', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option 3'); + + liveRegion().should('have.text', '1 result available'); + }); + + it('announces the no-results message when the search matches nothing', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('zzzzzz'); + + liveRegion().should('have.text', 'No results found'); + }); + + it('does not announce a stale count when the dropdown is merely closed', () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('zzzzzz'); + liveRegion().should('have.text', 'No results found'); + + // Closing resets the search internally; that must not re-announce a result count. + cy.get(`#${mountId}`).find('.vscomp-search-input').type('{esc}'); + + liveRegion().should('not.have.text', '5 results available'); + }); + + it('honours custom result-count text for localisation', () => { + mount({ searchResultsText: 'Treffer verfügbar', searchResultText: 'Treffer verfügbar' }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option'); + + liveRegion().should('have.text', '5 Treffer verfügbar'); + }); + }); + + context('selection changes', () => { + it('announces the selection summary for a multi-select', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + liveRegion().should('have.text', '1 option selected'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + liveRegion().should('have.text', '2 options selected'); + }); + + it('announces the chosen label for a single select', () => { + mount(); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o3"]').click(); + + liveRegion().should('have.text', 'Option 3 selected'); + }); + + it('announces when the selection is cleared', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + liveRegion().should('have.text', '1 option selected'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + liveRegion().should('have.text', 'No options selected'); + }); + + it('announces the result of Select All', () => { + mount({ multiple: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-toggle-all-button').click(); + + liveRegion().should('have.text', '5 options selected'); + }); + + it('does not announce a value supplied at initialisation', () => { + mount({ selectedValue: 'o2' }); + + liveRegion().should('have.text', ''); + }); + }); + + context('lifecycle', () => { + it('removes the region when the instance is destroyed', () => { + mount(); + liveRegion().should('have.length', 1); + + // Scoped to this instance's region: the docs page hosts other instances, and each + // legitimately owns a live region of its own. + liveRegion() + .invoke('attr', 'id') + .then((regionId) => { + cy.window().then((win) => unmountVs(win, mountId)); + + cy.get(`#${mountId}`).should('not.exist'); + cy.get(`#${regionId}`).should('not.exist'); + }); + }); + }); +}); diff --git a/docs/properties.md b/docs/properties.md index 3b1aef21..48773172 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -105,6 +105,11 @@ Update below properties to change display texts. | optionsSelectedText | String | options selected | Text to use when displaying no.of values selected text (i.e. 3 options selected) | | optionSelectedText | String | option selected | Text to use when displaying no.of values selected text and only one value is selected (i.e. 1 option selected) | | allOptionsSelectedText | String | All | Text to use when displaying all values selected text (i.e. All (10)) | +| searchResultsText | String | results available | Announced in the live region after a search (i.e. 5 results available) | +| searchResultText | String | result available | Singular form of `searchResultsText` (i.e. 1 result available) | +| noOptionsSelectedText | String | No options selected | Announced in the live region when the selection becomes empty | +| selectedText | String | selected | Announced in the live region after a single select choice (i.e. Option 3 selected) | +| loadingText | String | Loading results | Announced in the live region while a server search is in flight | | clearButtonText | String | Clear | Tooltip text for clear button | | moreText | String | more... | Text to show when more than noOfDisplayValues options selected (i.e + 10 more...) | diff --git a/src/virtual-select.js b/src/virtual-select.js index 2411c002..2ea0e6c2 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -57,8 +57,10 @@ const dataProps = [ 'maxValues', 'maxWidth', 'minValues', + 'loadingText', 'moreText', 'noOfDisplayValues', + 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', @@ -75,8 +77,11 @@ const dataProps = [ 'searchGroup', 'searchNormalize', 'searchPlaceholderText', + 'searchResultText', + 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', + 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', @@ -195,6 +200,9 @@ export class VirtualSelect {
+
+ ${this.renderDropbox({ wrapperClasses })}
`; @@ -216,6 +224,7 @@ export class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); 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'); @@ -997,6 +1006,12 @@ export class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1064,6 +1079,10 @@ export class VirtualSelect { } this.focusOption({ focusFirst: true }); + + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { @@ -1155,6 +1174,12 @@ export class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1257,6 +1282,12 @@ export class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1709,6 +1740,11 @@ export class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { @@ -1820,6 +1856,15 @@ export class VirtualSelect { this.validate(); } + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } + if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2041,6 +2086,12 @@ export class VirtualSelect { } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; this.afterSetVisibleOptionsCount(); } @@ -3539,6 +3590,9 @@ export class VirtualSelect { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); + this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3715,6 +3769,75 @@ export class VirtualSelect { ); } + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + + const text = message || ''; + + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + + if (count === 0) { + return this.noSearchResultsText; + } + + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + + if (count === 0) { + return this.noOptionsSelectedText; + } + + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + + this.announce(this.getResultsCountMessage()); + } + toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; diff --git a/src/virtual-select.types.js b/src/virtual-select.types.js index 42657d2a..9245a071 100644 --- a/src/virtual-select.types.js +++ b/src/virtual-select.types.js @@ -98,6 +98,15 @@ * and only one value is selected (i.e. 1 option selected) * @property {string} [allOptionsSelectedText=All] Text to use when displaying all values selected text * (i.e. All (10)) + * @property {string} [searchResultsText='results available'] Announced in the live region after a search + * (i.e. 5 results available) + * @property {string} [searchResultText='result available'] Singular form of searchResultsText + * (i.e. 1 result available) + * @property {string} [noOptionsSelectedText='No options selected'] Announced in the live region when the + * selection becomes empty + * @property {string} [selectedText=selected] Announced in the live region after a single select choice + * (i.e. Option 3 selected) + * @property {string} [loadingText='Loading results'] Announced in the live region while a server search is in flight * @property {string} [clearButtonText=Clear] Tooltip text for clear button * @property {string} [moreText='more...'] Text to show when more than noOfDisplayValues options selected * (i.e + 10 more...) From 8828ffb39f18963992fa0542598aaf36b4bf1046 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:44:37 +0100 Subject: [PATCH 22/57] fix(a11y): expose required and error state, with an announced message (AI-4 / A11Y-07) `required` was never exposed to assistive technology, and a failed validate() only toggled a `has-error` class that recoloured the toggle button border. There was no aria-required, no aria-invalid, no message and no announcement: the failure was conveyed by colour alone and was silent to screen readers. - aria-required on the wrapper from setEleProps() and kept current by toggleRequired() - aria-invalid toggled in validate() - a text error message element per instance, linked via aria-describedby while in error and announced through the live region added in AI-6 - the message plus a leading warning glyph give the non-colour cue Distinguishes the two failure modes: requiredErrorText for an empty required select, minValuesErrorText (with a {count} placeholder) when fewer than minValues are selected. Both are overridable props, documented in docs/properties.md and the JSDoc typings. Adds DomUtils.toggleAria()/removeAttr(): aria-required and aria-invalid are removed rather than written as "false", since some screen readers verbalise a literal false. WCAG 3.3.1 Error Identification (A), 1.4.1 Use of Colour (A), 4.1.2 Name/Role/Value (A). Adds cypress/e2e/a11y-required-error.cy.ts (12 cases; 11 failed before this change). Also completes the HTMLElement typing for the public element API the component attaches in setEleProps(), so specs can drive it the way consumers do. (cherry picked from commit cf9c6c05b63eacf8ca34fafe06147e8f09860c4c) --- cypress/e2e/a11y-required-error.cy.ts | 149 ++++++++++++++++++++++++++ cypress/support/index.d.ts | 21 ++++ docs/properties.md | 2 + src/sass/partials/virtual-select.scss | 27 +++++ src/utils/dom-utils.js | 38 +++++++ src/virtual-select.js | 65 +++++++++-- src/virtual-select.types.js | 4 + 7 files changed, 300 insertions(+), 6 deletions(-) create mode 100644 cypress/e2e/a11y-required-error.cy.ts diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts new file mode 100644 index 00000000..e09dd293 --- /dev/null +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -0,0 +1,149 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-4 / [A11Y-07] — WCAG 3.3.1 (A), 1.4.1 (A) and 4.1.2 (A). + * + * `required` was never exposed: the wrapper carried no aria-required, and a failed + * validate() only toggled a `has-error` class that changed the toggle button's border + * colour. There was no aria-invalid, no error message and no announcement — the failure + * was communicated by colour alone, and not at all to assistive technology. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: required and error state are exposed (AI-4)', () => { + const mountId = 'vs-a11y-required'; + + const wrapper = () => cy.get(`#${mountId}`).find('.vscomp-wrapper'); + const errorMessage = () => cy.get(`#${mountId}`).find('.vscomp-error-message'); + const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); + const validate = () => cy.get(`#${mountId}`).then(($e) => $e[0].validate?.()); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('aria-required', () => { + it('is exposed when the field is required', () => { + mount({ required: true }); + + wrapper().should('have.attr', 'aria-required', 'true'); + }); + + it('is absent when the field is optional', () => { + mount(); + + wrapper().should('not.have.attr', 'aria-required'); + }); + + it('follows toggleRequired() at runtime', () => { + mount(); + wrapper().should('not.have.attr', 'aria-required'); + + cy.get(`#${mountId}`).then(($e) => $e[0].toggleRequired?.(true)); + wrapper().should('have.attr', 'aria-required', 'true'); + + cy.get(`#${mountId}`).then(($e) => $e[0].toggleRequired?.(false)); + wrapper().should('not.have.attr', 'aria-required'); + }); + }); + + context('failed validation', () => { + beforeEach(() => mount({ required: true })); + + it('sets aria-invalid on the combobox', () => { + wrapper().should('not.have.attr', 'aria-invalid'); + + validate(); + + wrapper().should('have.attr', 'aria-invalid', 'true'); + }); + + it('renders a text error message, so the failure is not signalled by colour alone', () => { + validate(); + + errorMessage().should('be.visible'); + errorMessage().should('have.text', 'This field is required'); + }); + + it('associates the message with the combobox via aria-describedby', () => { + validate(); + + errorMessage() + .invoke('attr', 'id') + .then((errorId) => { + wrapper().should('have.attr', 'aria-describedby', errorId); + }); + }); + + it('announces the error', () => { + validate(); + + liveRegion().should('have.text', 'This field is required'); + }); + + it('clears every error affordance once a value is selected', () => { + validate(); + wrapper().should('have.attr', 'aria-invalid', 'true'); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + wrapper().should('not.have.attr', 'aria-invalid'); + wrapper().should('not.have.attr', 'aria-describedby'); + errorMessage().should('not.be.visible'); + }); + + it('honours a custom required message for localisation', () => { + mount({ required: true, requiredErrorText: 'Pflichtfeld' }); + + validate(); + + errorMessage().should('have.text', 'Pflichtfeld'); + }); + }); + + context('minValues', () => { + it('reports how many options are still needed', () => { + mount({ multiple: true, required: true, minValues: 3 }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + validate(); + + errorMessage().should('have.text', 'Select at least 3 options'); + wrapper().should('have.attr', 'aria-invalid', 'true'); + }); + + it('clears once enough options are selected', () => { + mount({ multiple: true, required: true, minValues: 2 }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + validate(); + wrapper().should('have.attr', 'aria-invalid', 'true'); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + wrapper().should('not.have.attr', 'aria-invalid'); + }); + }); + + context('disableValidation', () => { + it('leaves aria-invalid and the message alone', () => { + mount({ required: true, disableValidation: true }); + + validate(); + + wrapper().should('not.have.attr', 'aria-invalid'); + errorMessage().should('not.be.visible'); + }); + }); +}); diff --git a/cypress/support/index.d.ts b/cypress/support/index.d.ts index ad1258f3..66d9b7a9 100644 --- a/cypress/support/index.d.ts +++ b/cypress/support/index.d.ts @@ -1,5 +1,26 @@ +/** + * VirtualSelect.setEleProps() attaches the instance and its public API directly onto the + * host element, so specs can drive a component through the same surface consumers use. + */ interface HTMLElement { virtualSelect?: any; + reset?: (formReset?: boolean, disableChangeEvent?: boolean) => void; + setValue?: (value: any, options?: any) => void; + setOptions?: (options: any[], keepValue?: boolean) => void; + setDisabledOptions?: (disabledOptions: any[], keepValue?: boolean) => void; + setEnabledOptions?: (enabledOptions: any[], keepValue?: boolean) => void; + toggleSelectAll?: (isSelectAll?: boolean) => void; + isAllSelected?: () => boolean; + addOption?: (data: any, rerender?: boolean) => void; + getNewValue?: () => any; + getDisplayValue?: () => any; + getSelectedOptions?: (options?: any) => any; + getDisabledOptions?: () => any; + open?: () => void; + close?: () => void; + destroy?: () => void; + validate?: () => boolean; + toggleRequired?: (isRequired: boolean) => void; } declare namespace Cypress { diff --git a/docs/properties.md b/docs/properties.md index 48773172..3d0dc004 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -110,6 +110,8 @@ Update below properties to change display texts. | noOptionsSelectedText | String | No options selected | Announced in the live region when the selection becomes empty | | selectedText | String | selected | Announced in the live region after a single select choice (i.e. Option 3 selected) | | loadingText | String | Loading results | Announced in the live region while a server search is in flight | +| requiredErrorText | String | This field is required | Validation message shown and announced when a required select has no value | +| minValuesErrorText | String | Select at least {count} options | Validation message when fewer than minValues are selected; {count} is replaced with minValues | | clearButtonText | String | Clear | Tooltip text for clear button | | moreText | String | more... | Text to show when more than noOfDisplayValues options selected (i.e + 10 more...) | diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index d61d1c01..7b6118b2 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -321,6 +321,25 @@ } } +.vscomp-error-message { + align-items: flex-start; + color: v.$error-color; + display: none; + font-size: v.$font-size-small; + gap: 4px; + line-height: 1.4; + padding-top: 4px; + width: 100%; + + /** shape cue, so the failure is not signalled by colour alone */ + &::before { + content: '\26A0'; + flex: none; + font-size: 1.1em; + line-height: 1.2; + } +} + .vscomp-no-options, .vscomp-no-search-results { align-items: center; @@ -572,6 +591,14 @@ .vscomp-toggle-button { border-color: v.$error-color; } + + /** + * The message is the non-colour cue required by WCAG 1.4.1: the border tint alone + * carried the whole meaning before. The leading glyph adds a second, shape-based cue. + */ + .vscomp-error-message { + display: flex; + } } &.show-value-as-tags { diff --git a/src/utils/dom-utils.js b/src/utils/dom-utils.js index 330e6b6a..53b85230 100644 --- a/src/utils/dom-utils.js +++ b/src/utils/dom-utils.js @@ -132,6 +132,44 @@ export class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + + DomUtils.getElements($ele).forEach(($this) => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to diff --git a/src/virtual-select.js b/src/virtual-select.js index 2ea0e6c2..be7f27bc 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -58,6 +58,7 @@ const dataProps = [ 'maxWidth', 'minValues', 'loadingText', + 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', @@ -70,6 +71,7 @@ const dataProps = [ 'popupDropboxBreakpoint', 'popupPosition', 'position', + 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', @@ -203,6 +205,8 @@ export class VirtualSelect {
+
+ ${this.renderDropbox({ wrapperClasses })}
`; @@ -225,6 +229,7 @@ export class VirtualSelect { this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1180,6 +1185,8 @@ export class VirtualSelect { this.noOptionsSelectedText = options.noOptionsSelectedText; this.selectedText = options.selectedText; this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1288,6 +1295,9 @@ export class VirtualSelect { noOptionsSelectedText: 'No options selected', selectedText: 'selected', loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', @@ -1346,6 +1356,8 @@ export class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -3634,22 +3646,55 @@ export class VirtualSelect { } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if ( - this.required && - (Utils.isEmpty(selectedValues) || + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { /** required minium options not selected */ - (this.multiple && minValues && selectedValues.length < minValues)) - ) { - hasError = true; + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); + return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + + const text = message || ''; + + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3841,6 +3886,14 @@ export class VirtualSelect { toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { diff --git a/src/virtual-select.types.js b/src/virtual-select.types.js index 9245a071..d5e769f7 100644 --- a/src/virtual-select.types.js +++ b/src/virtual-select.types.js @@ -107,6 +107,10 @@ * @property {string} [selectedText=selected] Announced in the live region after a single select choice * (i.e. Option 3 selected) * @property {string} [loadingText='Loading results'] Announced in the live region while a server search is in flight + * @property {string} [requiredErrorText='This field is required'] Validation message shown and announced when a + * required select has no value + * @property {string} [minValuesErrorText='Select at least {count} options'] Validation message when fewer than + * minValues options are selected; {count} is replaced with minValues * @property {string} [clearButtonText=Clear] Tooltip text for clear button * @property {string} [moreText='more...'] Text to show when more than noOfDisplayValues options selected * (i.e + 10 more...) From f08a9f6d83fe6013c3a222888cc9962036497d1d Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:52:58 +0100 Subject: [PATCH 23/57] feat(security): page-level defaults so a host can enable escaping centrally (AI-1 / SEC-01) Option label/value/description are interpolated into innerHTML and secureText() is a no-op unless enableSecureText is on, which it is not by default. Until now a host application had no way to turn escaping on for every dropdown at once; it had to remember the flag at each call site, and missing one reintroduces DOM XSS for untrusted option text. Adds VirtualSelect.setGlobalDefaults(props) / getGlobalDefaults(), applied under per-instance options: per-instance options > page-level globals > built-in defaults Deliberately non-breaking: the per-instance default for enableSecureText stays off, so consumers who intentionally render HTML/icon labels, and large trusted lists that should not pay the per-option escaping cost, are unaffected. No version bump needed. Because these are defaults rather than overrides, a host that forwards enableSecureText on every init() call must stop forwarding it (or forward true) for the global to take effect. Called out in the method docs, since it decides whether the mechanism actually helps. setGlobalDefaults ignores `ele` and `options`, which are per-instance by nature and would otherwise alias state across instances. Defaults derived from another prop (zIndex from keepAlwaysOpen, and the hasOptionDescription sizing) now resolve through the same precedence chain, so a global drives them too. Documented in docs/methods.md, cross-referenced from the security note in docs/properties.md. Adds cypress/e2e/security-global-defaults.cy.ts (8 cases), covering that a payload still executes with the default config, is neutralised once the global is set, and that an explicit per-instance false opts back out. Existing security specs still pass. (cherry picked from commit 49971b10bc20319e17aa74360d5338ac504e2970) --- cypress/e2e/security-global-defaults.cy.ts | 148 +++++++++++++++++++++ docs/methods.md | 26 ++++ docs/properties.md | 1 + src/virtual-select.js | 67 +++++++++- 4 files changed, 239 insertions(+), 3 deletions(-) create mode 100644 cypress/e2e/security-global-defaults.cy.ts diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts new file mode 100644 index 00000000..28176ff2 --- /dev/null +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -0,0 +1,148 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-1 / [SEC-01] — OWASP A03:2021 (Injection) / DOM XSS. + * + * Option label/value/description are interpolated into innerHTML, and `secureText()` is a + * no-op unless `enableSecureText` is on — which it is not by default. A host application + * previously had no way to turn escaping on for every dropdown at once; it had to remember + * the flag at each of possibly hundreds of call sites. + * + * VirtualSelect.setGlobalDefaults() closes that gap without changing the per-instance + * default, so existing consumers who deliberately render HTML labels are unaffected. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: global defaults for enableSecureText (AI-1)', () => { + const mountId = 'vs-sec-global'; + const payload = ''; + + const resetGlobals = (win: Window) => { + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.setGlobalDefaults({}); + // @ts-expect-error - test marker + win.__vsGlobalXss = undefined; + }; + + const mountWithPayload = (win: Window, extra: Record = {}) => + mountVs(win, mountId, { options: [{ label: payload, value: 'p1' }], ...extra }); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then(resetGlobals); + }); + + afterEach(() => { + cy.window().then((win) => { + unmountVs(win, mountId); + resetGlobals(win); + }); + }); + + it('exposes setGlobalDefaults and getGlobalDefaults', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + expect(win.VirtualSelect.setGlobalDefaults).to.be.a('function'); + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults).to.be.a('function'); + }); + }); + + it('still renders option text as raw HTML by default, so behaviour is unchanged', () => { + cy.window().then((win) => mountWithPayload(win)); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + // The documented, insecure-by-default behaviour: a real element is created. + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] img[src="x"]').should('exist'); + }); + + it('escapes option text for instances created after a global default is set', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + mountWithPayload(win); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"]').should('exist'); + cy.get(`#${mountId}`).find('img[src="x"]').should('not.exist'); + // The payload is visible as text rather than parsed as markup. + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] .vscomp-option-text').should('contain', 'img'); + + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__vsGlobalXss, 'payload must not execute').to.not.eq(true); + }); + }); + + it('lets an explicit per-instance option override the global default', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // Opting back out for a trusted, HTML-rendering list. + mountWithPayload(win, { enableSecureText: false }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] img[src="x"]').should('exist'); + }); + + it('merges successive calls rather than replacing the whole set', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ placeholder: 'Pick one' }); + // @ts-expect-error - bundle global + const globals = win.VirtualSelect.getGlobalDefaults(); + + expect(globals).to.deep.include({ enableSecureText: true, placeholder: 'Pick one' }); + }); + }); + + it('applies to any prop, not just enableSecureText', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ placeholder: 'Choose a value' }); + mountVs(win, mountId, { options: [{ label: 'One', value: '1' }] }); + }); + + // `contain`, not `have.text`: the value template renders with surrounding whitespace. + cy.get(`#${mountId}`).find('.vscomp-value').should('contain', 'Choose a value'); + }); + + it('returns a copy from getGlobalDefaults, so callers cannot mutate internal state', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + // @ts-expect-error - bundle global + const globals = win.VirtualSelect.getGlobalDefaults(); + globals.enableSecureText = false; + + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults().enableSecureText).to.eq(true); + }); + }); + + it('suppresses the insecure-by-default console warning when the global default is on', () => { + cy.window().then((win) => { + // @ts-expect-error - internal flag reset so the once-per-page guard does not hide the result + win.VirtualSelect.secureTextWarningShown = false; + cy.spy(win.console, 'warn').as('consoleWarn'); + + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + mountWithPayload(win); + }); + + cy.get('@consoleWarn').should((spy: any) => { + const messages = spy.getCalls().map((c: any) => String(c.args[0])); + expect(messages.filter((m: string) => m.includes('enableSecureText'))).to.have.length(0); + }); + }); +}); diff --git a/docs/methods.md b/docs/methods.md index f2297014..45075e7a 100644 --- a/docs/methods.md +++ b/docs/methods.md @@ -22,6 +22,7 @@ - [setServerOptions()](#setserveroptions) - [validate()](#validate) - [toggleRequired()](#togglerequired) +- [VirtualSelect.setGlobalDefaults()](#virtualselectsetglobaldefaults) ### Get selected value @@ -268,3 +269,28 @@ To update required property value ```js document.querySelector('#sample-select').toggleRequired(true); ``` + +### VirtualSelect.setGlobalDefaults() + +Set default props applied to every instance created afterwards, so a page-wide policy does not +have to be repeated at each call site. + +The main use is security. Option `label`, `value` and `description` are inserted as raw HTML and +are only escaped when `enableSecureText` is on, which is **not** the default (escaping runs per +option and is measurable on 10k-100k+ lists). If any option text in your app can come from +untrusted input, turn it on once during startup: + +```js +VirtualSelect.setGlobalDefaults({ enableSecureText: true }); +``` + +Notes: + +- These are **defaults, not overrides**. An instance that passes the prop explicitly still wins, + so if your wrapper forwards `enableSecureText` on every `init()` call it must stop doing so (or + forward `true`) for the global to take effect. +- Only instances created **after** the call are affected. Call it before initialising dropdowns. +- Calls **merge**, so unrelated settings can be configured separately. +- `ele` and `options` are ignored, being inherently per-instance. + +Read the current values with `VirtualSelect.getGlobalDefaults()`, which returns a copy. diff --git a/docs/properties.md b/docs/properties.md index 3d0dc004..1017d02d 100644 --- a/docs/properties.md +++ b/docs/properties.md @@ -7,6 +7,7 @@ > - Set **`enableSecureText: true`** whenever options may contain user-supplied/untrusted text. It escapes the built-in option fields (**label**, **value**, and **description**). Note: `customData` is stored as-is (except where the library itself interpolates it, e.g. into the option `aria-label`), and any HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized — escape those yourself. > - It is **off by default on purpose**: escaping runs per option and adds measurable cost on **large datasets (10k–100k+ records)**. For large lists of *trusted, developer-controlled* data you can leave it off. > - When it is off, the plugin logs a **one-time** console warning (per page) on initialization so the trade-off is discoverable. Set **`showSecureTextWarning: false`** to suppress it once you have consciously accepted the trade-off. +> - To turn escaping on for **every** dropdown at once instead of per call site, use [`VirtualSelect.setGlobalDefaults({ enableSecureText: true })`](methods.md#virtualselectsetglobaldefaults) during startup. Note it sets a *default*: an instance passing `enableSecureText` explicitly still wins. | Name | Type | Default value | Description | | --------------------------------- | ----------------- | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | diff --git a/src/virtual-select.js b/src/virtual-select.js index be7f27bc..4c5cefde 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1266,6 +1266,17 @@ export class VirtualSelect { * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = (key) => (options[key] !== undefined ? options[key] : globalDefaults[key]); + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); + const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1301,7 +1312,7 @@ export class VirtualSelect { allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1324,12 +1335,17 @@ export class VirtualSelect { hideDuration: 200, }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { @@ -3927,6 +3943,48 @@ export class VirtualSelect { } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { ...props }; + delete safeProps.ele; + delete safeProps.options; + + VirtualSelect.globalDefaults = { ...VirtualSelect.globalDefaults, ...safeProps }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { ...VirtualSelect.globalDefaults }; + } + static init(options) { let $eleArray = options.ele; @@ -4208,6 +4266,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; From a80d531cff07deab71c4ca5bf84bf1585f5e6908 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:55:07 +0100 Subject: [PATCH 24/57] fix(a11y): advertise multi-selection on the listbox (AI-10 / A11Y-06) The options container carried role="listbox" but no aria-multiselectable, so assistive technology presented a multi-select dropdown with single-select semantics: users had no way to know more than one option could be chosen. Emit aria-multiselectable="true" only in multiple mode; a single select correctly omits the attribute rather than declaring "false". WCAG 4.1.2 Name, Role, Value (A). Adds cypress/e2e/a11y-listbox-multiselectable.cy.ts, including the case where `multiple` comes from the host element's attribute rather than the options object. (cherry picked from commit 4e8be9937dc489210f8157354b62a56867f329db) --- .../e2e/a11y-listbox-multiselectable.cy.ts | 57 +++++++++++++++++++ src/virtual-select.js | 3 +- 2 files changed, 59 insertions(+), 1 deletion(-) create mode 100644 cypress/e2e/a11y-listbox-multiselectable.cy.ts diff --git a/cypress/e2e/a11y-listbox-multiselectable.cy.ts b/cypress/e2e/a11y-listbox-multiselectable.cy.ts new file mode 100644 index 00000000..b19f9e27 --- /dev/null +++ b/cypress/e2e/a11y-listbox-multiselectable.cy.ts @@ -0,0 +1,57 @@ +/** cSpell:ignore vscomp multiselectable */ + +/** + * Regression test for AI-10 / [A11Y-06] — WCAG 4.1.2 (A). + * + * The options container carries role="listbox" but never advertised that more than one + * option could be chosen, so assistive technology presented a multi-select dropdown with + * single-select semantics. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('A11y: listbox advertises multi-selection (AI-10)', () => { + const mountId = 'vs-a11y-multiselectable'; + + const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('sets aria-multiselectable="true" in multiple mode', () => { + mount({ multiple: true }); + + listbox().should('have.attr', 'role', 'listbox'); + listbox().should('have.attr', 'aria-multiselectable', 'true'); + }); + + it('omits aria-multiselectable for a single select', () => { + mount(); + + listbox().should('have.attr', 'role', 'listbox'); + listbox().should('not.have.attr', 'aria-multiselectable'); + }); + + it('still applies when multiple comes from the element attribute', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => { + const $ele = win.document.createElement('div'); + $ele.id = mountId; + $ele.setAttribute('multiple', ''); + win.document.body.appendChild($ele); + + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.init({ ele: $ele, options: makeOptions(5) }); + }); + + listbox().should('have.attr', 'aria-multiselectable', 'true'); + }); +}); diff --git a/src/virtual-select.js b/src/virtual-select.js index 4c5cefde..21e0f176 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -263,7 +263,8 @@ export class VirtualSelect {
-
+
From e9b1d1f560188fba04e6815eca285f21aff6ee2f Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 07:58:37 +0100 Subject: [PATCH 25/57] fix(a11y): raise Select All and tag clear buttons to the 24x24 target minimum (AI-11 / A11Y-13) Two pointer targets were below the WCAG minimum: "Select All" collapsed to its 25x15 content box, and the per-tag clear button was 20x20 - under half the required area for users with limited dexterity. - add $min-target-size (24px) and route $value-tag-clear-width through it, so the clear button and the tag content's width calc stay consistent from one variable - give .vscomp-toggle-all-button a min-height/min-width floor rather than a fixed size, so the hit area grows without scaling the checkbox glyph inside it RTL needs no counterpart: rtl.scss only adjusts alignment and spacing, not sizes. WCAG 2.5.8 Target Size (Minimum), AA. Adds cypress/e2e/a11y-target-size.cy.ts. Alongside the three size assertions (which failed before this change) it pins two behaviours, so a future size change cannot leak into layout or break the control: the clear button still removes its own tag, and the visible tag stays compact. (cherry picked from commit 73c088c2fc7a46e1707698261699f3c23c515f6d) --- cypress/e2e/a11y-target-size.cy.ts | 90 +++++++++++++++++++++++++++ src/sass/partials/variable.scss | 4 +- src/sass/partials/virtual-select.scss | 7 +++ 3 files changed, 100 insertions(+), 1 deletion(-) create mode 100644 cypress/e2e/a11y-target-size.cy.ts diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts new file mode 100644 index 00000000..b513725e --- /dev/null +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -0,0 +1,90 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-11 / [A11Y-13] — WCAG 2.5.8 Target Size (Minimum), AA. + * + * Two controls were smaller than the 24x24 CSS px minimum: the "Select All" checkbox + * (measured 25x15) and the per-tag clear button (20x20). Both are pointer targets, so + * users with limited dexterity had to hit a target under half the required area. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +const MIN_TARGET = 24; + +describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { + const mountId = 'vs-a11y-target-size'; + + /** Assert both dimensions of the first match are at least 24 CSS px. */ + const assertMinTarget = (selector: string, label: string) => { + cy.get(`#${mountId}`) + .find(selector) + .first() + .then(($el) => { + const rect = $el[0].getBoundingClientRect(); + + expect(rect.width, `${label} width`).to.be.at.least(MIN_TARGET); + expect(rect.height, `${label} height`).to.be.at.least(MIN_TARGET); + }); + }; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), ...extra })); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('gives the Select All checkbox a large enough target', () => { + mount({ multiple: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + assertMinTarget('.vscomp-toggle-all-button', 'Select All button'); + }); + + it('gives the Select All checkbox a large enough target without a search input', () => { + mount({ multiple: true, search: false }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + assertMinTarget('.vscomp-toggle-all-button', 'Select All button (no search)'); + }); + + it('gives each tag clear button a large enough target', () => { + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get(`#${mountId}`).find('.vscomp-value-tag-clear-button').should('exist'); + assertMinTarget('.vscomp-value-tag-clear-button', 'tag clear button'); + }); + + it('keeps the tag clear button usable: it still removes its tag', () => { + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + cy.get(`#${mountId}`).find('.vscomp-value-tag').should('have.length', 2); + + cy.get(`#${mountId}`).find('.vscomp-value-tag-clear-button').first().click(); + + cy.get(`#${mountId}`).find('.vscomp-value-tag').should('have.length', 1); + }); + + it('does not enlarge the tag itself beyond its content', () => { + // The target grows, the visual tag should stay compact - a regression here would mean + // the fix leaked into layout rather than the hit area. + mount({ multiple: true, showValueAsTags: true, search: true }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get(`#${mountId}`) + .find('.vscomp-value-tag') + .first() + .then(($tag) => { + expect($tag[0].getBoundingClientRect().height, 'tag height').to.be.lessThan(40); + }); + }); +}); diff --git a/src/sass/partials/variable.scss b/src/sass/partials/variable.scss index 28334fa3..e7bd48eb 100644 --- a/src/sass/partials/variable.scss +++ b/src/sass/partials/variable.scss @@ -19,7 +19,9 @@ $search-height: 40px; $checkbox-full-width: 25px; $new-option-icon-width: 30px; $search-clear-width: 30px; -$value-tag-clear-width: 20px; +/** WCAG 2.5.8 Target Size (Minimum), AA - floor for pointer targets */ +$min-target-size: 24px; +$value-tag-clear-width: $min-target-size; $option-height: 40px; $arrow-width: 30px; $arrow-size: 8px; diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 7b6118b2..3e8ffad3 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -446,6 +446,13 @@ align-items: center; cursor: pointer; display: flex; + /** + * WCAG 2.5.8: the button previously collapsed to its 25x15 content box. + * A min-* floor grows the hit area without scaling the checkbox glyph inside it. + */ + justify-content: center; + min-height: v.$min-target-size; + min-width: v.$min-target-size; } .vscomp-search-input, From 04abbe9ce01d32fbb392c408f8218e0b5c8bd15c Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 13:34:19 +0100 Subject: [PATCH 26/57] fix(a11y): navigate options with the arrows from the search input (AI-7 / A11Y-01 + A11Y-05) Opening the dropdown focuses the search input, and both arrow handlers early-returned in exactly that state so the caret could move. The consequence was that in the default flow the arrows did nothing at all: no option could ever be highlighted from the keyboard, and nothing was announced. A user had to discover an undocumented Tab into the listbox first. WCAG 2.1.1 (A). The highlight was also published as aria-activedescendant on the wrapper and on $dropboxContainer - a plain div with no role, where the attribute is meaningless - and never on the element that actually held focus, so the active option was not conveyed even once navigation did work. WCAG 4.1.2 (A). - Up/Down now drive the list while DOM focus stays in the field (WAI-ARIA APG editable-combobox), via a shared navigateOptions() - the search input becomes a combobox over the listbox: role="combobox", aria-autocomplete="list", aria-expanded kept in sync on open/close, and aria-controls pointing at the options container, which needed an id - aria-activedescendant is written to the wrapper and the search input through one setActiveDescendant() helper, and no longer to the role-less container; it is cleared when the highlight is removed and when the dropdown closes BEHAVIOUR CHANGE, user-visible: Up/Down in the search input no longer move the text caret. Home/End and Left/Right do, and are unchanged. This reverses a deliberate earlier decision, because that decision is what caused the Level A failure above. It must be called out in the 1.4.0 release notes. Adds cypress/e2e/a11y-search-arrow-navigation.cy.ts (12 cases; 9 failed before this change), opted into testIsolation so leftover focus between cases cannot make the focus assertions flaky. examples.cy.ts updates, all test-side, none loosening a real assertion: - aria-activedescendant assertions retargeted from the role-less container to the combobox, plus a new assertion that the container does not carry it. The old assertion encoded the A11Y-05 defect. - the Up/Down caret cases moved to Home/End, with added assertions that the arrows now highlight an option and that focus stays in the field. The old cases encoded A11Y-01. - press counts reduced by one where the first press used to be swallowed, and a known starting state added per keyboard case since cy.open() toggles. - one racy press replaced with a real key press: the virtualiser replaces .vscomp-option nodes on every render, so chaining .type() onto them races the rebuild. Suite: 306 tests, 304 pass, 2 fail. Both remaining failures are pre-existing and fail identically at baseline 992f6a9; a third baseline failure ("keeps focus on the last option when navigating past the end of the list") is fixed by this change. Also adds the versioned post-remediation assessment (AUDIT-REPORT-v1.4.0.md) and updates ACTION-ITEMS.md with status plus five follow-ups, notably that SEC-01 is still live for the OutSystems wrapper because it forwards enableSecureText explicitly. (cherry picked from commit 5dd2a4eafa9411e031c29a9c4f6c0e276bc46049) --- .../e2e/a11y-search-arrow-navigation.cy.ts | 207 ++++++++++++++++++ cypress/e2e/a11y-target-size.cy.ts | 12 +- cypress/e2e/examples.cy.ts | 106 ++++++--- src/virtual-select.js | 72 +++--- 4 files changed, 334 insertions(+), 63 deletions(-) create mode 100644 cypress/e2e/a11y-search-arrow-navigation.cy.ts diff --git a/cypress/e2e/a11y-search-arrow-navigation.cy.ts b/cypress/e2e/a11y-search-arrow-navigation.cy.ts new file mode 100644 index 00000000..7cf0db7b --- /dev/null +++ b/cypress/e2e/a11y-search-arrow-navigation.cy.ts @@ -0,0 +1,207 @@ +/** cSpell:ignore vscomp activedescendant combobox autocomplete */ + +/** + * Regression test for AI-7 / [A11Y-01 + A11Y-05] — WCAG 2.1.1 (A) and 4.1.2 (A). + * + * Opening the dropdown puts focus in the search input, and both arrow handlers + * early-returned in that state, so ArrowDown/ArrowUp did nothing at all: no option was + * highlighted and nothing was announced. Users had to discover an undocumented Tab into + * the listbox first. + * + * The highlight was also published as aria-activedescendant on the wrapper and on the + * role-less $dropboxContainer, never on the element that actually had focus, so even when + * navigation did work the active option was not conveyed. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +/** + * testIsolation is disabled project-wide, but these cases repeatedly open, filter and close + * a dropdown while asserting on focus. Leftover focus and pending re-renders from a previous + * case leak across tests and make the focus assertions flaky for reasons unrelated to the + * component, so this spec asks for a clean page per test. + */ +describe('A11y: arrow-key navigation from the search input (AI-7)', { testIsolation: true }, () => { + const mountId = 'vs-a11y-search-arrows'; + + const searchInput = () => cy.get(`#${mountId}`).find('.vscomp-search-input'); + const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); + const focusedOption = () => cy.get(`#${mountId}`).find('.vscomp-option.focused'); + + /** aria-activedescendant on the search input must name the highlighted option. */ + const assertActiveDescendantMatchesHighlight = () => { + focusedOption() + .invoke('attr', 'id') + .then((optionId) => { + expect(optionId, 'highlighted option has an id').to.be.a('string'); + searchInput().should('have.attr', 'aria-activedescendant', optionId); + }); + }; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5), search: true, ...extra })); + }; + + const open = () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + searchInput().focus(); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + context('search input semantics', () => { + beforeEach(() => { + mount(); + open(); + }); + + it('is a combobox controlling the listbox', () => { + searchInput().should('have.attr', 'role', 'combobox'); + searchInput().should('have.attr', 'aria-autocomplete', 'list'); + + listbox() + .invoke('attr', 'id') + .then((listboxId) => { + expect(listboxId, 'listbox has an id to point at').to.be.a('string'); + searchInput().should('have.attr', 'aria-controls', listboxId); + }); + }); + + it('reports the expanded state', () => { + searchInput().should('have.attr', 'aria-expanded', 'true'); + + searchInput().type('{esc}'); + + searchInput().should('have.attr', 'aria-expanded', 'false'); + }); + + it('does not publish the highlight on the role-less dropbox container', () => { + searchInput().type('{downarrow}'); + + // aria-activedescendant on an element with no listbox/combobox role is meaningless. + cy.get(`#${mountId}`).find('.vscomp-dropbox-container').should('not.have.attr', 'aria-activedescendant'); + }); + }); + + context('ArrowDown / ArrowUp', () => { + beforeEach(() => { + mount(); + open(); + }); + + it('highlights the first option on ArrowDown and announces it', () => { + searchInput().type('{downarrow}'); + + focusedOption().should('have.attr', 'data-value', 'o1'); + assertActiveDescendantMatchesHighlight(); + }); + + it('keeps DOM focus in the search input, so typing continues to work', () => { + searchInput().type('{downarrow}'); + + // The point of driving the highlight by aria-activedescendant: focus never leaves + // the field, so the user can keep filtering. + cy.focused().should('have.class', 'vscomp-search-input'); + + // Deliberately a single character. Each keystroke re-renders the option list and can + // trigger a scroll-driven re-render on top of that, which Cypress's batched typing + // outruns - a multi-character type() here drops characters and makes the test flaky + // for reasons that have nothing to do with the component. One character proves the + // contract: the field still receives input and the highlight follows the filtered set. + searchInput().type('4'); + + searchInput().should('have.value', '4'); + cy.focused().should('have.class', 'vscomp-search-input'); + focusedOption().should('have.attr', 'data-value', 'o4'); + }); + + it('moves down through the options', () => { + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o1'); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o2'); + assertActiveDescendantMatchesHighlight(); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o3'); + }); + + it('moves back up through the options', () => { + searchInput().type('{downarrow}{downarrow}{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o3'); + + searchInput().type('{uparrow}'); + + focusedOption().should('have.attr', 'data-value', 'o2'); + assertActiveDescendantMatchesHighlight(); + }); + + it('selects the highlighted option with Enter', () => { + searchInput().type('{downarrow}{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o2'); + + searchInput().type('{enter}'); + + cy.get(`#${mountId}`).then(($e) => { + expect($e[0].virtualSelect.selectedValues).to.deep.equal(['o2']); + }); + }); + + it('tracks the filtered set after typing', () => { + searchInput().type('Option 4'); + + searchInput().type('{downarrow}'); + + focusedOption().should('have.attr', 'data-value', 'o4'); + assertActiveDescendantMatchesHighlight(); + }); + + it('clears aria-activedescendant when the dropdown closes', () => { + searchInput().type('{downarrow}'); + searchInput().should('have.attr', 'aria-activedescendant').and('not.be.empty'); + + searchInput().type('{esc}'); + + cy.get(`#${mountId}`) + .find('.vscomp-search-input') + .should(($input) => { + expect($input.attr('aria-activedescendant') || '').to.equal(''); + }); + }); + }); + + context('multi-select', () => { + it('navigates and selects without closing the dropdown', () => { + mount({ multiple: true }); + open(); + + searchInput().type('{downarrow}'); + focusedOption().should('have.attr', 'data-value', 'o1'); + searchInput().type('{enter}'); + + searchInput().type('{downarrow}'); + searchInput().type('{enter}'); + + cy.get(`#${mountId}`).then(($e) => { + expect($e[0].virtualSelect.selectedValues).to.have.members(['o1', 'o2']); + }); + searchInput().should('have.attr', 'aria-expanded', 'true'); + }); + }); + + context('keyboard navigation without a search input', () => { + it('still works when search is disabled', () => { + mount({ search: false }); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { keyCode: 40, which: 40 }); + + focusedOption().should('exist'); + }); + }); +}); diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts index b513725e..c80e3b48 100644 --- a/cypress/e2e/a11y-target-size.cy.ts +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -15,7 +15,13 @@ const MIN_TARGET = 24; describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { const mountId = 'vs-a11y-target-size'; - /** Assert both dimensions of the first match are at least 24 CSS px. */ + /** + * Assert both dimensions of the first match are at least 24 CSS px. + * + * getBoundingClientRect() returns fractional values (a 24px box can measure + * 23.999998 under device-pixel rounding), so compare on rounded values - otherwise the + * assertion fails on sub-pixel noise rather than on a real target-size problem. + */ const assertMinTarget = (selector: string, label: string) => { cy.get(`#${mountId}`) .find(selector) @@ -23,8 +29,8 @@ describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { .then(($el) => { const rect = $el[0].getBoundingClientRect(); - expect(rect.width, `${label} width`).to.be.at.least(MIN_TARGET); - expect(rect.height, `${label} height`).to.be.at.least(MIN_TARGET); + expect(Math.round(rect.width), `${label} width`).to.be.at.least(MIN_TARGET); + expect(Math.round(rect.height), `${label} height`).to.be.at.least(MIN_TARGET); }); }; diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 08f8f2b3..656caf47 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -161,10 +161,19 @@ describe('Accessibility attributes - virtualized options metadata', () => { .should('exist') .as('listboxContainer'); + // aria-activedescendant belongs on the element that holds focus and has a role that + // supports it - here the role="combobox" wrapper. It used to be asserted on + // .vscomp-dropbox-container, a plain div with no role, where it is meaningless + // (audit A11Y-05). That container is now checked for its *absence* below. + cy.getVs(id) + .find('.vscomp-ele-wrapper') + .should('exist') + .as('activeDescendantHost'); + cy.getDropbox(null, id) .parent('.vscomp-dropbox-container') .should('exist') - .as('listboxRegion'); + .as('roleLessContainer'); // Get the combobox wrapper ID for reference cy.getVs(id) @@ -195,12 +204,15 @@ describe('Accessibility attributes - virtualized options metadata', () => { .invoke('attr', 'id') .as('firstOptionId'); - // Verify aria-activedescendant is set on listbox container when option is focused + // Verify aria-activedescendant names the focused option on the combobox cy.get('@firstOptionId').then((firstOptionId) => { - cy.get('@listboxRegion') + cy.get('@activeDescendantHost') .should('have.attr', 'aria-activedescendant', firstOptionId); }); + // ...and is not published on the role-less container (audit A11Y-05) + cy.get('@roleLessContainer').should('not.have.attr', 'aria-activedescendant'); + // Navigate to second option using arrow key cy.get('@firstOption').type('{downarrow}'); cy.wait(100); // Wait for focus to update @@ -219,7 +231,7 @@ describe('Accessibility attributes - virtualized options metadata', () => { // Verify aria-activedescendant updates to second option cy.get('@secondOptionId').then((secondOptionId) => { - cy.get('@listboxRegion') + cy.get('@activeDescendantHost') .should('have.attr', 'aria-activedescendant', secondOptionId); }); @@ -230,31 +242,39 @@ describe('Accessibility attributes - virtualized options metadata', () => { /** - * Arrow key behavior tests for search input - * Tests the fix that allows normal cursor movement in search input - * while preserving option navigation when focus moves away from search + * Arrow key behavior tests for search input. + * + * Up/Down in the search input navigate the option list (WAI-ARIA APG editable-combobox), + * which is what audit finding A11Y-01 required: they used to be swallowed so that no option + * could ever be highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in + * the field is served by Left/Right and Home/End, covered by the suites below. */ describe('Arrow key behavior in search input - cursor movement', () => { const idMultiple = 'multiple-select' - it('should allow cursor movement to beginning with up arrow in search input', () => { + it('moves the caret to the beginning with Home, and navigates options with Up arrow', () => { cy.open(idMultiple); // Type some text in search input cy.getVs(idMultiple).typeValue('ption 9', true); - // Press Up arrow - should move cursor to beginning - cy.getVs(idMultiple).pressKeys('ArrowUp'); + // Home moves the caret to the beginning (Up arrow now drives the option list instead) + cy.getVs(idMultiple).pressKeys('Home'); // Type 'O' at cursor position (should be at beginning) cy.getVs(idMultiple).typeValue('O'); // Verify the text has 'O' at the beginning cy.getVs(idMultiple).checkOptionLabelExists('Option 9'); + + // Up/Down highlight an option without taking focus out of the field + cy.getVs(idMultiple).pressKeys('ArrowDown'); + cy.getDropbox(null, idMultiple).find('.vscomp-option.focused').should('exist'); + cy.checkActiveElementHasClass('vscomp-search-input'); }); - it('should allow cursor movement to end with down arrow in search input', () => { - // Clear and test Down arrow - use actual dropdown data + it('moves the caret to the end with End key in search input', () => { + // Clear and test End - use actual dropdown data cy.getVs(idMultiple).typeValue('Option 1', true); - // Press Down arrow - should move cursor to end - cy.getVs(idMultiple).pressKeys('ArrowDown'); + // End moves the caret to the end (Down arrow now drives the option list instead) + cy.getVs(idMultiple).pressKeys('End'); // Type '0' at cursor position (should be at end, making "Option 10") cy.getVs(idMultiple).typeValue('0'); // Verify the text has '0' at the end @@ -343,18 +363,22 @@ describe('Arrow key behavior - Home and End keys in search input', () => { describe('Arrow key behavior - focus management and accessibility', () => { const idMultiple = 'multiple-select' - it('should allow normal text editing with arrow keys in search', () => { + it('should allow normal text editing in search while arrows navigate the list', () => { cy.open(idMultiple); // Clear and test more text editing using realistic data cy.getVs(idMultiple).typeValue('tion 123', true); - // Use Up arrow to go to beginning - cy.getVs(idMultiple).pressKeys('ArrowUp'); + // Home goes to the beginning (Up/Down are option navigation, per A11Y-01) + cy.getVs(idMultiple).pressKeys('Home'); cy.getVs(idMultiple).typeValue('Op'); cy.getVs(idMultiple).checkOptionLabelExists('Option 123'); - // Use Down arrow to go to end - cy.getVs(idMultiple).pressKeys('ArrowDown'); + // End goes back to the end + cy.getVs(idMultiple).pressKeys('End'); cy.getVs(idMultiple).typeValue('44'); cy.getVs(idMultiple).checkOptionLabelExists('Option 12344'); + + // Editing stays possible because navigation never moves DOM focus off the input + cy.getVs(idMultiple).pressKeys('ArrowDown'); + cy.checkActiveElementHasClass('vscomp-search-input'); }); it('should close multiple-select dropdown', () => { @@ -548,12 +572,16 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + // One press reaches the group title. This needed two before the A11Y-01 fix, because + // the first ArrowDown was swallowed while the search input held focus. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getDropbox(null, id) @@ -573,11 +601,14 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).pressKeys(['ArrowDown', 'ArrowDown']); + cy.getVs(id).pressKeys('ArrowDown'); cy.getVs(id).pressKeys('Enter'); cy.getVs(id).hasValueText('3 options selected'); cy.getVs(id).pressKeys('Enter'); @@ -588,6 +619,9 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); @@ -614,23 +648,24 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); - cy.getDropbox(null, id) - .find('.vscomp-option.group-title') - .first() - .should('have.class', 'focused') - .type('{downarrow}'); + cy.getDropbox(null, id).find('.vscomp-option.group-title').first().should('have.class', 'focused'); - cy.getDropbox(null, id) - .find('.vscomp-option[data-value="1-1"]') - .should('have.class', 'focused') - .type('{enter}'); + /** pressKeys() sends a real key press to the search input rather than chaining .type() + * onto an option node: the virtualiser replaces those nodes on every render, which + * fails the command with "the page updated while this command was executing". */ + cy.getVs(id).pressKeys('ArrowDown'); + cy.getDropbox(null, id).find('.vscomp-option[data-value="1-1"]').should('have.class', 'focused'); + + cy.getVs(id).pressKeys('Enter'); cy.getVs(id).hasValueText('Option 1-1'); }); @@ -639,14 +674,19 @@ describe('Option group', () => { cy.getVs(id).then(($vs) => { const vs = $vs[0].virtualSelect; vs.reset(false, true); + /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does + * not depend on whether the previous test left this dropdown open. */ + vs.closeDropbox(); }); cy.open(id); - cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); - Cypress._.times(11, () => { + /** Deliberately more presses than there are rows: navigation clamps at the end, which + * is the "navigating past the end" case under test, and this avoids hard-coding a count + * that shifts whenever the demo's option list changes. */ + Cypress._.times(20, () => { cy.getDropbox(null, id).find('.vscomp-option.focused').type('{downarrow}'); }); diff --git a/src/virtual-select.js b/src/virtual-select.js index 21e0f176..3ff1a5a9 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -263,7 +263,8 @@ export class VirtualSelect {
-
@@ -489,7 +490,9 @@ export class VirtualSelect { ${this.searchFormLabel} + id="vscomp-search-input-${this.uniqueId}" + role="combobox" aria-autocomplete="list" aria-expanded="false" + aria-controls="vscomp-options-container-${this.uniqueId}"> ×`; } @@ -683,32 +686,34 @@ export class VirtualSelect { } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { - this.focusOption({ direction: 'next' }); + this.focusOption({ direction }); } else { this.openDropbox(); } } - onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } - if (this.isOpened()) { - this.focusOption({ direction: 'previous' }); - } else { - this.openDropbox(); - } + onUpArrowPress(e) { + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { @@ -2773,6 +2778,8 @@ export class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); @@ -2850,9 +2857,9 @@ export class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** no option is active once the list is gone */ + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { @@ -3936,11 +3943,22 @@ export class VirtualSelect { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ From d9ca106148d4b058693973d9a5e46ed45217d8c2 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 17:26:05 +0100 Subject: [PATCH 27/57] test: open the dropdown deterministically in the flag-icon case `Add image/icon > has flag icon on selected item` failed because cy.open() is a click, i.e. a toggle: the preceding case leaves this dropdown open, so cy.open() closed it and the option click then landed on a dropbox with `display: none`. Open only when actually closed, and re-establish the scroll position so option 16 is rendered whether or not the preceding case ran. Corrects an earlier reading of this failure. It was previously attributed to the popover hiding the dropbox while the virtualised list is scrolled, and a product ticket (AI-1d) was drafted for that. The fix confirms the real cause is the toggle, so AI-1d is withdrawn - there is no product defect here. Baseline re-measured directly to keep the comparison honest: 992f6a9's own bundle and its own examples.cy.ts were checked out and run, giving 216 pass / 3 fail. Both tests reported as newly failing were in that set. Two of the three are now fixed. Suite: 306 tests, 305 pass, 1 fail (was 216/3 at baseline). The remaining failure, `Option group > activates group select/deselect with Enter when group title is focused`, fails identically at baseline and is filed as AI-1f with a lead but no diagnosis: the first Enter selects the group, the second does not deselect it, and the keyboard path routes through onGroupTitleClick(), which reads its direction from the `selected` class on an element the re-render replaces between presses. Clicking the group title toggles correctly, so it is specific to the keyboard path. (cherry picked from commit f7ae693c4bd1d7bce1a53884dbbadf1809d78f57) --- cypress/e2e/examples.cy.ts | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 656caf47..8a155cbe 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -1410,7 +1410,22 @@ describe('Add image/icon', () => { }); it('has flag icon on selected item', () => { - cy.open(id).selectOption(16).hasSelectedFlagIcon(); + /** + * cy.open() is a click, i.e. a toggle. The preceding case leaves this dropdown open, so + * clicking here closed it and the option click then landed on a dropbox with + * `display: none`. Open only when actually closed, and re-establish the scroll position + * so option 16 is rendered whether or not the preceding case ran. + */ + cy.getVs(id).then(($e) => { + const vs = $e[0].virtualSelect; + + if (!vs.isOpened()) { + vs.openDropbox(); + } + }); + cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + + cy.getVs(id).scrollOptions(700).selectOption(16).hasSelectedFlagIcon(); }); }); From 5855f65cbc4ccc1619866d3c9a438c98559b7cfb Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 18:00:40 +0100 Subject: [PATCH 28/57] perf: take the O(n) ARIA scan off the render path and coalesce scroll re-renders (AI-5 / PERF-01 + PERF-02) Two costs sat directly on the scroll path: - calculateAriaMetadata() walks every option and ran at the top of every renderOptions() (~3.9 ms/call at 100k options), even though aria-setsize/aria-posinset only change when the filtered set or its order changes - never when the virtualisation window moves. - onOptionsScroll was bound with no throttling, so a drag produced one full re-render per scroll event (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU) and kept the main thread blocked for the whole gesture. The scan is now guarded by an ariaMetadataDirty flag, set by everything that alters the filtered set or its order: setVisibleOptionsCount(), setSortedOptions(), setNewOption() and removeNewOption(). A flag rather than an enumeration of call sites, so a future code path that changes the set cannot silently skip the recompute by being forgotten here. Scroll re-renders are coalesced to at most one per animation frame, and the pending frame is cancelled in destroy() so it cannot run against detached DOM. No API or behaviour change: the same attributes end up on the same elements, just computed when they can actually differ. Adds cypress/e2e/perf-scroll-aria.cy.ts (6 cases): zero ARIA rescans across five scroll positions, 20 synchronous scroll events producing fewer than 20 re-renders, setsize/posinset still correct after scrolling, metadata recomputed on search and on setOptions, and the queued frame cancelled on destroy. (cherry picked from commit 72ab7210aa70b4a0f0ece4dead4b7361cdd5950e) --- cypress/e2e/perf-scroll-aria.cy.ts | 160 +++++++++++++++++++++++++++++ src/virtual-select.js | 48 ++++++++- 2 files changed, 205 insertions(+), 3 deletions(-) create mode 100644 cypress/e2e/perf-scroll-aria.cy.ts diff --git a/cypress/e2e/perf-scroll-aria.cy.ts b/cypress/e2e/perf-scroll-aria.cy.ts new file mode 100644 index 00000000..ff70fdc8 --- /dev/null +++ b/cypress/e2e/perf-scroll-aria.cy.ts @@ -0,0 +1,160 @@ +/** cSpell:ignore vscomp posinset setsize */ + +/** + * Regression test for AI-5 / [PERF-01 + PERF-02] — INP / long tasks. + * + * Two costs sat on the scroll path. `calculateAriaMetadata()` walked every option and ran + * at the top of every `renderOptions()`, and `onOptionsScroll` was bound with no throttling, + * so a single drag produced one full O(n) re-render per scroll event (~9.5 ms at 100k + * unthrottled, ~44 ms at 4x CPU) and blocked the main thread for the whole gesture. + * + * The ARIA scan now runs only when the filtered set or its order changes, and scroll + * re-renders are coalesced to at most one per animation frame. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('Perf: scroll path does no O(n) work per event (AI-5)', { testIsolation: true }, () => { + const mountId = 'vs-perf-scroll'; + + type Vs = { + calculateAriaMetadata: () => void; + setVisibleOptions: () => void; + $optionsContainer: HTMLElement; + ariaSetSize: number; + scrollAnimationFrame: number | null; + destroy: () => void; + }; + + const instance = () => cy.get(`#${mountId}`).then(($e) => $e[0].virtualSelect as Vs); + + /** Count calls to an instance method without changing its behaviour. */ + const countCalls = (vs: Record, method: string, sink: { n: number }) => { + const original = vs[method].bind(vs); + + // eslint-disable-next-line no-param-reassign + vs[method] = (...args: unknown[]) => { + sink.n += 1; + return original(...args); + }; + }; + + const mount = (count: number, extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(count), search: true, ...extra })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('does not rescan ARIA metadata while scrolling', () => { + mount(2000); + + const calls = { n: 0 }; + + instance().then((vs) => countCalls(vs as unknown as Record, 'calculateAriaMetadata', calls)); + + // Several distinct scroll positions, i.e. several real scroll events and re-renders. + [200, 600, 1200, 2000, 3000].forEach((top) => { + cy.get(`#${mountId}`).find('.vscomp-options-container').scrollTo(0, top); + }); + cy.wait(200); + + cy.wrap(null).should(() => { + expect(calls.n, 'calculateAriaMetadata calls during scrolling').to.equal(0); + }); + }); + + it('coalesces a burst of scroll events into at most one re-render per frame', () => { + mount(2000); + + const renders = { n: 0 }; + + instance().then((vs) => countCalls(vs as unknown as Record, 'setVisibleOptions', renders)); + + // Dispatch a burst synchronously: without coalescing this is one full re-render each. + cy.get(`#${mountId}`).then(($e) => { + const container = ($e[0].virtualSelect as Vs).$optionsContainer; + + for (let i = 1; i <= 20; i += 1) { + container.scrollTop = i * 40; + container.dispatchEvent(new Event('scroll')); + } + }); + + cy.wait(200); + + cy.wrap(null).should(() => { + expect(renders.n, '20 scroll events must not produce 20 re-renders').to.be.lessThan(20); + expect(renders.n, 'the final position must still be rendered').to.be.greaterThan(0); + }); + }); + + it('still reports correct aria-setsize and aria-posinset after scrolling', () => { + mount(2000); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '2000'); + + cy.get(`#${mountId}`).find('.vscomp-options-container').scrollTo(0, 4000); + cy.wait(200); + + // setsize is a property of the filtered set, so scrolling must not change it... + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '2000'); + // ...while posinset must have advanced with the window. + cy.get(`#${mountId}`) + .find('.vscomp-option[aria-posinset]') + .first() + .invoke('attr', 'aria-posinset') + .then((pos) => { + expect(Number(pos), 'first rendered option advanced after scrolling').to.be.greaterThan(1); + }); + }); + + it('recomputes metadata when the filtered set changes', () => { + mount(2000); + + cy.get(`#${mountId}`).find('.vscomp-search-input').focus().type('Option 15'); + + // "Option 15", "Option 150".."Option 159", "Option 1500".."Option 1599" -> a smaller set. + cy.get(`#${mountId}`) + .find('.vscomp-option[aria-setsize]') + .first() + .invoke('attr', 'aria-setsize') + .then((size) => { + expect(Number(size), 'setsize reflects the filtered set, not the full one').to.be.lessThan(2000); + expect(Number(size), 'setsize is still meaningful').to.be.greaterThan(0); + }); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-posinset]').first().should('have.attr', 'aria-posinset', '1'); + }); + + it('recomputes metadata when the option set is replaced', () => { + mount(2000); + + cy.get(`#${mountId}`).then(($e) => $e[0].setOptions?.(makeOptions(7))); + + cy.get(`#${mountId}`).find('.vscomp-option[aria-setsize]').first().should('have.attr', 'aria-setsize', '7'); + }); + + it('cancels a queued scroll re-render on destroy', () => { + mount(2000); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect as Vs; + + // Queue a frame, then tear down before it can run. + vs.$optionsContainer.scrollTop = 400; + vs.$optionsContainer.dispatchEvent(new Event('scroll')); + expect(vs.scrollAnimationFrame, 'a frame is queued').to.not.eq(null); + + vs.destroy(); + expect(vs.scrollAnimationFrame, 'the queued frame is cancelled on destroy').to.eq(null); + }); + + // A leaked frame would throw against detached DOM and fail the test via an uncaught error. + cy.wait(200); + }); +}); diff --git a/src/virtual-select.js b/src/virtual-select.js index 3ff1a5a9..d6882435 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -306,8 +306,16 @@ export class VirtualSelect { } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); @@ -757,8 +765,26 @@ export class VirtualSelect { } } + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + + if (this.isDestroyed) { + return; + } + + this.setVisibleOptions(true); + }); } onOptionsClick(e) { @@ -1266,6 +1292,7 @@ export class VirtualSelect { this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** @@ -1786,6 +1813,8 @@ export class VirtualSelect { } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { @@ -2126,6 +2155,8 @@ export class VirtualSelect { * virtualisation window, which is not what a "N results available" message means. */ this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2229,6 +2260,9 @@ export class VirtualSelect { return; } + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; + const newOption = this.getNewOption(); if (newOption) { @@ -3488,6 +3522,8 @@ export class VirtualSelect { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3773,6 +3809,12 @@ export class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); From 8c2bf82ee976b2ce666e57441219dc3525467aa5 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:15:46 +0100 Subject: [PATCH 29/57] fix(a11y): strip markup and escape quotes in every aria-label Option labels may legitimately contain markup - a flag icon, , a
- and those labels are also interpolated into aria-label attributes, where markup is meaningless. It reached the screen reader as tag soup, and a double quote in a label closed the attribute early so the rest of the accessible name was silently lost. Adds Utils.getAriaLabelText(): tags collapse to a single space so adjacent words do not run together ("Paris
France" must not become "ParisFrance"), whitespace is collapsed, then the remaining quotes are escaped. Applied to the group header name, the group name carried into each child's label, the customData group_name/description, and the option label itself. Also replaces the inline strip on the tag clear button, which removed tags but never escaped quotes - the same attribute breakout, in the one place that already knew about the problem. WCAG 4.1.2 Name, Role, Value (A) and 1.1.1 Non-text Content (A). Non-breaking: only the text inside aria-label changes, and only where it was malformed. No roles, attributes or DOM structure change. (cherry picked from commit f9d37b19880ce1765452f9990888ef806eb8cfac) --- cypress/e2e/a11y-aria-label.cy.ts | 94 +++++++++++++++++++++++++++ cypress/e2e/a11y-reduced-motion.cy.ts | 91 ++++++++++++++++++++++++++ cypress/e2e/perf-text-measurer.cy.ts | 84 ++++++++++++++++++++++++ src/utils/utils.js | 22 +++++++ src/virtual-select.js | 24 +++---- 5 files changed, 304 insertions(+), 11 deletions(-) create mode 100644 cypress/e2e/a11y-aria-label.cy.ts create mode 100644 cypress/e2e/a11y-reduced-motion.cy.ts create mode 100644 cypress/e2e/perf-text-measurer.cy.ts diff --git a/cypress/e2e/a11y-aria-label.cy.ts b/cypress/e2e/a11y-aria-label.cy.ts new file mode 100644 index 00000000..58bc009c --- /dev/null +++ b/cypress/e2e/a11y-aria-label.cy.ts @@ -0,0 +1,94 @@ +/** cSpell:ignore vscomp */ + +/** + * Accessible names must be plain text. + * + * Option labels may legitimately contain markup - a flag icon, , a
. Those labels are + * also interpolated into aria-label attributes, where markup is meaningless: it reached the + * screen reader as tag soup ("i class= flag France"), and a double quote in a label closed + * the attribute early so the rest of the name was silently lost. + * + * WCAG 4.1.2 Name, Role, Value (A) and 1.1.1 Non-text Content (A). + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('A11y: accessible names are plain text', { testIsolation: true }, () => { + const mountId = 'vs-aria-label'; + + const mount = (options: unknown[], extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options, ...extra })); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + const option = (value: string) => cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${value}"]`); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('strips markup from a grouped option name', () => { + mount([{ label: 'Europe', options: [{ label: ' France', value: 'fr' }] }]); + + option('fr').should('have.attr', 'aria-label').and('contain', 'France').and('not.contain', ' { + mount([{ label: 'Europe', options: [{ label: 'France', value: 'fr' }] }]); + + option('fr') + .should('have.attr', 'aria-label') + .and('contain', 'Europe') + .and('not.contain', ''); + }); + + it('does not run words together where a tag was removed', () => { + mount([{ label: 'Europe', options: [{ label: 'Paris
France', value: 'fr' }] }]); + + // "ParisFrance" would be the result of stripping tags to an empty string. + option('fr').should('have.attr', 'aria-label').and('contain', 'Paris France'); + }); + + it('keeps a double quote in the label from truncating the name', () => { + mount([{ label: 'Europe', options: [{ label: 'The "City" of Light', value: 'fr' }] }]); + + option('fr') + .should('have.attr', 'aria-label') + .and('contain', 'City') + // Everything after the quote survived, i.e. the attribute was not broken out of. + .and('contain', 'Light'); + }); + + it('strips markup from the group header name too', () => { + mount([{ label: ' Europe', options: [{ label: 'France', value: 'fr' }] }], { + multiple: true, + }); + + cy.get(`#${mountId}`) + .find('.vscomp-option.group-title') + .first() + .should('have.attr', 'aria-label') + .and('contain', 'Europe') + .and('not.contain', ' { + mount([{ label: ' France', value: 'fr' }], { + multiple: true, + showValueAsTags: true, + ariaLabelTagClearButtonText: 'Remove option', + }); + + option('fr').click(); + + cy.get(`#${mountId}`) + .find('.vscomp-value-tag-clear-button') + .should('have.attr', 'aria-label') + .and('contain', 'France') + .and('contain', 'Remove option') + .and('not.contain', ' { + const mountId = 'vs-reduced-motion'; + + it('zeroes the JS-driven open/close durations when reduce is requested', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + + cy.window().then((win) => { + // Force the query to report "reduce" before the instance reads it. + const originalMatchMedia = win.matchMedia.bind(win); + + win.matchMedia = ((query: string) => + query.includes('prefers-reduced-motion') + ? ({ + matches: true, + media: query, + addEventListener() {}, + removeEventListener() {}, + } as unknown as MediaQueryList) + : originalMatchMedia(query)) as typeof win.matchMedia; + + mountVs(win, mountId, { options: makeOptions(5) }); + }); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect; + + expect(vs.showDuration, 'showDuration under reduced motion').to.equal(0); + expect(vs.hideDuration, 'hideDuration under reduced motion').to.equal(0); + }); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('keeps the configured durations when reduce is not requested', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: makeOptions(5) })); + + cy.get(`#${mountId}`).then(($e) => { + const vs = $e[0].virtualSelect; + + expect(vs.showDuration, 'default showDuration').to.be.greaterThan(0); + expect(vs.hideDuration, 'default hideDuration').to.be.greaterThan(0); + }); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('ships a stylesheet rule that zeroes the transitions', () => { + cy.visit('get-started'); + + // Read the stylesheet the page actually loaded, rather than re-fetching the file: this + // proves the rule survived the build and is live in the document. + cy.document().then((doc) => { + const sheets = Array.from(doc.styleSheets).filter((sheet) => (sheet.href || '').includes('virtual-select')); + + expect(sheets.length, 'the component stylesheet is loaded').to.be.greaterThan(0); + + const mediaRules = sheets.flatMap((sheet) => { + try { + return Array.from(sheet.cssRules); + } catch { + // cross-origin sheets are not readable; none of ours are + return []; + } + }); + + // Duck-typed rather than `instanceof CSSMediaRule`: spec code and the application run + // in different realms, so the constructors are not the same object. + const reducedMotion = mediaRules.filter((rule) => + String((rule as CSSMediaRule).conditionText || '').includes('prefers-reduced-motion'), + ) as CSSMediaRule[]; + + expect(reducedMotion.length, 'a prefers-reduced-motion block is present').to.be.greaterThan(0); + expect(reducedMotion[0].cssText, 'it zeroes the transitions').to.include('transition-duration: 0s'); + expect(reducedMotion[0].cssText, 'it covers the dropbox').to.include('vscomp-dropbox'); + }); + }); +}); diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts new file mode 100644 index 00000000..4206a1f5 --- /dev/null +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -0,0 +1,84 @@ +/** cSpell:ignore vscomp */ + +/** + * Regression test for AI-17 / [PERF-03] - INP / forced synchronous layout. + * + * willTextOverflow() created a div, read getComputedStyle twice, appended it to , + * read clientWidth and removed it again - once per selected tag. Each mutation invalidates + * layout for the read that follows, so a render with many tags meant a burst of forced + * synchronous layouts. + */ + +import { makeOptions, mountVs, unmountVs } from '../support/mount'; + +describe('Perf: one shared text measurer (AI-17)', { testIsolation: true }, () => { + const mountId = 'vs-measurer'; + + const mount = () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { options: makeOptions(5), multiple: true, showValueAsTags: true }), + ); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + }; + + it('reuses a single off-screen node instead of one per tag', () => { + mount(); + + // Several tags, i.e. several willTextOverflow() calls per render. + ['o1', 'o2', 'o3', 'o4'].forEach((v) => { + cy.get(`#${mountId}`).find(`.vscomp-option[data-value="${v}"]`).click(); + }); + + cy.get('.vscomp-text-measurer').should('have.length', 1); + }); + + it('keeps the measurer out of the accessibility tree and out of flow', () => { + mount(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + cy.get('.vscomp-text-measurer').should('have.attr', 'aria-hidden', 'true'); + cy.get('.vscomp-text-measurer').should('have.css', 'position', 'absolute'); + }); + + it('still detects overflow, so tag tooltips are unaffected', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: 'A label far too long to fit inside a narrow tag without being clipped', value: 'long' }, + { label: 'Ok', value: 'short' }, + ], + multiple: true, + showValueAsTags: true, + }), + ); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="long"]').click(); + // Overflowing text still gets a tooltip, i.e. the measurement still works. + cy.get(`#${mountId}`).find('.vscomp-value-tag').first().should('have.attr', 'data-tooltip'); + + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('removes the measurer once the last instance is destroyed', () => { + mount(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + cy.get('.vscomp-text-measurer').should('exist'); + + cy.window().then((win) => unmountVs(win, mountId)); + + // The docs page hosts other instances, so only assert removal once none remain. + cy.window().then((win) => { + // @ts-expect-error - bundle global + const remaining = win.VirtualSelect.activeInstances?.size ?? 0; + + if (remaining === 0) { + cy.get('.vscomp-text-measurer').should('not.exist'); + } + }); + }); +}); diff --git a/src/utils/utils.js b/src/utils/utils.js index 5dd677ba..dd147670 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -218,6 +218,28 @@ export class Utils { return text.replace(/"/g, '"'); } + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together (so "France
Paris" does not collapse into one word), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text) + .replace(/<[^>]+>/gi, ' ') + .replace(/\s+/g, ' ') + .trim(); + + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text diff --git a/src/virtual-select.js b/src/virtual-select.js index d6882435..5b1049d8 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -378,15 +378,15 @@ export class VirtualSelect { } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } @@ -406,15 +406,15 @@ export class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } @@ -1974,11 +1974,13 @@ export class VirtualSelect { const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` From fa0d076445c0913bf8af8322e243950da6af59ab Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:18:33 +0100 Subject: [PATCH 30/57] perf: reuse one text measurer instead of creating a node per tag Deciding whether a selected tag's text overflows (and therefore needs a tooltip) used to create a div, read getComputedStyle twice, append it to , read clientWidth and remove it again - once per tag. Each DOM mutation invalidates layout for the read that follows, so rendering many tags produced a burst of forced synchronous layouts. Now one reusable off-screen node, created lazily and shared, and a single getComputedStyle read for every property. Font weight and letter spacing are applied too: both change advance width, so ignoring them under-reported overflow and could drop a tooltip that was needed. The node is absolutely positioned off-screen and aria-hidden, so it cannot affect layout or be announced, and it is removed in the existing last-instance teardown alongside the global listeners and the shared observer - nothing of ours is left in the document. Non-breaking: same boolean result, same tooltip behaviour. (cherry picked from commit 10cecf3f28079120ce98df195adc18698f20693e) --- cypress/e2e/perf-text-measurer.cy.ts | 12 ++--- src/utils/utils.js | 77 ++++++++++++++++++++++++---- src/virtual-select.js | 2 + 3 files changed, 74 insertions(+), 17 deletions(-) diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts index 4206a1f5..a15c2579 100644 --- a/cypress/e2e/perf-text-measurer.cy.ts +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -1,17 +1,17 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-17 / [PERF-03] - INP / forced synchronous layout. + * Measuring whether a tag's text overflows must not thrash layout. * - * willTextOverflow() created a div, read getComputedStyle twice, appended it to , - * read clientWidth and removed it again - once per selected tag. Each mutation invalidates - * layout for the read that follows, so a render with many tags meant a burst of forced - * synchronous layouts. + * The check runs once per selected tag. It used to create a div, read getComputedStyle twice, + * append it to , read clientWidth and remove it again - and each DOM mutation + * invalidates layout for the read that follows, so rendering many tags produced a burst of + * forced synchronous layouts. */ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('Perf: one shared text measurer (AI-17)', { testIsolation: true }, () => { +describe('Perf: one shared text measurer', { testIsolation: true }, () => { const mountId = 'vs-measurer'; const mount = () => { diff --git a/src/utils/utils.js b/src/utils/utils.js index dd147670..721c662e 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -195,17 +195,65 @@ export class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { fontSize, fontFamily, fontWeight, letterSpacing } = window.getComputedStyle(container); + + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + + return $measurer.clientWidth > container.clientWidth; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = + 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -350,3 +398,10 @@ export class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; diff --git a/src/virtual-select.js b/src/virtual-select.js index 5b1049d8..7d8f91ce 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -969,6 +969,8 @@ export class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } From 615d9069637b76042eaeef7d8e7a784b6e79aa39 Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:19:50 +0100 Subject: [PATCH 31/57] feat(a11y): honour the reduce-motion preference The dropbox slide ignored the user's OS-level "reduce motion" setting. The animation is driven from both CSS and JS, so a stylesheet rule alone is not enough: the popover would still animate for showDuration/hideDuration milliseconds. Both are handled now - a prefers-reduced-motion block zeroes the transitions, and showDuration/hideDuration resolve to 0 when the query matches. Utils.prefersReducedMotion() reads the query per call rather than caching it, so a preference changed after page load is picked up by the next instance, and it is guarded for environments without matchMedia. The loader spin is deliberately left running. It is a status indicator rather than decoration, and a frozen spinner reads as a broken UI instead of "working"; screen reader users get the same information from the live region, so nothing is lost by keeping it. Recorded in the stylesheet so the omission is not mistaken for an oversight. Non-breaking: no API change, and behaviour differs only for users who asked for reduced motion. (cherry picked from commit 600c4f7656a869e7c03ffa63ee60c45668fc7547) --- cypress/e2e/a11y-reduced-motion.cy.ts | 9 +++++---- src/sass/partials/virtual-select.scss | 16 ++++++++++++++++ src/utils/utils.js | 13 +++++++++++++ src/virtual-select.js | 10 ++++++++++ 4 files changed, 44 insertions(+), 4 deletions(-) diff --git a/cypress/e2e/a11y-reduced-motion.cy.ts b/cypress/e2e/a11y-reduced-motion.cy.ts index 51be215a..d266ab87 100644 --- a/cypress/e2e/a11y-reduced-motion.cy.ts +++ b/cypress/e2e/a11y-reduced-motion.cy.ts @@ -1,15 +1,16 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-19 / [A11Y-17] - WCAG 2.3.3 (AAA) and general motion hygiene. + * The dropdown must respect the user's OS-level "reduce motion" preference. * - * The open/close animation is driven from both CSS and JS, so it ignored the user's - * OS-level reduced-motion preference in both places. + * The open/close animation is driven from both CSS and JS, so honouring the preference in the + * stylesheet alone is not enough - the popover would still animate for + * showDuration/hideDuration milliseconds. */ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: prefers-reduced-motion (AI-19)', { testIsolation: true }, () => { +describe('A11y: prefers-reduced-motion', { testIsolation: true }, () => { const mountId = 'vs-reduced-motion'; it('zeroes the JS-driven open/close durations when reduce is requested', () => { diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 3e8ffad3..36536a4b 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -688,3 +688,19 @@ } } } + +/** + * Users who ask the operating system to reduce motion should not get the dropbox slide. + * + * The loader spin is deliberately left alone: it is a status indicator rather than decoration, + * and a frozen spinner reads as a broken UI instead of "working". Screen reader users get the + * same information from the live region, so nothing is lost by keeping it. + */ +@media (prefers-reduced-motion: reduce) { + .vscomp-dropbox-container, + .vscomp-dropbox, + .vscomp-wrapper .vscomp-toggle-button, + .vscomp-dropbox-wrapper { + transition-duration: 0s !important; + } +} diff --git a/src/utils/utils.js b/src/utils/utils.js index 721c662e..b013f6ce 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -221,6 +221,19 @@ export class Utils { return $measurer.clientWidth > container.clientWidth; } + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + /** * The shared, lazily created off-screen node used to measure text width. * diff --git a/src/virtual-select.js b/src/virtual-select.js index 7d8f91ce..8e79555f 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1259,6 +1259,16 @@ export class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ From d298694ddd90139d5e7cc46a34f917ab6c76eb7b Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 19:38:02 +0100 Subject: [PATCH 32/57] docs(test): describe what each spec protects instead of citing audit IDs The specs led with internal audit identifiers ("Regression test for AI-2 / [A11Y-02]"), which tell a developer reading the file nothing. Each header now states the behaviour being protected and cites the WCAG criterion or standard, which is something they can look up. Also drops the identifiers from describe() titles, so a failing test names the broken behaviour rather than a backlog row. WCAG criterion numbers and OWASP references are kept deliberately: those are external standards, not internal bookkeeping. No test logic changes. Suite unchanged at 325 tests, 324 passing. (cherry picked from commit 08c9c81bc834f98b5091c3b826f3a551042e27de) --- cypress/e2e/a11y-escape-close.cy.ts | 6 ++++-- cypress/e2e/a11y-listbox-multiselectable.cy.ts | 6 ++++-- cypress/e2e/a11y-live-region.cy.ts | 6 ++++-- cypress/e2e/a11y-required-error.cy.ts | 6 ++++-- cypress/e2e/a11y-search-arrow-navigation.cy.ts | 7 +++++-- cypress/e2e/a11y-select-all.cy.ts | 6 ++++-- cypress/e2e/a11y-target-size.cy.ts | 6 ++++-- cypress/e2e/examples.cy.ts | 18 +++++++++--------- cypress/e2e/perf-scroll-aria.cy.ts | 6 ++++-- cypress/e2e/security-global-defaults.cy.ts | 6 ++++-- 10 files changed, 46 insertions(+), 27 deletions(-) diff --git a/cypress/e2e/a11y-escape-close.cy.ts b/cypress/e2e/a11y-escape-close.cy.ts index 4bab4d3e..dd30e395 100644 --- a/cypress/e2e/a11y-escape-close.cy.ts +++ b/cypress/e2e/a11y-escape-close.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-2 / [A11Y-02] — WCAG 2.1.1 & 2.1.2 (Level A). + * Escape must dismiss the dropdown, whatever layout it is rendered in. + * + * WCAG 2.1.1 Keyboard (A) and 2.1.2 No Keyboard Trap (A). * * Escape only closed the dropdown when an external `dropboxWrapper` existed or the dropdown * was shown as a popup. With the default `dropboxWrapper: 'self'` on a desktop viewport the @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: Escape closes the dropdown (AI-2)', () => { +describe('A11y: Escape closes the dropdown', () => { const mountId = 'vs-a11y-escape'; const isExpanded = (expected: boolean) => diff --git a/cypress/e2e/a11y-listbox-multiselectable.cy.ts b/cypress/e2e/a11y-listbox-multiselectable.cy.ts index b19f9e27..80f04e13 100644 --- a/cypress/e2e/a11y-listbox-multiselectable.cy.ts +++ b/cypress/e2e/a11y-listbox-multiselectable.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp multiselectable */ /** - * Regression test for AI-10 / [A11Y-06] — WCAG 4.1.2 (A). + * A multi-select listbox must say so, or assistive technology presents it as single-select. + * + * WCAG 4.1.2 Name, Role, Value (A). * * The options container carries role="listbox" but never advertised that more than one * option could be chosen, so assistive technology presented a multi-select dropdown with @@ -10,7 +12,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: listbox advertises multi-selection (AI-10)', () => { +describe('A11y: listbox advertises multi-selection', () => { const mountId = 'vs-a11y-multiselectable'; const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts index 228d1448..4ec76a66 100644 --- a/cypress/e2e/a11y-live-region.cy.ts +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-6 / [A11Y-03] — WCAG 4.1.3 Status Messages (AA). + * Status changes must be announced, not shown only on screen. + * + * WCAG 4.1.3 Status Messages (AA). * * The component shipped a `.vscomp-live-region` rule in the stylesheet but no JavaScript * ever created the element, so there were zero live regions in the DOM. Search result @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: status announcements via a live region (AI-6)', () => { +describe('A11y: status announcements via a live region', () => { const mountId = 'vs-a11y-live'; const liveRegion = () => cy.get(`#${mountId}`).find('.vscomp-live-region'); diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts index e09dd293..89e8fafd 100644 --- a/cypress/e2e/a11y-required-error.cy.ts +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-4 / [A11Y-07] — WCAG 3.3.1 (A), 1.4.1 (A) and 4.1.2 (A). + * A required field, and a failed validation, must be perceivable without relying on colour. + * + * WCAG 3.3.1 Error Identification (A), 1.4.1 Use of Colour (A), 4.1.2 Name/Role/Value (A). * * `required` was never exposed: the wrapper carried no aria-required, and a failed * validate() only toggled a `has-error` class that changed the toggle button's border @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: required and error state are exposed (AI-4)', () => { +describe('A11y: required and error state are exposed', () => { const mountId = 'vs-a11y-required'; const wrapper = () => cy.get(`#${mountId}`).find('.vscomp-wrapper'); diff --git a/cypress/e2e/a11y-search-arrow-navigation.cy.ts b/cypress/e2e/a11y-search-arrow-navigation.cy.ts index 7cf0db7b..6c529337 100644 --- a/cypress/e2e/a11y-search-arrow-navigation.cy.ts +++ b/cypress/e2e/a11y-search-arrow-navigation.cy.ts @@ -1,7 +1,10 @@ /** cSpell:ignore vscomp activedescendant combobox autocomplete */ /** - * Regression test for AI-7 / [A11Y-01 + A11Y-05] — WCAG 2.1.1 (A) and 4.1.2 (A). + * The arrow keys must navigate the option list from the search input, and the highlighted + * option must be announced. + * + * WCAG 2.1.1 Keyboard (A) and 4.1.2 Name, Role, Value (A). * * Opening the dropdown puts focus in the search input, and both arrow handlers * early-returned in that state, so ArrowDown/ArrowUp did nothing at all: no option was @@ -21,7 +24,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; * case leak across tests and make the focus assertions flaky for reasons unrelated to the * component, so this spec asks for a clean page per test. */ -describe('A11y: arrow-key navigation from the search input (AI-7)', { testIsolation: true }, () => { +describe('A11y: arrow-key navigation from the search input', { testIsolation: true }, () => { const mountId = 'vs-a11y-search-arrows'; const searchInput = () => cy.get(`#${mountId}`).find('.vscomp-search-input'); diff --git a/cypress/e2e/a11y-select-all.cy.ts b/cypress/e2e/a11y-select-all.cy.ts index dca4d319..3a5fc8ae 100644 --- a/cypress/e2e/a11y-select-all.cy.ts +++ b/cypress/e2e/a11y-select-all.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-3 / [A11Y-04] — WCAG 4.1.2, 1.3.1 (Level A) and 2.1.1 (Level A). + * The Select All control must behave and be announced as a checkbox. + * + * WCAG 4.1.2 Name/Role/Value (A), 1.3.1 Info and Relationships (A), 2.1.1 Keyboard (A). * * "Select All" was a bare : exposed to assistive * technology as a generic element with no role and no checked state, so its state changes were @@ -11,7 +13,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('A11y: Select All exposes checkbox semantics (AI-3)', () => { +describe('A11y: Select All exposes checkbox semantics', () => { const mountId = 'vs-a11y-select-all'; const toggleAll = () => cy.get(`#${mountId}`).find('.vscomp-toggle-all-button'); diff --git a/cypress/e2e/a11y-target-size.cy.ts b/cypress/e2e/a11y-target-size.cy.ts index c80e3b48..eb004592 100644 --- a/cypress/e2e/a11y-target-size.cy.ts +++ b/cypress/e2e/a11y-target-size.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-11 / [A11Y-13] — WCAG 2.5.8 Target Size (Minimum), AA. + * Every pointer target must be at least 24x24 CSS px. + * + * WCAG 2.5.8 Target Size (Minimum), AA. * * Two controls were smaller than the 24x24 CSS px minimum: the "Select All" checkbox * (measured 25x15) and the per-tag clear button (20x20). Both are pointer targets, so @@ -12,7 +14,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; const MIN_TARGET = 24; -describe('A11y: pointer targets meet the 24x24 minimum (AI-11)', () => { +describe('A11y: pointer targets meet the 24x24 minimum', () => { const mountId = 'vs-a11y-target-size'; /** diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 8a155cbe..159cf19f 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -163,8 +163,8 @@ describe('Accessibility attributes - virtualized options metadata', () => { // aria-activedescendant belongs on the element that holds focus and has a role that // supports it - here the role="combobox" wrapper. It used to be asserted on - // .vscomp-dropbox-container, a plain div with no role, where it is meaningless - // (audit A11Y-05). That container is now checked for its *absence* below. + // .vscomp-dropbox-container, a plain div with no role, where the attribute is + // meaningless. That container is now checked for its *absence* below. cy.getVs(id) .find('.vscomp-ele-wrapper') .should('exist') @@ -210,7 +210,7 @@ describe('Accessibility attributes - virtualized options metadata', () => { .should('have.attr', 'aria-activedescendant', firstOptionId); }); - // ...and is not published on the role-less container (audit A11Y-05) + // ...and is not published on the role-less container, which has no role to carry it cy.get('@roleLessContainer').should('not.have.attr', 'aria-activedescendant'); // Navigate to second option using arrow key @@ -245,9 +245,9 @@ describe('Accessibility attributes - virtualized options metadata', () => { * Arrow key behavior tests for search input. * * Up/Down in the search input navigate the option list (WAI-ARIA APG editable-combobox), - * which is what audit finding A11Y-01 required: they used to be swallowed so that no option - * could ever be highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in - * the field is served by Left/Right and Home/End, covered by the suites below. + * They used to be swallowed while the search input had focus, so no option could ever be + * highlighted from the keyboard - a WCAG 2.1.1 (A) failure. Caret movement in the field is + * served by Left/Right and Home/End, covered by the suites below. */ describe('Arrow key behavior in search input - cursor movement', () => { @@ -367,7 +367,7 @@ describe('Arrow key behavior - focus management and accessibility', () => { cy.open(idMultiple); // Clear and test more text editing using realistic data cy.getVs(idMultiple).typeValue('tion 123', true); - // Home goes to the beginning (Up/Down are option navigation, per A11Y-01) + // Home goes to the beginning; Up/Down are option navigation cy.getVs(idMultiple).pressKeys('Home'); cy.getVs(idMultiple).typeValue('Op'); cy.getVs(idMultiple).checkOptionLabelExists('Option 123'); @@ -580,8 +580,8 @@ describe('Option group', () => { cy.open(id); cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); - // One press reaches the group title. This needed two before the A11Y-01 fix, because - // the first ArrowDown was swallowed while the search input held focus. + // One press reaches the group title. This needed two while the first ArrowDown was + // still being swallowed by the focused search input. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); cy.getDropbox(null, id) diff --git a/cypress/e2e/perf-scroll-aria.cy.ts b/cypress/e2e/perf-scroll-aria.cy.ts index ff70fdc8..20d1288d 100644 --- a/cypress/e2e/perf-scroll-aria.cy.ts +++ b/cypress/e2e/perf-scroll-aria.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp posinset setsize */ /** - * Regression test for AI-5 / [PERF-01 + PERF-02] — INP / long tasks. + * Scrolling a large list must not do work proportional to the whole list. + * + * Measured against INP / long tasks and a 16.7 ms frame budget. * * Two costs sat on the scroll path. `calculateAriaMetadata()` walked every option and ran * at the top of every `renderOptions()`, and `onOptionsScroll` was bound with no throttling, @@ -14,7 +16,7 @@ import { makeOptions, mountVs, unmountVs } from '../support/mount'; -describe('Perf: scroll path does no O(n) work per event (AI-5)', { testIsolation: true }, () => { +describe('Perf: scroll path does no O(n) work per event', { testIsolation: true }, () => { const mountId = 'vs-perf-scroll'; type Vs = { diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts index 28176ff2..3807f196 100644 --- a/cypress/e2e/security-global-defaults.cy.ts +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -1,7 +1,9 @@ /** cSpell:ignore vscomp */ /** - * Regression test for AI-1 / [SEC-01] — OWASP A03:2021 (Injection) / DOM XSS. + * A host application must be able to turn option-text escaping on for every dropdown at once. + * + * OWASP A03:2021 (Injection) / DOM XSS. * * Option label/value/description are interpolated into innerHTML, and `secureText()` is a * no-op unless `enableSecureText` is on — which it is not by default. A host application @@ -14,7 +16,7 @@ import { mountVs, unmountVs } from '../support/mount'; -describe('Security: global defaults for enableSecureText (AI-1)', () => { +describe('Security: global defaults for enableSecureText', () => { const mountId = 'vs-sec-global'; const payload = ''; From f4a40f86083e6d609c008708bf1f4a2c26d24b9d Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 21:52:16 +0100 Subject: [PATCH 33/57] fix(a11y): drop the option highlight when the dropbox closes (AI-1f) closeDropbox() is asynchronous for every default instance: initDropboxPopover() runs whenever !keepAlwaysOpen && !showAsPopup, so the close goes through dropboxPopover.hide() and afterHidePopper() - the only caller of removeOptionFocus() - does not run until the hide transition ends. Measured live: for ~150-200ms after closeDropbox() returns, isOpened() is still true, the previous .focused option is still in the DOM and focusedOptionIndex still holds its index. Reopening inside that window resumed arrow navigation from a row the user could no longer see, one step past where they expected - which on a grouped multi-select put Enter on the first child option instead of the group title. Clear the highlight next to the existing setActiveDescendant('') instead of waiting for the transition. removeOptionFocus() is a no-op when nothing is highlighted, so the afterHidePopper() call stays for the silent path. toggleOptionFocusedState() also moved DOM focus on both edges, so clearing a highlight focused the element it had just un-highlighted. Harmless during navigation (the next call immediately focuses the new option) but wrong on close, where it pulled focus into a dropbox being hidden and fought the wrapper refocus. It now moves focus only when taking the highlight. This is what the red examples.cy.ts case was actually hitting. It was filed as "Enter on a group title selects but does not deselect"; the run log shows it failed on the first assertion, not the second, and the toggle itself works in both directions against the unfixed bundle. Spec: a11y-close-clears-highlight.cy.ts (5), confirmed failing before the fix. (cherry picked from commit af297eceebc2c78dc3aa8f70844d6e9fe1dbed59) --- cypress/e2e/a11y-close-clears-highlight.cy.ts | 124 ++++++++++++++++++ src/virtual-select.js | 23 +++- 2 files changed, 145 insertions(+), 2 deletions(-) create mode 100644 cypress/e2e/a11y-close-clears-highlight.cy.ts diff --git a/cypress/e2e/a11y-close-clears-highlight.cy.ts b/cypress/e2e/a11y-close-clears-highlight.cy.ts new file mode 100644 index 00000000..95500354 --- /dev/null +++ b/cypress/e2e/a11y-close-clears-highlight.cy.ts @@ -0,0 +1,124 @@ +/** cSpell:ignore vscomp */ + +/** + * Closing the dropbox must end option navigation, immediately. + * + * Every default instance closes through a popover hide transition, so `afterHidePopper()` - + * the only place that dropped the highlight - ran ~200ms after `closeDropbox()` returned. + * Until then the previous `.focused` option and `focusedOptionIndex` survived the close, so a + * dropdown reopened inside that window resumed navigation one step further down the list than + * the user could see. On a grouped multi-select that shifted Enter off the group title and onto + * its first child, so "select the whole group" silently became "select one option". + * + * WCAG 2.1.1 Keyboard (A) and 4.1.2 Name, Role, Value (A) - `aria-activedescendant` and the + * visible highlight have to agree with where the next arrow key will actually go. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +const GROUPS = [ + { label: 'Group 1', options: [{ label: 'Option 1-1', value: '1-1' }, { label: 'Option 1-2', value: '1-2' }] }, + { label: 'Group 2', options: [{ label: 'Option 2-1', value: '2-1' }] }, +]; + +describe('A11y: closing the dropbox clears option navigation state', { testIsolation: true }, () => { + const mountId = 'vs-close-clears-highlight'; + + const mount = (extra: Record = {}) => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => mountVs(win, mountId, { options: GROUPS, multiple: true, ...extra })); + }; + + const openAndHighlightFirst = () => { + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); + }; + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('drops the highlight in the same tick as the close, not when the transition ends', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + + /** + * Read in the same tick the close was requested. isOpened() is still true here, which + * is the point: this pins the asynchronous popover path rather than the synchronous + * fallback, so the test cannot pass for the wrong reason. + */ + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + expect(vs.$dropboxContainer.querySelector('.vscomp-option.focused'), 'highlighted option').to.equal(null); + expect(vs.focusedOptionIndex, 'focusedOptionIndex').to.equal(null); + }); + }); + + it('clears aria-activedescendant on close', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.attr', 'aria-activedescendant'); + + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('not.have.attr', 'aria-activedescendant'); + }); + + it('starts navigation at the first option again after a close and reopen', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + + // data-index 1 here would mean the pre-close highlight was carried over. + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); + }); + + it('toggles a whole group on and off with Enter on its group title', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.class', 'group-title'); + + /** + * Asserted on the value array rather than on `.vscomp-value`: the rendered text switches + * between a list of labels and an "N options selected" summary depending on + * `noOfDisplayValues`, which has nothing to do with what this case is about. + */ + cy.get(`#${mountId}`).pressKeys('Enter'); + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.selectedValues, 'after the first Enter').to.deep.equal(['1-1', '1-2']); + }); + + cy.get(`#${mountId}`).pressKeys('Enter'); + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.selectedValues, 'after the second Enter').to.deep.equal([]); + }); + }); + + /** + * Negative control for the change that stopped clearing the highlight from moving DOM focus: + * Escape must still hand focus back to the combobox rather than leaving it on an option + * inside a dropbox that is being hidden. + */ + it('still returns focus to the combobox when Escape closes the dropbox', () => { + mount(); + openAndHighlightFirst(); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { key: 'Escape', keyCode: 27, which: 27 }); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); +}); diff --git a/src/virtual-select.js b/src/virtual-select.js index 8e79555f..0233abd6 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -2906,7 +2906,20 @@ export class VirtualSelect { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); DomUtils.setAria(this.$searchInput, 'expanded', false); - /** no option is active once the list is gone */ + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); this.setActiveDescendant(''); } @@ -3995,7 +4008,13 @@ export class VirtualSelect { DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } From 54987e2c30146c24d4ed0ee1782ed7fab97a2a4f Mon Sep 17 00:00:00 2001 From: gnbm Date: Tue, 4 Aug 2026 21:52:36 +0100 Subject: [PATCH 34/57] test: open from an asserted state instead of toggling (AI-1e) examples.cy.ts runs with testIsolation: false, so every instance survives between cases, and cy.open() is a click - therefore a toggle - preceded by a fixed wait(200) that races the hide transition. Whether a case started open or closed, with or without a carried-over highlight, silently changed how many key presses the next one needed. cy.openFresh(id) replaces the six-line reset() + closeDropbox() + cy.open() preamble in all five Option-group keyboard cases. It asserts its way into the starting state rather than waiting a fixed time for it: clear the value, close, wait for the `closed` class, click, wait for it to be gone, then assert no option carries the highlight. All three inputs a press count can depend on - open/closed, value, highlight - are pinned before the first key press. Neither approach the v1.4.0 assessment rejected was retried: this is not testIsolation: true (which would break the `go to section` pattern every describe relies on) and not API-opening (which leaves focus outside the component and trips the dropbox focus sentinels). examples.cy.ts also drops from ~13 min to ~2 min, because several cases had been reaching their assertions only after Cypress retry timeouts. (cherry picked from commit fd60b7c43b49ab5537c7d059337787f91241f5f3) --- cypress/e2e/examples.cy.ts | 53 +++++-------------------------------- cypress/support/commands.ts | 30 +++++++++++++++++++++ cypress/support/index.d.ts | 9 +++++++ 3 files changed, 46 insertions(+), 46 deletions(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 159cf19f..6a57e85b 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -569,17 +569,10 @@ describe('Option group', () => { }); it('includes group title in keyboard navigation and exposes it to assistive technologies', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + /** openFresh() guarantees closed -> open with no highlight, so one press is one press + * regardless of what the previous test left behind. */ + cy.openFresh(id); - cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); // One press reaches the group title. This needed two while the first ArrowDown was // still being swallowed by the focused search input. cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -598,15 +591,7 @@ describe('Option group', () => { }); it('activates group select/deselect with Enter when group title is focused', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).pressKeys('ArrowDown'); cy.getVs(id).pressKeys('Enter'); @@ -616,15 +601,7 @@ describe('Option group', () => { }); it('navigates between group title and group options with arrow keys', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -645,15 +622,7 @@ describe('Option group', () => { }); it('opens dropdown and selects a group child option using keyboard only', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); @@ -671,15 +640,7 @@ describe('Option group', () => { }); it('keeps focus on the last option when navigating past the end of the list', () => { - cy.getVs(id).then(($vs) => { - const vs = $vs[0].virtualSelect; - vs.reset(false, true); - /** cy.open() below is a click, i.e. a toggle. Start closed so the press count does - * not depend on whether the previous test left this dropdown open. */ - vs.closeDropbox(); - }); - - cy.open(id); + cy.openFresh(id); cy.getVs(id).find('.vscomp-wrapper').type('{downarrow}'); diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 45b7ef6c..a5685ac0 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -30,6 +30,36 @@ Cypress.Commands.add('open', (id) => { cy.getVs(id).wait(dropboxCloseDuration).click(); }); +/** + * Open a dropdown from a known state, without depending on how the previous test left it. + * + * `cy.open()` is a click, i.e. a *toggle*: on an already-open dropdown it closes instead, and + * its fixed `wait(dropboxCloseDuration)` races the hide transition, which is what made the + * keyboard cases in this suite order-coupled (`testIsolation: false` keeps every instance + * alive across tests). This command asserts its way to the state it needs instead of waiting a + * fixed time for it: + * + * 1. clear the value and ask the dropbox to close; + * 2. wait for it to actually be closed (`closed` class), so the click below always opens; + * 3. click, and wait for it to actually be open; + * 4. assert no option carries the highlight, so a following ArrowDown always lands on the + * first option and press counts stop depending on test order. + */ +Cypress.Commands.add('openFresh', (id) => { + cy.getVs(id).then(($ele) => { + const vs = $ele[0].virtualSelect; + vs.reset(false, true); + vs.closeDropbox(); + }); + + cy.getVs(id).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.getVs(id).click(); + cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); + cy.getDropbox(null, id).find('.vscomp-option.focused').should('not.exist'); + + cy.getVs(id); +}); + Cypress.Commands.add('close', { prevSubject: true }, (vsElem) => { cy.get(vsElem).click(); }); diff --git a/cypress/support/index.d.ts b/cypress/support/index.d.ts index 66d9b7a9..fd2cae73 100644 --- a/cypress/support/index.d.ts +++ b/cypress/support/index.d.ts @@ -50,6 +50,15 @@ declare namespace Cypress { */ open(id: string): Chainable; + /** + * Open from a known state - closed, no value, no highlighted option - so press counts do + * not depend on what the previous test left behind. + * + * @example + * cy.openFresh('option-group-select') + */ + openFresh(id: string): Chainable; + /** * @example close() From 44233ceb01baa2778351f1cc2eb7e40e7e7e52bd Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 09:14:28 +0100 Subject: [PATCH 35/57] fix(a11y): keep the closing dropbox from taking the highlight back (AI-1f) Follow-up to the AI-1f fix replayed from the audit branch, from code review of it. closeDropbox() ends with setSearchValue(''), and afterSetSearchValue() unconditionally calls focusOption({ focusFirst: true }). So with a filter typed, the synchronous removeOptionFocus() earlier in closeDropbox() was immediately undone: the highlight and aria-activedescendant came back on a combobox already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option about to be display:none - verified live, keyboard focus ended on . Guarded with an isClosing flag scoped to that one call, so everything before it (the wrapper refocus in particular) still sees real state. announceSearchResults() needs no guard: it already bails unless the search input holds focus, and a11y-live-region.cy.ts pins that. Also tightens toggleFocusedProp(), which tested focusedOptionIndex for truthiness. That only works because DomUtils.getData() returns the string "0"; normalising it to a number would stop index 0 being cleared, and renderOptions() re-applies .focused from the isFocused prop, so the stale highlight would come back through the data path on the next render. Two cases added to a11y-close-clears-highlight.cy.ts (7 total). Against the pre-fix baseline 3 of the 7 fail; against the branch before this commit, the new typed-search case fails on its own. --- cypress/e2e/a11y-close-clears-highlight.cy.ts | 71 +++++++++++++++++-- src/virtual-select.js | 28 +++++++- 2 files changed, 92 insertions(+), 7 deletions(-) diff --git a/cypress/e2e/a11y-close-clears-highlight.cy.ts b/cypress/e2e/a11y-close-clears-highlight.cy.ts index 95500354..d121cc2a 100644 --- a/cypress/e2e/a11y-close-clears-highlight.cy.ts +++ b/cypress/e2e/a11y-close-clears-highlight.cy.ts @@ -71,20 +71,62 @@ describe('A11y: closing the dropbox clears option navigation state', { testIsola cy.get(`#${mountId}`).find('.vscomp-wrapper').should('not.have.attr', 'aria-activedescendant'); }); - it('starts navigation at the first option again after a close and reopen', () => { + /** + * Reopened in the *same tick* as the close, deliberately. Waiting for the `closed` class + * first would wait out `afterHidePopper()`, which clears the highlight on its own - so the + * case could never observe the bug it exists for. This is the user-visible symptom: reopen + * before the hide transition finishes and navigation must still start at the top. + */ + it('starts navigation at the first option again when reopened mid hide-transition', () => { mount(); openAndHighlightFirst(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '1'); - cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.closeDropbox()); - cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + vs.openDropbox(); + }); - cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); cy.get(`#${mountId}`).pressKeys('ArrowDown'); - // data-index 1 here would mean the pre-close highlight was carried over. + // data-index 2 here would mean the pre-close highlight was carried over. cy.get(`#${mountId}`).find('.vscomp-option.focused').should('have.attr', 'data-index', '0'); }); + /** + * The same close, with a filter typed. Clearing the filter is the last thing closeDropbox() + * does, and it used to re-highlight the first visible option - undoing the clear above and + * pulling DOM focus onto an option that is about to be hidden. + */ + it('keeps the highlight cleared when a search value has to be cleared too', () => { + mount({ search: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').type('Option'); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('exist'); + + cy.get(`#${mountId}`).then(($ele) => { + const vs = $ele[0].virtualSelect; + + vs.closeDropbox(); + + expect(vs.isOpened(), 'still mid hide-transition').to.equal(true); + expect(vs.searchValue, 'search value').to.equal(''); + expect(vs.$dropboxContainer.querySelector('.vscomp-option.focused'), 'highlighted option').to.equal(null); + expect(vs.focusedOptionIndex, 'focusedOptionIndex').to.equal(null); + expect(vs.$wrapper.getAttribute('aria-activedescendant'), 'aria-activedescendant').to.equal(null); + }); + + // Focus must not have been dragged into the dropbox that is being hidden. + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); + it('toggles a whole group on and off with Enter on its group title', () => { mount(); openAndHighlightFirst(); @@ -121,4 +163,23 @@ describe('A11y: closing the dropbox clears option navigation state', { testIsola cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); cy.focused().should('have.class', 'vscomp-wrapper'); }); + + /** + * Same control on the layout where it actually bites. showAsPopup skips initDropboxPopover(), + * so closeDropbox() runs afterHidePopper() synchronously - i.e. right after the wrapper + * refocus and while the options are still visible and therefore still focusable. That is the + * path where clearing the highlight used to steal focus for real. + */ + it('still returns focus to the combobox when a popup layout closes', () => { + mount({ showAsPopup: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).pressKeys('ArrowDown'); + cy.get(`#${mountId}`).find('.vscomp-option.focused').should('exist'); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').trigger('keydown', { key: 'Escape', keyCode: 27, which: 27 }); + + cy.get(`#${mountId}`).find('.vscomp-wrapper').should('have.class', 'closed'); + cy.focused().should('have.class', 'vscomp-wrapper'); + }); }); diff --git a/src/virtual-select.js b/src/virtual-select.js index 0233abd6..89128257 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1117,7 +1117,10 @@ export class VirtualSelect { this.toggleAllOptionsClass(); } - this.focusOption({ focusFirst: true }); + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ focusFirst: true }); + } if (!this.hasServerSearch) { this.announceSearchResults(); @@ -1303,6 +1306,7 @@ export class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; this.ariaMetadataDirty = true; } @@ -2938,7 +2942,19 @@ export class VirtualSelect { this.afterHidePopper(); } + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. + */ + this.isClosing = true; this.setSearchValue(''); + this.isClosing = false; } afterHidePopper() { @@ -3478,7 +3494,15 @@ export class VirtualSelect { } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } From 9e297ed5c876f597a82350b82bf0f435dfafd31f Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 09:14:47 +0100 Subject: [PATCH 36/57] test: pin the search value and scroll position in openFresh() (AI-1e) From code review of the AI-1e work replayed from the audit branch. openFresh() claimed to pin every input a press count can depend on, but missed two: - scrollTop. focusOption() resolves "the first option" through getFirstVisibleOptionIndex(), i.e. scrollTop / optionHeight, and opening does not reset it: setScrollTop() returns early with no selection (which openFresh guarantees by resetting) and scrollToTop() only runs under showSelectedOptionsFirst. The last converted case scrolls to the bottom of the list, so any keyboard case added after it would have inherited that position. - the search value. It was only being cleared as a side effect of closeDropbox(), which returns early when the dropdown is already closed - and reset() never touches it. A case that left the instance closed with a filter applied would have opened onto a filtered list with every assertion still passing. Both are now set explicitly and then asserted, so the command fails loudly rather than silently opening from the wrong state. The setSearchValue() call is guarded for instances built with search: false, which have no $searchInput. --- cypress/support/commands.ts | 24 +++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index a5685ac0..6892e44e 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -39,16 +39,31 @@ Cypress.Commands.add('open', (id) => { * alive across tests). This command asserts its way to the state it needs instead of waiting a * fixed time for it: * - * 1. clear the value and ask the dropbox to close; + * 1. clear the value, the filter and the scroll position, and ask the dropbox to close; * 2. wait for it to actually be closed (`closed` class), so the click below always opens; * 3. click, and wait for it to actually be open; * 4. assert no option carries the highlight, so a following ArrowDown always lands on the * first option and press counts stop depending on test order. + * + * All four inputs a press count can depend on are pinned, not three. `scrollTop` is one of + * them because `focusOption()` resolves "the first option" through + * `getFirstVisibleOptionIndex()`, i.e. `scrollTop / optionHeight` - and opening does not reset + * it (`setScrollTop()` returns early with no selection, and `scrollToTop()` only runs under + * `showSelectedOptionsFirst`). The filter is cleared explicitly rather than relying on + * `closeDropbox()` doing it, because `closeDropbox()` returns early when already closed and + * `reset()` never touches the search value. */ Cypress.Commands.add('openFresh', (id) => { cy.getVs(id).then(($ele) => { const vs = $ele[0].virtualSelect; vs.reset(false, true); + + /** guarded: instances built with search: false have no $searchInput to write to */ + if (vs.$searchInput) { + vs.setSearchValue(''); + } + + vs.$optionsContainer.scrollTop = 0; vs.closeDropbox(); }); @@ -57,6 +72,13 @@ Cypress.Commands.add('openFresh', (id) => { cy.getVs(id).find('.vscomp-wrapper').should('not.have.class', 'closed'); cy.getDropbox(null, id).find('.vscomp-option.focused').should('not.exist'); + cy.getVs(id).should(($ele) => { + const vs = $ele[0].virtualSelect; + + expect(vs.searchValue, 'search value').to.equal(''); + expect(vs.$optionsContainer.scrollTop, 'options scrollTop').to.equal(0); + }); + cy.getVs(id); }); From 9d7d35c8c1fd0da832855bd1232e7a68446449cb Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 11:35:47 +0100 Subject: [PATCH 37/57] test: stop chaining key presses onto virtualised option nodes (AI-1e) `Accessibility attributes ... has proper ARIA attributes on listbox and options container` was the last known flake in the suite, failing roughly 1 run in 5 and more often under CPU load. Cause: the second arrow press was `cy.get('@firstOption').type('{downarrow}')`, chained onto an option node aliased earlier in the test. The virtualiser replaces those nodes on every render, so by the time .type() ran the node could already be detached - the keydown reached no handler, the highlight never advanced, and the next assertion timed out with "expected to have class focused". The two `cy.wait(100)` calls around it could not help: they were already redundant, since the .should() assertions that follow retry on their own. Three changes, all removing a race rather than padding it: - both presses now go through pressKeys(), which sends a real key press to the search input via CDP instead of typing into a node that may be replaced. This is what the Option-group keyboard cases already do. - the case opens with openFresh(), which pins scrollTop. That matters here specifically: the case reads options by DOM position (.first(), .eq(1)) and this instance virtualises 100k options, so those positions depend on the scroll offset. - both fixed waits removed. Verified against the condition that produced the original failure: with 23 cores saturated, the spec is 219/219 and this case completes in 464ms. Also 3 clean quiet runs, plus the full suite at 332/332. --- cypress/e2e/examples.cy.ts | 29 ++++++++++++++++++++++------- 1 file changed, 22 insertions(+), 7 deletions(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 6a57e85b..74c4322b 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -153,7 +153,13 @@ describe('Accessibility attributes - virtualized options metadata', () => { }); it('has proper ARIA attributes on listbox and options container for screen reader navigation', () => { - cy.open(id); + /** + * openFresh() rather than cy.open(): this case reads options by DOM position + * (`.first()`, `.eq(1)`), and on a virtualised list of 100k those positions depend on + * `scrollTop`. openFresh pins the scroll position and asserts no option is already + * highlighted, so "one press reaches the first option" holds regardless of test order. + */ + cy.openFresh(id); // Cache references to relevant elements for repeated assertions cy.getDropbox(null, id) @@ -188,9 +194,12 @@ describe('Accessibility attributes - virtualized options metadata', () => { .should('have.attr', 'aria-labelledby', comboboxId); }); - // Navigate to first option using keyboard (Down arrow from combobox) - cy.getVs(id).find('.vscomp-ele-wrapper').type('{downarrow}'); - cy.wait(100); // Wait for focus to update + /** + * pressKeys() sends a real key press to the search input rather than chaining .type() + * onto a node. The fixed cy.wait() it replaces was redundant anyway - the .should() + * below retries - and a fixed wait cannot fix the underlying race. + */ + cy.getVs(id).pressKeys('ArrowDown'); // Get first option and verify it's focused cy.getDropbox(null, id) @@ -213,9 +222,15 @@ describe('Accessibility attributes - virtualized options metadata', () => { // ...and is not published on the role-less container, which has no role to carry it cy.get('@roleLessContainer').should('not.have.attr', 'aria-activedescendant'); - // Navigate to second option using arrow key - cy.get('@firstOption').type('{downarrow}'); - cy.wait(100); // Wait for focus to update + /** + * This is the press that made the case flaky. It used to be `cy.get('@firstOption') + * .type('{downarrow}')` - chained onto the option node aliased above, which the + * virtualiser replaces on every render. By the time .type() ran, that node could already + * be detached, so the keydown never reached a handler, the highlight never advanced, and + * the assertion below timed out with "expected to have class focused". + * Observed failing about 1 run in 5, more often under CPU load. + */ + cy.getVs(id).pressKeys('ArrowDown'); // Get second option cy.getDropbox(null, id) From 6c42b63c0164adef72eb49ffbafb1a9b8685a7ee Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 12:24:23 +0100 Subject: [PATCH 38/57] test: close the remaining order coupling where it can actually bite (AI-1e) Converts the last six cy.open() calls whose outcome depends on state a previous test can change, and deliberately leaves the other 50 alone. cy.open() is a click, therefore a toggle, preceded by a fixed wait(200) that races the hide transition. With testIsolation: false that makes a case's result depend on what the previous one left behind - but only if the case reads something order-sensitive. Two things qualify: * a key-press count, because a highlight left over from an earlier case shifts where the next arrow key lands; * a DOM position (.first(), .eq(n), .last()), because on a virtualised list the first *rendered* option is whatever scrollTop points at. Converted, all six for one of those two reasons: - Accessibility attributes > exposes total list size ... without search (.first() with no search to reset the scroll) - the four "Arrow key behavior ..." openers (caret and highlight driven by keys) - Label with description > has description on load (checkFirstOption reads .first(), again with no search) Left as cy.open() on purpose: - ~45 cases that select by data-value (selectOption(2), search(...).selectOption) - immune to both scroll offset and press count - cases that search before reading .first(): the search scrolls the list back to the top, so the position is already deterministic - Showing selected options first > check selected option moved to top, which depends on the selection and scroll position surviving from the line above it. openFresh() would reset both and destroy the test's premise. Verified: three full-suite runs at 332/332, one of them with 23 cores saturated, which is the condition the previously-flaky case used to fail under. --- cypress/e2e/examples.cy.ts | 27 +++++++++++++++++++++------ 1 file changed, 21 insertions(+), 6 deletions(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 74c4322b..944e9da2 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -62,7 +62,12 @@ describe('Accessibility attributes - virtualized options metadata', () => { const id = 'single-select'; it('exposes total list size and sequential positions without search', () => { - cy.open(id); + /** + * openFresh() because this case reads `.first()` with no search to reset the scroll + * offset, and on a virtualised 100k list the first *rendered* option is whatever + * `scrollTop` happens to be pointing at. + */ + cy.openFresh(id); cy.getDropbox(null, id) .find('[role="option"][aria-setsize]') @@ -269,7 +274,9 @@ describe('Arrow key behavior in search input - cursor movement', () => { const idMultiple = 'multiple-select' it('moves the caret to the beginning with Home, and navigates options with Up arrow', () => { - cy.open(idMultiple); + /** openFresh(): this suite drives the caret and the option highlight by key press, so it + * must start from a known open state with nothing already highlighted. */ + cy.openFresh(idMultiple); // Type some text in search input cy.getVs(idMultiple).typeValue('ption 9', true); // Home moves the caret to the beginning (Up arrow now drives the option list instead) @@ -324,7 +331,9 @@ describe('Arrow key behavior - no option navigation when search input focused', const searchInputSelector = '.vscomp-search-input'; it('should not navigate options when arrow keys used in search input', () => { - cy.open(idMultiple); + /** openFresh(): this suite drives the caret and the option highlight by key press, so it + * must start from a known open state with nothing already highlighted. */ + cy.openFresh(idMultiple); // Type in search input - use text that will filter to a few options cy.getVs(idMultiple).typeValue('Option 1', true); // Wait for filtering to complete @@ -351,7 +360,9 @@ describe('Arrow key behavior - Home and End keys in search input', () => { const idMultiple = 'multiple-select' it('should work correctly with Home and End keys in search input', () => { - cy.open(idMultiple); + /** openFresh(): this suite drives the caret and the option highlight by key press, so it + * must start from a known open state with nothing already highlighted. */ + cy.openFresh(idMultiple); // Type some text using search to ensure dropdown is properly opened cy.getVs(idMultiple).typeValue('ption 55', true); // Press Home to go to beginning @@ -379,7 +390,9 @@ describe('Arrow key behavior - focus management and accessibility', () => { const idMultiple = 'multiple-select' it('should allow normal text editing in search while arrows navigate the list', () => { - cy.open(idMultiple); + /** openFresh(): this suite drives the caret and the option highlight by key press, so it + * must start from a known open state with nothing already highlighted. */ + cy.openFresh(idMultiple); // Clear and test more text editing using realistic data cy.getVs(idMultiple).typeValue('tion 123', true); // Home goes to the beginning; Up/Down are option navigation @@ -844,7 +857,9 @@ describe('Label with description', () => { }); it('has description on load', () => { - cy.open(id).checkFirstOption('Option 1 Description 1'); + /** openFresh() pins scrollTop: checkFirstOption() reads `.first()`, and there is no search + * here to scroll the list back to the top. */ + cy.openFresh(id).checkFirstOption('Option 1 Description 1'); }); it('has description on scroll', () => { From 5a484030497cd103aeb5d2a1ad7f24792024269a Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 13:13:57 +0100 Subject: [PATCH 39/57] fix(a11y): make the isClosing guard exception-safe (AI-1f) Found in a self-review of the guard added earlier in this branch. isClosing was set, setSearchValue('') called, then the flag cleared on the next line. If setSearchValue() ever threw, the flag would stay true for the lifetime of the instance, and afterSetSearchValue() would then skip focusOption() after EVERY later filter clear - so the highlight would silently stop coming back when a user clears the search box. A stuck flag is much harder to diagnose than the exception that caused it, so the reset now runs in a finally. No behaviour change on the happy path; suite unchanged at 332/332. --- src/virtual-select.js | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/src/virtual-select.js b/src/virtual-select.js index 89128257..cba1a479 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -2950,11 +2950,18 @@ export class VirtualSelect { * that is about to be display:none - so the keyboard position ended up on . * * isClosing is scoped to this one call rather than the whole method because everything - * above it (the wrapper refocus in particular) still needs the real state. + * above it (the wrapper refocus in particular) still needs the real state. The reset runs + * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the + * highlight coming back after *every* later filter clear, which is far harder to diagnose + * than the exception itself. */ this.isClosing = true; - this.setSearchValue(''); - this.isClosing = false; + + try { + this.setSearchValue(''); + } finally { + this.isClosing = false; + } } afterHidePopper() { From b31bde1159a1910277b3becd393200dc13f5f36f Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 16:47:52 +0100 Subject: [PATCH 40/57] fix(security): harden the name attribute, value maps and quote escaping (AI-20) Three independent sub-items from the audit backlog, each with a regression spec written first and confirmed failing against the unfixed bundle. SEC-02 - the hidden input's `name` was interpolated into the template, so a double quote closed the attribute early. The payload after it was parsed as markup, and the field kept only the prefix: `items["a"]` submitted as `items[`, a wrong-but-plausible field name rather than an obvious absence. Worse, a payload that also swallowed the following `class="vscomp-hidden-input"` left `$hiddenInput` null, so the first setValue() threw inside the constructor and the host element was left empty - a total loss of the control. The name is now assigned as a DOM property after render, which involves no HTML parsing, and it no longer goes through secureText(): that escaping only ever protected this sink, and applying it corrupted the submitted name into `items["a"]`. SEC-03 - value-keyed lookups used plain objects. This is not prototype pollution: `mapping['__proto__'] = true` calls the inherited setter, which ignores a non-object value. The damage is to reads - `mapping['__proto__']` returns the inherited Object.prototype, truthy but never `=== true`, which is what every one of these lookups tests. An option whose value was `__proto__` was selectable by click but invisible to setValue / setDisabledOptions / setEnabledOptions, so a selection an app could read back could not be restored; setEnabledOptions disabled every option; and under allowNewOption the value was duplicated. Fixed with Object.create(null) at the 14 value-keyed sites. Index-keyed maps are left alone - their keys are numbers. SEC-04 - quotes were escaped in the stored text rather than at the sink, so `The "City" of Light` was stored double-escaped, rendered as visible mojibake, and became unsearchable: labelNormalized derived from the mangled form, so no query could match a quoted phrase. The escaping is now at the boundary, in DomUtils.getAttributesText() and at the data-value interpolation. That also closes a sink the pre-escaping never reached: getTooltipAttrText() escaped quotes only when containsHTML() was true, so a tag-free payload went into data-tooltip raw and put a live attribute on a value tag. getAttributesText() stringifies with String(), not Utils.getString(), because the latter maps `false` to '' and would have emptied data-tooltip-ellipsis-only and -allow-html. Specs: security-hidden-input-name.cy.ts (7), security-proto-value.cy.ts (9), security-quote-escaping.cy.ts (12). --- cypress/e2e/security-hidden-input-name.cy.ts | 179 +++++++++++++++++ cypress/e2e/security-proto-value.cy.ts | 175 ++++++++++++++++ cypress/e2e/security-quote-escaping.cy.ts | 201 +++++++++++++++++++ src/utils/dom-utils.js | 16 +- src/virtual-select.js | 101 ++++++++-- 5 files changed, 650 insertions(+), 22 deletions(-) create mode 100644 cypress/e2e/security-hidden-input-name.cy.ts create mode 100644 cypress/e2e/security-proto-value.cy.ts create mode 100644 cypress/e2e/security-quote-escaping.cy.ts diff --git a/cypress/e2e/security-hidden-input-name.cy.ts b/cypress/e2e/security-hidden-input-name.cy.ts new file mode 100644 index 00000000..6efa6c48 --- /dev/null +++ b/cypress/e2e/security-hidden-input-name.cy.ts @@ -0,0 +1,179 @@ +/** cSpell:ignore vscomp pwned */ + +/** + * SEC-02 — the `name` prop is interpolated raw into the hidden input's `name` attribute. + * + * OWASP A03:2021 (Injection) / DOM XSS, plus a functional submission bug. + * + * `renderWrapper()` built the field as ``. Because + * `name` reaches that template as a raw string, a double quote in it terminates the attribute + * early: the rest of the payload is parsed as markup, and the field keeps only the *prefix* up + * to that quote. `items["a"]` submitted as `items[` — a wrong-but-plausible field name rather + * than an obvious absence, which is why it went unnoticed. So the same character both injects + * and silently corrupts submission, and it does that to an entirely legitimate field name. + * + * `enableSecureText: true` stopped the injection but not the breakage: the escaped `"` + * became part of the submitted field name. + * + * There is a third defect at the same site. `name` is interpolated *before* the field's + * `class="vscomp-hidden-input"`, so a payload that closes the tag swallows the class too. + * `querySelector('.vscomp-hidden-input')` then returns null, and the first `setValue()` throws + * `Cannot set properties of null (setting 'value')` inside the constructor — which the library + * catches as "Couldn't initiate Virtual Select" and leaves the host element empty. A quote in + * `name` plus any initial value is therefore a total loss of the control, not just of the + * submitted field. + * + * The fix keeps the field and assigns the name as a DOM *property* after render. A property + * assignment involves no HTML parsing, so there is nothing to break out of and nothing to + * escape — the name submits verbatim whether escaping is on or off. + * + * These cases assert the submission contract through `FormData`, i.e. what the server actually + * receives, rather than through the attribute alone. + */ + +import { unmountVs } from '../support/mount'; + +describe('Security: hidden input name is not an HTML sink', () => { + const mountId = 'vs-sec-name'; + const formId = 'vs-sec-name-form'; + const payload = 'x" data-pwned="1">'; + const quotedName = 'items["a"]'; + + /** + * Mount inside a real `
`, because the whole point of the field is submission. + * `setEleProps()` resolves `$ele.form` via `closest('form')` at init time, so the host has to + * be in the form before `init()` runs. + */ + const mountInForm = (win: Window, options: Record): void => { + unmountVs(win, mountId); + win.document.getElementById(formId)?.remove(); + + const $form = win.document.createElement('form'); + $form.id = formId; + + const $ele = win.document.createElement('div'); + $ele.id = mountId; + $form.appendChild($ele); + win.document.body.appendChild($form); + + // @ts-expect-error - VirtualSelect is attached to window by the bundle + win.VirtualSelect.init({ + ele: $ele, + options: [ + { label: 'Portugal', value: 'pt' }, + { label: 'Spain', value: 'es' }, + ], + ...options, + }); + }; + + /** + * The entries the form would actually submit. + * + * Built with the application window's own FormData so the read happens in the same realm as + * the form - `FormData` lives on the global scope rather than on the `Window` interface, hence + * the cast. + */ + const submitted = (win: Window): FormData => { + const $form = win.document.getElementById(formId) as HTMLFormElement; + const WinFormData = (win as unknown as { FormData: typeof FormData }).FormData; + + return new WinFormData($form); + }; + + const submittedNames = (win: Window): string[] => Array.from(submitted(win).keys()); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + }); + + afterEach(() => { + cy.window().then((win) => { + unmountVs(win, mountId); + win.document.getElementById(formId)?.remove(); + }); + }); + + it('submits a plain name, unchanged', () => { + cy.window().then((win) => { + mountInForm(win, { name: 'country', selectedValue: 'pt' }); + + expect(submittedNames(win)).to.deep.equal(['country']); + expect(submitted(win).get('country')).to.equal('pt'); + }); + }); + + it('does not create DOM from a name containing a double quote', () => { + cy.window().then((win) => { + // enableSecureText is deliberately left at its default (off): the fix must not depend on it. + mountInForm(win, { name: payload }); + + expect( + win.document.querySelectorAll(`#${mountId} [data-pwned]`).length, + 'no element may be created from the name', + ).to.equal(0); + expect(win.document.querySelectorAll(`#${mountId} img`).length, 'no injected img').to.equal(0); + }); + }); + + it('still submits under a name containing a double quote, verbatim', () => { + cy.window().then((win) => { + mountInForm(win, { name: payload, selectedValue: 'pt' }); + + expect(submittedNames(win), 'the field must not be dropped from the form').to.deep.equal([payload]); + }); + }); + + it('submits a legitimately quoted field name verbatim', () => { + cy.window().then((win) => { + mountInForm(win, { name: quotedName, selectedValue: 'es' }); + + expect(submittedNames(win)).to.deep.equal([quotedName]); + expect(submitted(win).get(quotedName)).to.equal('es'); + }); + }); + + it('does not entity-escape the field name when enableSecureText is on', () => { + cy.window().then((win) => { + mountInForm(win, { name: quotedName, selectedValue: 'pt', enableSecureText: true }); + + // Escaping protects HTML sinks; the name is no longer one, so it must not be rewritten. + expect(submittedNames(win)).to.deep.equal([quotedName]); + }); + }); + + it('still builds the control when the name contains a double quote and a value is set', () => { + cy.window().then((win) => { + cy.spy(win.console, 'error').as('consoleError'); + + // The combination that used to abort the constructor: the payload swallowed the field's + // class attribute, so setValue() dereferenced a null $hiddenInput. + mountInForm(win, { name: payload, selectedValue: 'pt' }); + + expect(win.document.querySelectorAll(`#${mountId} .vscomp-wrapper`).length, 'wrapper rendered').to.equal(1); + expect(win.document.querySelectorAll(`#${mountId} .vscomp-hidden-input`).length, 'field present').to.equal(1); + }); + + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect, 'instance survived init').to.not.equal(undefined); + expect($ele[0].virtualSelect.selectedValues, 'value applied').to.deep.equal(['pt']); + }); + + cy.get('@consoleError').should((spy: any) => { + const messages = spy.getCalls().map((c: any) => String(c.args[0])); + expect(messages.filter((m: string) => m.includes('setting \'value\''))).to.have.length(0); + }); + }); + + it('keeps the name attribute on the hidden input itself', () => { + cy.window().then((win) => { + mountInForm(win, { name: quotedName }); + + const $hidden = win.document.querySelector(`#${mountId} .vscomp-hidden-input`) as HTMLInputElement; + + expect($hidden, 'the hidden input must still exist').to.not.equal(null); + expect($hidden.getAttribute('name')).to.equal(quotedName); + }); + }); +}); diff --git a/cypress/e2e/security-proto-value.cy.ts b/cypress/e2e/security-proto-value.cy.ts new file mode 100644 index 00000000..d726f8f5 --- /dev/null +++ b/cypress/e2e/security-proto-value.cy.ts @@ -0,0 +1,175 @@ +/** cSpell:ignore vscomp */ + +/** + * SEC-03 — option values are used as keys of plain `{}` objects, so `__proto__` is unusable. + * + * This is **not** prototype pollution. `mapping['__proto__'] = true` on a plain object invokes + * the inherited `__proto__` setter, which ignores a non-object value: nothing is written, and + * `Object.prototype` is untouched. The first case below pins that, so the assessment stays + * honest if the implementation changes. + * + * What it *is* is a state-rehydration bug, and an asymmetric one. Reading + * `mapping['__proto__']` returns the inherited `Object.prototype`, which is truthy but never + * `=== true` — and every one of these lookups compares against `true`. So the option is + * reachable by click (that path never consults a mapping) but not by API: + * + * - `setValue(['__proto__'])` silently selects nothing; + * - reading `element.value` and feeding it straight back loses the selection; + * - `setDisabledOptions` / `setEnabledOptions` silently skip it; + * - with `allowNewOption`, it is additionally mistaken for an unknown value and duplicated + * as a new option. + * + * `Object.create(null)` for the value-keyed lookups removes the inherited members, so an + * arbitrary string key behaves like any other. `constructor` and `toString` are covered too: + * they shadow correctly on a plain object and already worked, so they are the control that + * proves the fix did not change ordinary behaviour. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: option values that collide with Object.prototype members', () => { + const mountId = 'vs-sec-proto'; + + const protoOptions = [ + { label: 'Proto', value: '__proto__' }, + { label: 'Constructor', value: 'constructor' }, + { label: 'ToString', value: 'toString' }, + { label: 'Plain A', value: 'a' }, + { label: 'Plain B', value: 'b' }, + ]; + + const mount = (win: Window, extra: Record = {}) => + mountVs(win, mountId, { options: protoOptions, ...extra }); + + /** The instance, for driving the public API the way a consumer does. */ + const vs = () => cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('does not pollute Object.prototype', () => { + cy.window().then((win) => { + mount(win); + const $ele = win.document.getElementById(mountId) as HTMLElement; + + $ele.setValue?.(['__proto__']); + $ele.setDisabledOptions?.(['__proto__']); + + // @ts-expect-error - deliberately probing the prototype chain + expect(({}).__proto__, 'Object.prototype must be intact').to.equal(win.Object.prototype); + expect(Object.getPrototypeOf({}), 'no prototype swap').to.equal(win.Object.prototype); + }); + }); + + it('selects a "__proto__" value through setValue', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['__proto__']); + }); + + vs().should((instance) => { + expect(instance.selectedValues, 'selection').to.deep.equal(['__proto__']); + }); + cy.get(`#${mountId}`).find('.vscomp-value').should('contain', 'Proto'); + }); + + it('round-trips a "__proto__" selection through element.value', () => { + cy.window().then((win) => { + mount(win); + const $ele = win.document.getElementById(mountId) as HTMLElement; + + // Read the live value the way an app persisting state would, then restore it. + $ele.setValue?.(['__proto__']); + const persisted = ($ele as unknown as { value: string }).value; + $ele.reset?.(false, true); + $ele.setValue?.([persisted]); + }); + + vs().should((instance) => { + expect(instance.selectedValues, 'restored selection').to.deep.equal(['__proto__']); + }); + }); + + it('selects "__proto__" alongside ordinary values in multiple mode', () => { + cy.window().then((win) => { + mount(win, { multiple: true }); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['__proto__', 'a', 'b']); + }); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal(['__proto__', 'a', 'b']); + }); + }); + + it('disables a "__proto__" option through setDisabledOptions', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setDisabledOptions?.(['__proto__', 'a']); + }); + + vs().should((instance) => { + const disabled = instance.options.filter((d: any) => d.isDisabled).map((d: any) => d.value); + + expect(disabled).to.deep.equal(['__proto__', 'a']); + }); + }); + + it('keeps a "__proto__" option enabled through setEnabledOptions', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setEnabledOptions?.(['__proto__']); + }); + + vs().should((instance) => { + const enabled = instance.options.filter((d: any) => !d.isDisabled).map((d: any) => d.value); + + expect(enabled, 'only the named value stays enabled').to.deep.equal(['__proto__']); + }); + }); + + it('does not duplicate a "__proto__" value as a new option', () => { + cy.window().then((win) => { + mount(win, { allowNewOption: true }); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['__proto__']); + }); + + vs().should((instance) => { + const matches = instance.options.filter((d: any) => d.value === '__proto__'); + + expect(matches, 'the existing option must be reused, not re-added').to.have.length(1); + expect(instance.selectedValues).to.deep.equal(['__proto__']); + }); + }); + + it('keeps "__proto__" in place when selection order is preserved', () => { + cy.window().then((win) => { + mount(win, { multiple: true }); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['b', '__proto__', 'a']); + }); + + vs().should((instance) => { + const ordered = instance + .getSelectedOptions({ fullDetails: true, keepSelectionOrder: true }) + .map((d: any) => d.value); + + expect(ordered).to.deep.equal(['b', '__proto__', 'a']); + }); + }); + + it('still handles other Object.prototype member names (control)', () => { + cy.window().then((win) => { + mount(win, { multiple: true }); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['constructor', 'toString']); + }); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal(['constructor', 'toString']); + }); + }); +}); diff --git a/cypress/e2e/security-quote-escaping.cy.ts b/cypress/e2e/security-quote-escaping.cy.ts new file mode 100644 index 00000000..ecfd2517 --- /dev/null +++ b/cypress/e2e/security-quote-escaping.cy.ts @@ -0,0 +1,201 @@ +/** cSpell:ignore vscomp pwned */ + +/** + * SEC-04 — quotes were escaped in the wrong place: in the stored text, not at the attribute. + * + * `secureText()` ran `replaceDoubleQuotesWithHTML()` over label/value/description *before* + * handing the string to a text node, and the text node's `innerHTML` then escaped the `&` it + * had just introduced. So with `enableSecureText: true` a label of `The "City" of Light` was + * stored as `The &quot;City&quot; of Light`, rendered to the user as the visible + * mojibake `The "City" of Light`, and - because `labelNormalized` derives from the + * stored text - became unsearchable: neither `"City"` nor `"City"` matched anything. + * + * Escaping the source text also failed at what it was for. Quotes only matter inside an + * attribute, and two attribute sinks take option text: + * + * 1. `data-value="${d.value}"` in `renderOptions()`, always; + * 2. `data-tooltip="${label}"` via `getTooltipAttrText()` in the value-tag path, whose own + * escaping was conditional on `containsHTML(label)` - so a payload with no tag at all + * went in raw and put a live attribute on the tag element. + * + * Sink 2 was a real breakout whenever escaping was off, and sink 1 whether it was on or off. + * Pre-escaping the stored text only ever masked sink 2, and only in the escaping-on case. + * + * The fix moves the escaping to the boundary: `DomUtils.getAttributesText()` escapes every + * value it writes, `data-value` is escaped at its interpolation, and `secureText()` stops + * rewriting quotes. Attribute values round-trip through the parser, so `dataset.value` still + * reads back the exact option value. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: quotes are escaped at the attribute, not in the stored text', () => { + const mountId = 'vs-sec-quotes'; + const quotedLabel = 'The "City" of Light'; + const attrPayload = 'x" data-pwned="1" z="'; + const scriptPayload = ''; + /** long enough that the tag needs a tooltip, which is what puts the label in an attribute */ + const longAttrPayload = `${attrPayload}${' padding to force overflow in a narrow field '.repeat(3)}`; + + const mount = (win: Window, options: Record) => mountVs(win, mountId, options); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => { + // @ts-expect-error - test marker + win.__vsQuoteXss = undefined; + }); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('stores a quoted label verbatim when escaping is on', () => { + cy.window().then((win) => { + mount(win, { options: [{ label: quotedLabel, value: 'paris' }], enableSecureText: true }); + }); + + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.options[0].label, 'stored label').to.equal(quotedLabel); + }); + }); + + it('renders a quoted label as real quotes, not as "', () => { + cy.window().then((win) => { + mount(win, { options: [{ label: quotedLabel, value: 'paris' }], enableSecureText: true }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="paris"] .vscomp-option-text').should(($text) => { + expect($text.text().trim()).to.equal(quotedLabel); + expect($text.text()).to.not.contain('"'); + }); + }); + + it('finds a quoted phrase by searching for it', () => { + cy.window().then((win) => { + mount(win, { + options: [ + { label: quotedLabel, value: 'paris' }, + { label: 'Lisbon', value: 'lisbon' }, + ], + search: true, + enableSecureText: true, + }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-search-input').type('"City"'); + cy.get(`#${mountId}`).find('.vscomp-option').should('have.length', 1); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="paris"]').should('exist'); + }); + + it('keeps a quoted description readable when escaping is on', () => { + cy.window().then((win) => { + mount(win, { + options: [{ label: 'Paris', value: 'paris', description: 'He said "bonjour"' }], + hasOptionDescription: true, + enableSecureText: true, + }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option-description').should(($d) => { + expect($d.text().trim()).to.equal('He said "bonjour"'); + expect($d.text()).to.not.contain('"'); + }); + }); + + // data-value is the always-active attribute sink. + [false, true].forEach((enableSecureText) => { + it(`does not let a quoted value break out of data-value (enableSecureText: ${enableSecureText})`, () => { + cy.window().then((win) => { + mount(win, { options: [{ label: 'Payload', value: attrPayload }], enableSecureText }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option').should('have.length', 1); + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + + // The parsed attribute must still equal the value, or selection by click breaks. + cy.get(`#${mountId}`).find('.vscomp-option').should(($option) => { + expect($option[0].dataset.value, 'data-value round-trip').to.equal(attrPayload); + }); + }); + }); + + it('still selects an option whose value contains a quote', () => { + cy.window().then((win) => { + mount(win, { options: [{ label: 'Payload', value: attrPayload }] }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option').click(); + + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.selectedValues).to.deep.equal([attrPayload]); + }); + }); + + // The value-tag tooltip is the second sink, and was unguarded whenever escaping was off. + [false, true].forEach((enableSecureText) => { + it(`does not let a quoted label break out of data-tooltip (enableSecureText: ${enableSecureText})`, () => { + cy.window().then((win) => { + const $ele = mount(win, { + options: [{ label: longAttrPayload, value: 'v1' }], + multiple: true, + showValueAsTags: true, + selectedValue: ['v1'], + enableSecureText, + }); + $ele.style.width = '150px'; + }); + + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + cy.get(`#${mountId}`).find('.vscomp-value-tag').should(($tag) => { + expect($tag.attr('data-tooltip'), 'tooltip round-trip').to.equal(longAttrPayload); + }); + }); + }); + + it('still escapes markup in option text when escaping is on', () => { + cy.window().then((win) => { + mount(win, { options: [{ label: scriptPayload, value: 'p1' }], enableSecureText: true }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('img[src="x"]').should('not.exist'); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] .vscomp-option-text').should('contain', 'img'); + + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__vsQuoteXss, 'payload must not execute').to.not.eq(true); + }); + }); + + it('leaves non-string tooltip attribute values intact', () => { + // getAttributesText() now stringifies before escaping. `Utils.getString(false)` returns '', + // so using it there would have silently emptied the boolean tooltip attributes. + cy.window().then((win) => { + mount(win, { options: [{ label: 'Plain', value: 'p' }] }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option .vscomp-option-text').should(($text) => { + expect($text.attr('data-tooltip-ellipsis-only')).to.equal('true'); + expect($text.attr('data-tooltip-allow-html')).to.equal('true'); + expect($text.attr('data-tooltip-enter-delay')).to.equal('200'); + }); + }); + + it('still renders HTML labels as markup when escaping is off (unchanged default)', () => { + cy.window().then((win) => { + mount(win, { options: [{ label: 'Bold', value: 'b1' }] }); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="b1"] b').should('contain', 'Bold'); + }); +}); diff --git a/src/utils/dom-utils.js b/src/utils/dom-utils.js index 53b85230..b8b1ec8a 100644 --- a/src/utils/dom-utils.js +++ b/src/utils/dom-utils.js @@ -328,7 +328,21 @@ export class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - html += ` ${k}="${v}" `; + /** + * Quotes are escaped here, at the attribute boundary, because this is the only place + * that knows the value is about to be wrapped in double quotes. + * + * The caller that matters is getTooltipAttrText(), which passes option labels through + * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) + * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and + * put a live attribute on the value-tag element. Escaping unconditionally here removes + * the condition, and the parser turns " back into a quote, so the attribute still + * reads back as the original string. + * + * String(), not Utils.getString(): the latter maps `false` to '', and some of these + * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). + */ + html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; } }); diff --git a/src/virtual-select.js b/src/virtual-select.js index cba1a479..be2ec0f7 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -190,7 +190,7 @@ export class VirtualSelect { `
- +
${this.placeholder} @@ -228,6 +228,23 @@ export class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + + /** + * The submitting field's name is set as a DOM property, not interpolated into the template. + * + * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so + * the remainder of the value was parsed as markup (real elements, an injection) while the + * field kept only the truncated prefix - or, when the payload also swallowed the following + * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw + * inside the constructor. Either way the form silently stopped submitting the right name, + * and that included legitimate names such as `items["a"]`. + * + * A property assignment performs no HTML parsing, so there is nothing to break out of and + * nothing to escape - which is also why `name` no longer goes through secureText(): the + * escaping only ever protected this sink, and applying it here corrupted the submitted + * field name into `items["a"]`. + */ + this.$hiddenInput.name = this.name; this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); this.$dropbox = this.$dropboxContainer.querySelector('.vscomp-dropbox'); @@ -444,8 +461,20 @@ export class VirtualSelect { } } + /** + * The option value is an untrusted string going straight into an attribute, so a double + * quote in it closed data-value early and everything after it was parsed as markup - a + * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, + * whether or not enableSecureText was on. + * + * Escaping cannot break reading the value back: the parser turns " into a quote, and + * setOptionAttr() rewrites data-value through the DOM API on every render anyway. + */ + const optionValueAttr = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.value)); + html += `
${leftSection} @@ -1238,7 +1267,8 @@ export class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - this.name = this.secureText(options.name); + /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ + this.name = options.name; this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1454,8 +1484,23 @@ export class VirtualSelect { } setValueMethod(newValue, silentChange) { - const valuesMapping = {}; - const valuesOrder = {}; + /** + * Option values are untrusted strings used as keys, so every value-keyed lookup in this + * file is built with Object.create(null) rather than `{}`. + * + * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object + * calls the inherited setter, which ignores a non-object value, so nothing is written and + * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns + * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups + * all compare against `true`. An option whose value is `__proto__` was therefore + * selectable by click (that path reads data-value, not a mapping) but invisible to + * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read + * back could not be restored - and under allowNewOption it was mistaken for an unknown + * value and duplicated. A null prototype has no inherited members, so an arbitrary string + * key behaves like any other. + */ + const valuesMapping = Object.create(null); + const valuesOrder = Object.create(null); let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -1524,7 +1569,7 @@ export class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = {}; + const valuesMapping = Object.create(null); preparedValues.forEach((d) => { valuesMapping[d] = true; @@ -1598,7 +1643,7 @@ export class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map((d) => d.toString()); - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); disabledOptionsArr.forEach((d) => { disabledOptionsMapping[d] = true; @@ -1643,7 +1688,7 @@ export class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = {}; + const enabledOptionsMapping = Object.create(null); enabledOptions.forEach((d) => { enabledOptionsMapping[d] = true; @@ -1675,7 +1720,7 @@ export class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); let hasEmptyValueOption = false; this.disabledOptions.forEach((d) => { @@ -1776,7 +1821,7 @@ export class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = {}; + const newOptionsValueMapping = Object.create(null); optionsUpdated = true; newOptions.forEach((d) => { @@ -2306,7 +2351,7 @@ export class VirtualSelect { } setSelectedProp() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.selectedValues.forEach((d) => { valuesMapping[d] = true; @@ -2326,7 +2371,7 @@ export class VirtualSelect { } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = {}; + const availableValuesMapping = Object.create(null); this.options.forEach((d) => { availableValuesMapping[d.value] = true; @@ -2423,7 +2468,7 @@ export class VirtualSelect { return; } - const valuesMapping = {}; + const valuesMapping = Object.create(null); let selectedOptionIndex; selectedValues.forEach((d) => { @@ -2516,9 +2561,11 @@ export class VirtualSelect { } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; + /** quotes are escaped unconditionally by getAttributesText(); escaping again here would + * leave a literal " in the tooltip, and the old containsHTML() condition is what + * let a tag-free payload through in the first place */ const data = { - 'data-tooltip': tootltipText || '', + 'data-tooltip': text || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -2592,7 +2639,7 @@ export class VirtualSelect { } getNewValue() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.newValues.forEach((d) => { valuesMapping[d] = true; @@ -2659,7 +2706,7 @@ export class VirtualSelect { }); if (keepSelectionOrder) { - const valuesOrder = {}; + const valuesOrder = Object.create(null); selectedValues.forEach((d, i) => { valuesOrder[d] = i; @@ -2673,7 +2720,7 @@ export class VirtualSelect { getDisabledOptions() { const { valueKey, labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = {}; + const disabledOptionsValueMapping = Object.create(null); const result = []; disabledOptions.forEach((value) => { @@ -3449,7 +3496,7 @@ export class VirtualSelect { const groupIndex = DomUtils.getData($ele, 'index', 'number'); const { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = {}; + const valuesMapping = Object.create(null); const { removeItemFromArray } = Utils; selectedValues.forEach((d) => { @@ -3907,8 +3954,20 @@ export class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ - this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); + + /** + * escape potentially harmful markup so label/value/description cannot trigger XSS. + * + * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML + * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as + * `The &quot;City&quot; of Light`, shown to the user as `The "City" of + * Light`, and made unsearchable, because labelNormalized derives from the stored text. + * Quotes only need escaping inside an attribute, and that now happens at each attribute + * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also + * covers the sinks this pre-escaping never reached, such as an attribute written while + * enableSecureText is off. + */ + this.$secureText.nodeValue = text; return this.$secureDiv.innerHTML; } From faef03cfc7cac03c07de4001443f8a34549c3f46 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 16:50:02 +0100 Subject: [PATCH 41/57] fix(security): store option values verbatim so they stay addressable (AI-22) Stage 1 of AI-22. secureText() escapes by writing to a text node and reading back innerHTML, which rewrites `&` (and `<`/`>`) by design - that rewriting is what makes enableSecureText work. The mistake was storing the result in option.value and deriving the search keys from it. The three escaped fields do not have the same constraints, and treating them alike is what caused this: - `value` reaches no innerHTML sink. It goes into the data-value attribute and is otherwise only compared or used as a map key. Escaping it protected nothing and made the option unaddressable: `a&b` was stored as `a&b`, so setValue(['a&b']) matched nothing, setDisabledOptions(['a&b']) disabled nothing, and reading a value back and setting it again lost the selection. Only the library's internal form, setValue(['a&b']), worked. - `label` and `description` are inserted as HTML, so they stay escaped. Verified by tracing every use of d.value: the data-value interpolation, setData($option, 'value', ...) in setOptionAttr(), and otherwise only comparisons and array pushes. No template puts it into element content. Three changes: 1. setOptions(), getOptionObj() and setNewOption() stop routing value through secureText(). 2. data-value uses a new Utils.escapeAttributeValue() - `&` first, then `"`, so the attribute still parses back to the value. It is deliberately not shared with DomUtils.getAttributesText(), whose inputs are already-escaped label text: escaping `&` there would double it and a tooltip would show `&`. That asymmetry is commented at both sites. 3. labelNormalized and descriptionNormalized derive from the raw text, so a query matches what the user typed. Deriving them from the escaped form meant no query could match text containing `"`, `&`, `<` or `>`. labelRenderer still receives a pre-escaped d.label, so the common `(d) => '' + d.label + ''` remains as safe as it was. Making that raw is stage 2 and is breaking; it is held for 2.0.0 along with reordering markSearchResults to escape before inserting . Spec: security-ampersand-storage.cy.ts (15). --- cypress/e2e/security-ampersand-storage.cy.ts | 254 +++++++++++++++++++ docs/properties.md | 10 +- src/utils/utils.js | 21 ++ src/virtual-select.js | 76 ++++-- 4 files changed, 331 insertions(+), 30 deletions(-) create mode 100644 cypress/e2e/security-ampersand-storage.cy.ts diff --git a/cypress/e2e/security-ampersand-storage.cy.ts b/cypress/e2e/security-ampersand-storage.cy.ts new file mode 100644 index 00000000..b1836041 --- /dev/null +++ b/cypress/e2e/security-ampersand-storage.cy.ts @@ -0,0 +1,254 @@ +/** cSpell:ignore vscomp pwned */ + +/** + * AI-22 stage 1 — escaping was applied to the text the library *stores*, so `&` corrupted the + * option's own identity. + * + * `secureText()` escapes by assigning to a text node and reading back `innerHTML`, which rewrites + * `&` to `&` (and `<`/`>`) by design — that rewriting is what makes `enableSecureText` work. + * The mistake was storing the result in `option.value` and deriving the search keys from it. + * + * The three fields have different constraints, and treating them alike is what caused this: + * + * - `value` reaches **no** `innerHTML` sink. It goes into the `data-value` attribute and is + * otherwise only compared and used as a map key. Escaping it protected nothing and made the + * option unaddressable: `setValue(['a&b'])` could not match a stored `a&b`. + * - `label` and `description` **are** inserted as HTML, so they must stay escaped. They still are. + * + * Stage 1 therefore stores `value` verbatim, escapes `&` as well as `"` at the `data-value` + * interpolation so the attribute still parses back to it, and derives `labelNormalized` / + * `descriptionNormalized` from the raw text so search matches what the consumer typed. + * + * Note the deliberate asymmetry with `DomUtils.getAttributesText()`, which escapes quotes only: + * its inputs are already-escaped label text, so escaping `&` there too would double it. + * + * Stage 2 — storing `label`/`description` raw and escaping at render — is breaking (a `labelRenderer` + * receiving a raw label turns the common `'' + d.label + ''` into an injection) and is held + * for 2.0.0. The cases at the end pin the escaping that stage 1 keeps. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: option values are stored verbatim, not HTML-escaped', () => { + const mountId = 'vs-amp'; + + const ampOptions = [ + { label: 'Tom & Jerry', value: 'a&b' }, + { label: 'R&D', value: 'r&d' }, + { label: 'Angle ', value: 'x = {}) => + mountVs(win, mountId, { options: ampOptions, enableSecureText: true, ...extra }); + + const vs = () => cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect); + const openDropbox = () => cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + /** the dropbox is appended outside the host for the default `dropboxWrapper: 'self'` layout */ + const dropbox = () => cy.get(`#${mountId}`).then(($ele) => cy.wrap($ele[0].virtualSelect.$dropbox)); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('stores option values exactly as supplied', () => { + cy.window().then((win) => mount(win)); + + vs().should((instance) => { + expect(instance.options.map((d: any) => d.value)).to.deep.equal(['a&b', 'r&d', 'x { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['a&b']); + }); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal(['a&b']); + }); + cy.get(`#${mountId}`).find('.vscomp-value').should('contain', 'Tom & Jerry'); + }); + + it('selects a "<" value through setValue', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setValue?.(['x { + expect(instance.selectedValues).to.deep.equal(['x { + cy.window().then((win) => { + const $ele = win.document.getElementById(mountId) ?? mount(win); + const $host = win.document.getElementById(mountId) as HTMLElement; + void $ele; + + $host.setValue?.(['a&b']); + const persisted = ($host as unknown as { value: string }).value; + expect(persisted, 'the value read back must be the value supplied').to.equal('a&b'); + + $host.reset?.(false, true); + $host.setValue?.([persisted]); + }); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal(['a&b']); + }); + }); + + it('disables an "&" option through setDisabledOptions', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setDisabledOptions?.(['a&b', 'plain']); + }); + + vs().should((instance) => { + const disabled = instance.options.filter((d: any) => d.isDisabled).map((d: any) => d.value); + + expect(disabled).to.deep.equal(['a&b', 'plain']); + }); + }); + + it('reports "&" values back from getDisabledOptions', () => { + cy.window().then((win) => { + mount(win); + (win.document.getElementById(mountId) as HTMLElement).setDisabledOptions?.(['r&d']); + }); + + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].getDisabledOptions?.().map((d: any) => d.value)).to.deep.equal(['r&d']); + }); + }); + + it('finds a label containing "&" by searching for it', () => { + cy.window().then((win) => mount(win, { search: true })); + + openDropbox(); + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.setSearchValue('Tom & Jerry')); + + dropbox().find('.vscomp-option').should('have.length', 1); + dropbox().find('.vscomp-option').should('have.attr', 'data-value', 'a&b'); + }); + + it('finds a label containing "<" by searching for it', () => { + cy.window().then((win) => mount(win, { search: true })); + + openDropbox(); + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.setSearchValue('')); + + dropbox().find('.vscomp-option').should('have.length', 1); + dropbox().find('.vscomp-option').should('have.attr', 'data-value', 'x { + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: 'One', value: '1', description: 'Research & Development' }, + { label: 'Two', value: '2', description: 'Something else' }, + ], + hasOptionDescription: true, + enableSecureText: true, + search: true, + }), + ); + + openDropbox(); + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.setSearchValue('Research & Dev')); + + dropbox().find('.vscomp-option').should('have.length', 1); + dropbox().find('.vscomp-option').should('have.attr', 'data-value', '1'); + }); + + it('keeps data-value readable and un-breakable for an "&" value', () => { + cy.window().then((win) => mount(win)); + + openDropbox(); + dropbox().find('.vscomp-option').should(($options) => { + expect(Array.from($options).map((o) => (o as HTMLElement).dataset.value)).to.deep.equal([ + 'a&b', + 'r&d', + 'x { + const tricky = 'a&b" data-pwned="1" z="'; + + cy.window().then((win) => mountVs(win, mountId, { options: [{ label: 'Tricky', value: tricky }], enableSecureText: true })); + + openDropbox(); + dropbox().find('[data-pwned]').should('not.exist'); + dropbox().find('.vscomp-option').click(); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal([tricky]); + }); + }); + + it('stores a typed new option value verbatim', () => { + cy.window().then((win) => mount(win, { search: true, allowNewOption: true })); + + openDropbox(); + cy.get(`#${mountId}`).find('.vscomp-search-input').type('Smith & Sons'); + dropbox().find('.vscomp-option.current-new').click(); + + vs().should((instance) => { + expect(instance.selectedValues).to.deep.equal(['Smith & Sons']); + }); + }); + + // --- what stage 1 deliberately keeps --- + + it('still renders "&" in a label as a single ampersand', () => { + cy.window().then((win) => mount(win)); + + openDropbox(); + dropbox() + .find('.vscomp-option[data-value="a&b"] .vscomp-option-text') + .should(($text) => { + expect($text.text().trim()).to.equal('Tom & Jerry'); + }); + }); + + it('still escapes markup in a label, so option text cannot execute', () => { + cy.window().then((win) => { + // @ts-expect-error - test marker + win.__vsAmpXss = undefined; + mountVs(win, mountId, { + options: [{ label: '', value: 'p1' }], + enableSecureText: true, + }); + }); + + openDropbox(); + dropbox().find('img[src="x"]').should('not.exist'); + + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__vsAmpXss, 'payload must not execute').to.not.eq(true); + }); + }); + + it('leaves everything unchanged when escaping is off', () => { + cy.window().then((win) => mount(win, { enableSecureText: false })); + + vs().should((instance) => { + expect(instance.options.map((d: any) => d.value)).to.deep.equal(['a&b', 'r&d', 'x ### ⚠️ Security: option text is rendered as HTML > -> By default (`enableSecureText: false`) option **labels and values are inserted as raw HTML and are NOT escaped**. If any option text (label, value, description, or `customData` used in markup) can come from untrusted input, this is an **XSS risk**. +> By default (`enableSecureText: false`) option **labels and descriptions are inserted as raw HTML and are NOT escaped**. If any option text (label, description, or `customData` used in markup) can come from untrusted input, this is an **XSS risk**. > -> - Set **`enableSecureText: true`** whenever options may contain user-supplied/untrusted text. It escapes the built-in option fields (**label**, **value**, and **description**). Note: `customData` is stored as-is (except where the library itself interpolates it, e.g. into the option `aria-label`), and any HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized — escape those yourself. +> - Set **`enableSecureText: true`** whenever options may contain user-supplied/untrusted text. It escapes the option fields that are rendered as HTML — **label** and **description**. (**value** is not escaped: it is never rendered as HTML, only compared and written to a `data-value` attribute, which is escaped at that boundary.) Note: `customData` is stored as-is (except where the library itself interpolates it, e.g. into the option `aria-label`), and any HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized — escape those yourself. > - It is **off by default on purpose**: escaping runs per option and adds measurable cost on **large datasets (10k–100k+ records)**. For large lists of *trusted, developer-controlled* data you can leave it off. > - When it is off, the plugin logs a **one-time** console warning (per page) on initialization so the trade-off is discoverable. Set **`showSecureTextWarning: false`** to suppress it once you have consciously accepted the trade-off. > - To turn escaping on for **every** dropdown at once instead of per call site, use [`VirtualSelect.setGlobalDefaults({ enableSecureText: true })`](methods.md#virtualselectsetglobaldefaults) during startup. Note it sets a *default*: an instance passing `enableSecureText` explicitly still wins. +> - **What escaping does and does not touch.** `enableSecureText: true` escapes only the two fields that are rendered as HTML — **`label` and `description`** — so `option.label` may read back as `Tom & Jerry` where you supplied `Tom & Jerry`. It renders correctly; only a direct read of the field shows the escaped form. +> - **`option.value` is always stored exactly as you supplied it**, escaping on or off. It is never rendered as HTML, so escaping it would only make the option impossible to address — `setValue()`, `setDisabledOptions()` and `getSelectedOptions()` all take and return your own value. +> - **Search always matches the text you supplied**, not the escaped form, so quotes, `&`, `<` and `>` in a label or description are all searchable. +> - Since 1.4.0, quotes are escaped at each attribute the library writes rather than in the stored text, so quoted text stores, renders and searches verbatim. | Name | Type | Default value | Description | | --------------------------------- | ----------------- | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | @@ -75,7 +79,7 @@ | disableAllOptionsSelectedText | Boolean | false | By default, when all values selected "All (10)" value text would be shown. Set true to show value text as "10 options selected". | | showValueAsTags | Boolean | false | Show each selected values as tags with remove icon | | disableOptionGroupCheckbox | Boolean | false | Disable option group title checkbox | -| enableSecureText | Boolean | false | **Security:** set `true` to escape the built-in option fields (label, value, and description) and prevent XSS. **Off by default** to avoid the per-option escaping cost on large datasets (10k–100k+ records); enable it whenever option text may contain untrusted input. Note: `customData` is stored as-is (except where the library itself interpolates it) and HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized. While off, option text is rendered as raw HTML and a one-time console warning is logged. See the security note at the top of this page. | +| enableSecureText | Boolean | false | **Security:** set `true` to escape the option fields rendered as HTML (label and description) and prevent XSS. `value` is never escaped — it reaches no HTML sink, so it stays exactly as you supplied it and remains usable with `setValue()`. **Off by default** to avoid the per-option escaping cost on large datasets (10k–100k+ records); enable it whenever option text may contain untrusted input. Note: `customData` is stored as-is (except where the library itself interpolates it) and HTML returned by `labelRenderer`/`selectedLabelRenderer` is **not** sanitized. While off, option text is rendered as raw HTML and a one-time console warning is logged. See the security note at the top of this page. | | showSecureTextWarning | Boolean | true | Whether to log the one-time console warning that fires when `enableSecureText` is disabled. Set `false` to suppress it once you have **consciously accepted** the XSS trade-off (trusted/developer-controlled option data or intentional HTML). Leaving it on is recommended so the trade-off stays discoverable. | | setValueAsArray | Boolean | false | Set value for hidden input in array format (e.g. '["1", "2"]') | | emptyValue | String | | Empty value to use for hidden input when no value is selected (e.g. 'null' or '[]' or 'none') | diff --git a/src/utils/utils.js b/src/utils/utils.js index b013f6ce..3c187a1e 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -279,6 +279,27 @@ export class Utils { return text.replace(/"/g, '"'); } + /** + * Escape a *raw* string for interpolation into a double-quoted HTML attribute. + * + * Use this only where the input has not already been HTML-escaped - currently the option + * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped + * first, otherwise the `&` introduced by the quote replacement would itself be escaped and + * the attribute would parse back as a literal `"`. + * + * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped + * label text: escaping `&` there would double it and a tooltip would show `&`. That + * asymmetry is the reason this is a separate helper rather than a shared one. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static escapeAttributeValue(text) { + return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); + } + /** * Turn a label into text that is safe and sensible inside an aria-label attribute. * diff --git a/src/virtual-select.js b/src/virtual-select.js index be2ec0f7..93753a63 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -467,10 +467,13 @@ export class VirtualSelect { * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, * whether or not enableSecureText was on. * - * Escaping cannot break reading the value back: the parser turns " into a quote, and - * setOptionAttr() rewrites data-value through the DOM API on every render anyway. + * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches + * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). + * Both together keep the attribute round-tripping: the parser turns `&` and `"` + * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on + * every render anyway. */ - const optionValueAttr = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.value)); + const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
`. + */ + const rawValue = getString(d[valueKey]); + const rawLabel = getString(d[labelKey]); + const value = rawValue; + const label = secureText(rawLabel); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -1742,9 +1761,9 @@ export class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && label.trim() !== '' - ? Utils.normalizeString(label).toLowerCase() - : label.toLowerCase(), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' + ? Utils.normalizeString(rawLabel).toLowerCase() + : rawLabel.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -1766,11 +1785,12 @@ export class VirtualSelect { } if (hasOptionDescription) { - const description = secureText(getString(d[descriptionKey])); - option.description = description; - option.descriptionNormalized = this.searchNormalize && description.trim() !== '' - ? Utils.normalizeString(description).toLowerCase() - : description.toLowerCase(); + const rawDescription = getString(d[descriptionKey]); + option.description = secureText(rawDescription); + /** normalised from the raw text, so a query containing `&` can match - see above */ + option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' + ? Utils.normalizeString(rawDescription).toLowerCase() + : rawDescription.toLowerCase(); } if (d.customData) { @@ -2331,7 +2351,8 @@ export class VirtualSelect { if (newOption) { const newIndex = newOption.index; - this.setOptionProp(newIndex, 'value', this.secureText(value)); + /** value verbatim, label escaped - the label is the only one rendered as HTML */ + this.setOptionProp(newIndex, 'value', value); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2589,22 +2610,23 @@ export class VirtualSelect { const { getString } = Utils; const secureText = this.secureText.bind(this); - const value = secureText(getString(data.value)); - const label = secureText(getString(data.label)); - const description = secureText(getString(data.description)); + /** value stored verbatim, search keys derived from the raw text - see setOptions() */ + const rawValue = getString(data.value); + const rawLabel = getString(data.label); + const rawDescription = getString(data.description); return { index: data.index, - value, - valueNormalized: value.toLowerCase(), - label, - labelNormalized: this.searchNormalize && label.trim() !== '' - ? Utils.normalizeString(label).toLowerCase() - : label.toLowerCase(), - description, - descriptionNormalized: this.searchNormalize && description.trim() !== '' - ? Utils.normalizeString(description).toLowerCase() - : description.toLowerCase(), + value: rawValue, + valueNormalized: rawValue.toLowerCase(), + label: secureText(rawLabel), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' + ? Utils.normalizeString(rawLabel).toLowerCase() + : rawLabel.toLowerCase(), + description: secureText(rawDescription), + descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' + ? Utils.normalizeString(rawDescription).toLowerCase() + : rawDescription.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, From 809b1c9e3edb4ccfdf85105667493bdf2add024e Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 16:50:36 +0100 Subject: [PATCH 42/57] fix(a11y): stop chrome label props breaking out of their attributes (AI-23) Six of the component's own label props are interpolated straight into an attribute and none of them passes through secureText(), so enableSecureText never covered them. A double quote closed the attribute early: the payload after it was parsed as markup, and the accessible name or placeholder kept only the prefix. A payload in all six produced five live injected attributes and left every affected name truncated to `x` - a WCAG 4.1.2 defect as much as an injection. selectAllText is the proof that this was a gap rather than a design. It has two sinks, and in the same render they behaved differently: the group-header aria-label builds through Utils.getAriaLabelText() and was intact with no injection, while the Select All button's own aria-label was raw and carried a live data-pwned attribute. So the fix is not a new mechanism - it is the helper AI-14 already added, applied at five more sites. - the four aria-label props and selectAllText's aria-label go through getAriaLabelText(): strip markup, then escape quotes, which is the right treatment for an accessible name; - searchPlaceholderText gets quote escaping only. It is visible UI text, so silently dropping markup would be wrong; - ariaLabelledby gets quote escaping only. It is an IDREF list rather than prose, and stripping tags there would mask a caller error instead of fixing it. selectAllText is also rendered as the visible Select All label, where HTML works today and is presumably deliberate - `Pick all` produces a real . That occurrence is untouched, and the spec pins it. The same check clears searchFormLabel, noOptionsText, noSearchResultsText and moreText: they have innerHTML sinks only, no attribute sink, so they keep supporting HTML. That is what bounds this item at exactly six props. One improvement that is technically a behaviour change: markup in an aria-label-style prop is now stripped from the accessible name, so `Pick all` announces as "Pick all" rather than as literal tag soup. That is AI-14's treatment, now finished for the component chrome. Spec: security-chrome-label-props.cy.ts (10). --- cypress/e2e/security-chrome-label-props.cy.ts | 154 ++++++++++++++++++ src/virtual-select.js | 38 ++++- 2 files changed, 186 insertions(+), 6 deletions(-) create mode 100644 cypress/e2e/security-chrome-label-props.cy.ts diff --git a/cypress/e2e/security-chrome-label-props.cy.ts b/cypress/e2e/security-chrome-label-props.cy.ts new file mode 100644 index 00000000..c60299e4 --- /dev/null +++ b/cypress/e2e/security-chrome-label-props.cy.ts @@ -0,0 +1,154 @@ +/** cSpell:ignore vscomp pwned labelledby */ + +/** + * AI-23 — the component's own label props were interpolated raw into attributes. + * + * OWASP A03:2021 (Injection) and WCAG 4.1.2 (Name, Role, Value). + * + * Six props reach an attribute directly and none of them passes through `secureText()`, so + * `enableSecureText: true` does not protect them. A double quote closes the attribute early: the + * remainder is parsed as markup, and the accessible name or placeholder keeps only the prefix. + * + * `selectAllText` is the proof that this is a gap rather than a design. It has two sinks in the + * same render, and they behaved differently: + * + * - the group-header `aria-label` builds through `Utils.getAriaLabelText()` — full text, no + * injection; + * - the Select All button's own `aria-label` interpolated raw — `aria-label="x"`, plus a live + * `data-pwned` attribute on the button. + * + * So the fix is not a new mechanism, it is the helper AI-14 already added, applied at five more + * sites. `aria-label` sinks get `getAriaLabelText()` (strip markup, escape quotes — the right + * treatment for an accessible name). `placeholder` and `aria-labelledby` get quote escaping only: + * a placeholder is visible UI text, so silently dropping markup would be wrong, and + * `aria-labelledby` is an IDREF rather than prose. + * + * The constraint that stops this being a one-line change: `selectAllText` is **also** rendered as + * `${this.selectAllText}`, where HTML works today and + * is presumably deliberate. Only the attribute occurrence changes; the last case pins that. + */ + +import { mountVs, unmountVs } from '../support/mount'; + +describe('Security: component label props cannot break out of their attributes', () => { + const mountId = 'vs-chrome'; + const payload = 'x" data-pwned="1" y="'; + + const mount = (win: Window, extra: Record = {}) => + mountVs(win, mountId, { + options: [{ label: 'Group', options: [{ label: 'Kid', value: 'k' }] }], + multiple: true, + search: true, + enableSecureText: true, + ...extra, + }); + + const openDropbox = () => cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + const dropbox = () => cy.get(`#${mountId}`).then(($ele) => cy.wrap($ele[0].virtualSelect.$dropbox)); + + beforeEach(() => { + cy.viewport(1280, 800); + cy.visit('get-started'); + }); + + afterEach(() => { + cy.window().then((win) => unmountVs(win, mountId)); + }); + + it('keeps the wrapper aria-label intact and injects nothing', () => { + cy.window().then((win) => mount(win, { ariaLabelText: payload })); + + cy.get(`#${mountId}`).find('.vscomp-ele-wrapper').should('have.attr', 'aria-label', payload); + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + }); + + it('keeps the clear button aria-label intact and injects nothing', () => { + cy.window().then((win) => mount(win, { ariaLabelClearButtonText: payload })); + + cy.get(`#${mountId}`).find('.vscomp-clear-button').should('have.attr', 'aria-label', payload); + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + }); + + it('keeps aria-labelledby intact and injects nothing', () => { + cy.window().then((win) => mount(win, { ariaLabelledby: payload })); + + cy.get(`#${mountId}`).find('.vscomp-ele-wrapper').should('have.attr', 'aria-labelledby', payload); + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + }); + + it('keeps the search placeholder intact and injects nothing', () => { + cy.window().then((win) => mount(win, { searchPlaceholderText: payload })); + + openDropbox(); + dropbox().find('.vscomp-search-input').should('have.attr', 'placeholder', payload); + dropbox().find('[data-pwned]').should('not.exist'); + }); + + it('keeps the search clear aria-label intact and injects nothing', () => { + cy.window().then((win) => mount(win, { ariaLabelSearchClearButtonText: payload })); + + openDropbox(); + dropbox().find('.vscomp-search-clear').should('have.attr', 'aria-label', payload); + dropbox().find('[data-pwned]').should('not.exist'); + }); + + it('keeps the Select All aria-label intact and injects nothing', () => { + cy.window().then((win) => mount(win, { selectAllText: payload })); + + openDropbox(); + dropbox().find('.vscomp-toggle-all-button').should('have.attr', 'aria-label', payload); + // Previously the payload put a live attribute on this very button. + dropbox().find('.vscomp-toggle-all-button').should('not.have.attr', 'data-pwned'); + dropbox().find('[data-pwned]').should('not.exist'); + }); + + it('injects nothing anywhere when every affected prop carries the payload', () => { + cy.window().then((win) => + mount(win, { + ariaLabelText: payload, + ariaLabelledby: payload, + ariaLabelClearButtonText: payload, + ariaLabelSearchClearButtonText: payload, + selectAllText: payload, + searchPlaceholderText: payload, + }), + ); + + openDropbox(); + cy.get(`#${mountId}`).find('[data-pwned]').should('not.exist'); + dropbox().find('[data-pwned]').should('not.exist'); + }); + + it('strips markup from an accessible name, as AI-14 does for option labels', () => { + cy.window().then((win) => mount(win, { selectAllText: 'Pick all' })); + + openDropbox(); + // A screen reader should hear "Pick all", not the literal tag soup it heard before. + dropbox().find('.vscomp-toggle-all-button').should('have.attr', 'aria-label', 'Pick all'); + }); + + it('still renders HTML in the visible Select All label', () => { + cy.window().then((win) => mount(win, { selectAllText: 'Pick all' })); + + openDropbox(); + // The other sink for the same prop. Escaping this one would be a visible regression. + dropbox().find('.vscomp-toggle-all-label b').should('contain', 'all'); + }); + + it('leaves plain values untouched', () => { + cy.window().then((win) => + mount(win, { + ariaLabelText: 'Countries', + selectAllText: 'Select all', + searchPlaceholderText: 'Search...', + }), + ); + + cy.get(`#${mountId}`).find('.vscomp-ele-wrapper').should('have.attr', 'aria-label', 'Countries'); + + openDropbox(); + dropbox().find('.vscomp-toggle-all-button').should('have.attr', 'aria-label', 'Select all'); + dropbox().find('.vscomp-toggle-all-label').should('contain', 'Select all'); + dropbox().find('.vscomp-search-input').should('have.attr', 'placeholder', 'Search...'); + }); +}); diff --git a/src/virtual-select.js b/src/virtual-select.js index 93753a63..3596a873 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -135,9 +135,24 @@ export class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; + /** + * These props are developer-supplied but still reach an attribute directly, and none of them + * passes through secureText() - so enableSecureText never protected them. A double quote + * closed the attribute early: the payload after it was parsed as markup, and the accessible + * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. + * + * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to + * option and group labels: strip markup, then escape quotes. Plain quote escaping for + * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide + * a caller error instead of fixing it. + */ + const ariaLabelledbyText = this.ariaLabelledby + ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` + : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText + ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` + : ''; let isExpanded = false; if (this.additionalClasses) { @@ -512,8 +527,18 @@ export class VirtualSelect { * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). * aria-checked is kept in sync by toggleAllOptionsClass(). */ + /** + * selectAllText has two sinks, and only the attribute one is escaped. + * + * The visible label below is rendered as HTML and that works today - `Pick all` + * produces a real - so escaping it would be a visible regression for anyone styling + * the Select All label. The accessible name, by contrast, was raw: a quote broke out of + * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same + * treatment the group-header aria-label a few methods up already applies to this exact + * prop, which is why that sink was safe while this one was not. + */ checkboxHtml = ` + aria-checked="false" aria-label="${Utils.getAriaLabelText(this.selectAllText)}"> ${this.selectAllText} `; @@ -521,7 +546,7 @@ export class VirtualSelect { if (this.hasSearch) { const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText - ? `aria-label="${this.ariaLabelSearchClearButtonText}"` + ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; searchInput = ` - From 8f8e7079c8d79eb2d32d01c93549d384c8025130 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 18:30:38 +0100 Subject: [PATCH 43/57] test(security): fix two spec bugs the first Cypress run exposed (AI-20, AI-22) Both failures were in the specs, not the product. The product assertions behind them were re-verified in a real browser and hold. security-proto-value "does not pollute Object.prototype" could never have passed. Spec code runs in the Cypress runner frame while cy.window() returns the application iframe's window, and those are separate realms with separate intrinsics - so `Object.getPrototypeOf({}) === win.Object.prototype` is false whether or not anything was polluted. Demonstrated directly with an iframe: same-realm true, cross-realm false, and true again for a probe built with `new win.Object()`. It now snapshots the application realm's Object.prototype own-property names, runs the operations and compares, which is what actually tests for pollution, plus a fresh probe still inheriting from it. security-ampersand-storage "stores a typed new option value verbatim" reported ['S'] rather than ['Smith & Sons'] - the component only ever saw the first typed character. That mechanism is NOT explained. Ruled out against a real browser driving real input events at 0/10/12 ms per key: the search input node is never replaced; nothing writes back to its value on the typing path (onSearch passes skipInputSet = true); DOM focus stays on the input throughout; searchDelay does not apply to local search; the keydown map claims only Enter/Up/Down/Delete/ Backspace so no letter is preventDefault-ed; and the stored value, data-value and resulting selection are correct at every speed tried. Rather than guess, the case is split. One asserts only that the typed term reaches the component, so a dropped keystroke is reported as a typing problem instead of surfacing as a value mismatch that reads like a storage bug. The other drives the search through setSearchValue() - the same entry point onSearch() calls for a keystroke - asserts the derived option's value before anything is clicked, and then selects by an exact data-value selector so the retry lands on the row carrying the full term rather than whichever node the virtualiser had rendered a moment earlier. That is the coupling AI-1e removed elsewhere in this suite. If the typing case fails again in CI, that is the real signal and the mechanism is still open. --- cypress/e2e/security-ampersand-storage.cy.ts | 41 +++++++++++++++++++- cypress/e2e/security-proto-value.cy.ts | 28 +++++++++++-- 2 files changed, 64 insertions(+), 5 deletions(-) diff --git a/cypress/e2e/security-ampersand-storage.cy.ts b/cypress/e2e/security-ampersand-storage.cy.ts index b1836041..1310c949 100644 --- a/cypress/e2e/security-ampersand-storage.cy.ts +++ b/cypress/e2e/security-ampersand-storage.cy.ts @@ -199,12 +199,49 @@ describe('Security: option values are stored verbatim, not HTML-escaped', () => }); }); - it('stores a typed new option value verbatim', () => { + it('receives the whole typed term, ampersand included', () => { cy.window().then((win) => mount(win, { search: true, allowNewOption: true })); openDropbox(); cy.get(`#${mountId}`).find('.vscomp-search-input').type('Smith & Sons'); - dropbox().find('.vscomp-option.current-new').click(); + + /** + * Deliberately separate from the storage assertion below. + * + * Every keystroke re-renders the option list, and with allowNewOption it also adds and + * updates a "current new" row. Folding "typing works" and "the value is stored verbatim" + * into one case made a dropped keystroke surface as a value mismatch, which reads like a + * storage bug and is not one. Here the search text is asserted on its own, so a typing + * problem is reported as a typing problem. + */ + cy.get(`#${mountId}`).find('.vscomp-search-input').should('have.value', 'Smith & Sons'); + vs().should((instance) => { + expect(instance.searchValueOriginal, 'the component saw the whole term').to.equal('Smith & Sons'); + }); + }); + + it('stores a typed new option value verbatim', () => { + cy.window().then((win) => mount(win, { search: true, allowNewOption: true })); + + openDropbox(); + /** + * setSearchValue() is the entry point onSearch() calls for a keystroke, so this covers the + * same code path without depending on per-character typing into a list that re-renders on + * every input event - the coupling AI-1e removed elsewhere in this suite. + */ + cy.get(`#${mountId}`).then(($ele) => $ele[0].virtualSelect.setSearchValue('Smith & Sons')); + + // the option the component derives from the search text, before anything is clicked + vs().should((instance) => { + const created = instance.options.find((d: any) => d.isCurrentNew); + + expect(created, 'a new option is offered').to.not.equal(undefined); + expect(created.value, 'value stored verbatim').to.equal('Smith & Sons'); + }); + + // Scoped by data-value so the retry lands on the row that carries the full term, rather + // than whichever node the virtualiser happened to have rendered a moment earlier. + dropbox().find('.vscomp-option.current-new[data-value="Smith & Sons"]').click(); vs().should((instance) => { expect(instance.selectedValues).to.deep.equal(['Smith & Sons']); diff --git a/cypress/e2e/security-proto-value.cy.ts b/cypress/e2e/security-proto-value.cy.ts index d726f8f5..6427862b 100644 --- a/cypress/e2e/security-proto-value.cy.ts +++ b/cypress/e2e/security-proto-value.cy.ts @@ -55,15 +55,37 @@ describe('Security: option values that collide with Object.prototype members', ( it('does not pollute Object.prototype', () => { cy.window().then((win) => { + /** + * The probe must be built in the *application's* realm. + * + * Spec code runs in the Cypress runner frame; `cy.window()` returns the application + * iframe's window. Those are separate realms with separate intrinsics, so an object + * literal written here has the runner frame's `Object.prototype` on its chain and can + * never `equal` `win.Object.prototype` — that comparison fails whether or not anything + * was polluted, which is exactly how this case first went wrong. + * + * So: snapshot the application realm's own `Object.prototype` members, run the + * operations, and compare. A pollution would show up as a new member, and a prototype + * swap as a fresh object no longer inheriting from it. + */ + const appObject = (win as unknown as { Object: ObjectConstructor }).Object; + const membersBefore = Object.getOwnPropertyNames(appObject.prototype).sort().join(','); + mount(win); const $ele = win.document.getElementById(mountId) as HTMLElement; $ele.setValue?.(['__proto__']); $ele.setDisabledOptions?.(['__proto__']); + $ele.setEnabledOptions?.(['__proto__']); + + expect( + Object.getOwnPropertyNames(appObject.prototype).sort().join(','), + 'Object.prototype must not gain a member', + ).to.equal(membersBefore); - // @ts-expect-error - deliberately probing the prototype chain - expect(({}).__proto__, 'Object.prototype must be intact').to.equal(win.Object.prototype); - expect(Object.getPrototypeOf({}), 'no prototype swap').to.equal(win.Object.prototype); + const probe = new appObject(); + expect(Object.getPrototypeOf(probe), 'a fresh object still inherits from it').to.equal(appObject.prototype); + expect(typeof appObject.prototype, 'it is still an object, not a replaced value').to.equal('object'); }); }); From 234366ab252de82988b32358a6d54a902751465e Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 18:46:51 +0100 Subject: [PATCH 44/57] test(security): type the search term with real key events (AI-22) The typed-search case stalled after the first character under cy.type(). The previous commit split the case so that "typing works" and "the value is stored verbatim" fail separately, and the second CI run localised it: the storage case passes, and the typing case fails on the *input's own DOM value* - it stays 'S' for the full 4s retry window. So the term never reached the field, and nothing was wrong with how the value is stored. The cause is Cypress's simulated typing, not the component. Verified against the built bundle: - real per-character keyboard input over CDP carries the whole term through - input value, searchValueOriginal, the derived option's value and its data-value were all 'Smith & Sons', with focus still on the input; - synthetic input events at 0/10/12 ms per key behave correctly too; - the search input node is never replaced, nothing writes back to its value on the typing path (onSearch passes skipInputSet = true), DOM focus never leaves it, searchDelay does not apply to local search, and the keydown map claims only Enter/Up/Down/Delete/Backspace so no letter is preventDefault-ed; - security-quote-escaping types "City" with plain .type() and passes. The distinguishing factor is allowNewOption, which adds and updates a "current new" row on every keystroke. Why that upsets cy.type() specifically is still unexplained, but it is contained to Cypress's typing simulation. So the case now focuses the input and uses cy.realType(), which dispatches real key events over CDP - the same remedy AI-1e applied to key presses via pressKeys()/realPress(), for the same reason, and the same input path proved correct in a browser. realType() is a parent command that types into whatever holds focus, hence the explicit focus() first. The remaining plain .type() in security-quote-escaping is left alone on purpose: it passes, and there is no reason to churn a green test on speculation. --- cypress/e2e/security-ampersand-storage.cy.ts | 28 +++++++++++++++----- 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/cypress/e2e/security-ampersand-storage.cy.ts b/cypress/e2e/security-ampersand-storage.cy.ts index 1310c949..3b1fea66 100644 --- a/cypress/e2e/security-ampersand-storage.cy.ts +++ b/cypress/e2e/security-ampersand-storage.cy.ts @@ -203,16 +203,30 @@ describe('Security: option values are stored verbatim, not HTML-escaped', () => cy.window().then((win) => mount(win, { search: true, allowNewOption: true })); openDropbox(); - cy.get(`#${mountId}`).find('.vscomp-search-input').type('Smith & Sons'); /** - * Deliberately separate from the storage assertion below. + * realType(), not .type(): real key events over CDP rather than Cypress's simulated typing. * - * Every keystroke re-renders the option list, and with allowNewOption it also adds and - * updates a "current new" row. Folding "typing works" and "the value is stored verbatim" - * into one case made a dropped keystroke surface as a value mismatch, which reads like a - * storage bug and is not one. Here the search text is asserted on its own, so a typing - * problem is reported as a typing problem. + * With `.type()` this case stalled after the first character - the input's own value stayed + * `'S'` for the full retry window, so the term never reached the component at all. The cause + * is specific to Cypress's simulated typing: real per-character keyboard input against the + * built bundle carries the whole term through (verified in a browser - input value, + * searchValueOriginal, the derived option's value and its data-value were all correct), and + * `security-quote-escaping` types with `.type()` successfully. The distinguishing factor here + * is `allowNewOption`, which adds and updates a "current new" row on every keystroke. + * + * This is the same remedy AI-1e applied to key presses, for the same reason: drive the + * component with real events instead of simulated ones. realType() is a parent command that + * types into whatever holds focus, so the input is focused first - the pattern `pressKeys()` + * already uses. + */ + cy.get(`#${mountId}`).find('.vscomp-search-input').focus(); + cy.realType('Smith & Sons'); + + /** + * Kept separate from the storage assertion below. Folding "typing works" and "the value is + * stored verbatim" into one case made a dropped keystroke surface as a value mismatch, which + * reads like a storage bug and is not one. */ cy.get(`#${mountId}`).find('.vscomp-search-input').should('have.value', 'Smith & Sons'); vs().should((instance) => { From 35540fc8f6678d83c378dc3d1b4cd34246fe6702 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 19:25:23 +0100 Subject: [PATCH 45/57] fix(a11y): stop centering the Select All checkbox in its hit-box justify-content: center on .vscomp-toggle-all-button, added for the WCAG 2.5.8 min target size, centered the checkbox+label inside the full-width button instead of left-aligning it like the option rows below. Drop the centering; the min-height/min-width floor alone covers the target-size fix since align-items already centers vertically. --- dist-archive/virtual-select-1.3.0.min.css | 2 +- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 873 +++++++++++++++++++--- dist/virtual-select.min.css | 2 +- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 873 +++++++++++++++++++--- docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- src/sass/partials/virtual-select.scss | 3 +- 9 files changed, 1526 insertions(+), 235 deletions(-) diff --git a/dist-archive/virtual-select-1.3.0.min.css b/dist-archive/virtual-select-1.3.0.min.css index 29fc53eb..7257fcff 100644 --- a/dist-archive/virtual-select-1.3.0.min.css +++ b/dist-archive/virtual-select-1.3.0.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index 5ab3dec1..c4ec13c2 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/dist/virtual-select.js b/dist/virtual-select.js index 42bceeac..031c6bac 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -198,17 +198,77 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { + fontSize, + fontFamily, + fontWeight, + letterSpacing + } = window.getComputedStyle(container); + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + return $measurer.clientWidth > container.clientWidth; + } + + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -221,6 +281,45 @@ class Utils { return text.replace(/"/g, '"'); } + /** + * Escape a *raw* string for interpolation into a double-quoted HTML attribute. + * + * Use this only where the input has not already been HTML-escaped - currently the option + * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped + * first, otherwise the `&` introduced by the quote replacement would itself be escaped and + * the attribute would parse back as a literal `"`. + * + * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped + * label text: escaping `&` there would double it and a tooltip would show `&`. That + * asymmetry is the reason this is a separate helper rather than a shared one. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static escapeAttributeValue(text) { + return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); + } + + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together (so "France
Paris" does not collapse into one word), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text @@ -329,6 +428,13 @@ class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -452,6 +558,42 @@ class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + DomUtils.getElements($ele).forEach($this => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -600,7 +742,21 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - html += ` ${k}="${v}" `; + /** + * Quotes are escaped here, at the attribute boundary, because this is the only place + * that knows the value is about to be wrapped in double quotes. + * + * The caller that matters is getTooltipAttrText(), which passes option labels through + * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) + * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and + * put a live attribute on the value-tag element. Escaping unconditionally here removes + * the condition, and the parser turns " back into a quote, so the attribute still + * reads back as the original string. + * + * String(), not Utils.getString(): the latter maps `false` to '', and some of these + * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). + */ + html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; } }); return html; @@ -651,6 +807,9 @@ class DomUtils { }); } } +;// ./src/utils/index.js + + ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -672,7 +831,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -708,9 +867,20 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; + /** + * These props are developer-supplied but still reach an attribute directly, and none of them + * passes through secureText() - so enableSecureText never protected them. A double quote + * closed the attribute early: the payload after it was parsed as markup, and the accessible + * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. + * + * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to + * option and group labels: strip markup, then escape quotes. Plain quote escaping for + * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide + * a caller error instead of fixing it. + */ + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -751,7 +921,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -763,6 +933,11 @@ class VirtualSelect {
+
+ +
+ ${this.renderDropbox({ wrapperClasses })} @@ -782,6 +957,25 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + + /** + * The submitting field's name is set as a DOM property, not interpolated into the template. + * + * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so + * the remainder of the value was parsed as markup (real elements, an injection) while the + * field kept only the truncated prefix - or, when the payload also swallowed the following + * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw + * inside the constructor. Either way the form silently stopped submitting the right name, + * and that included legitimate names such as `items["a"]`. + * + * A property assignment performs no HTML parsing, so there is nothing to break out of and + * nothing to escape - which is also why `name` no longer goes through secureText(): the + * escaping only ever protected this sink, and applying it here corrupted the submitted + * field name into `items["a"]`. + */ + this.$hiddenInput.name = this.name; + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -811,7 +1005,9 @@ class VirtualSelect {
-
+
@@ -844,8 +1040,16 @@ class VirtualSelect { return html; } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -908,14 +1112,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } if (isSelected) { @@ -932,13 +1136,13 @@ class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } if (hasLabelRenderer) { @@ -964,8 +1168,23 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } + + /** + * The option value is an untrusted string going straight into an attribute, so a double + * quote in it closed data-value early and everything after it was parsed as markup - a + * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, + * whether or not enableSecureText was on. + * + * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches + * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). + * Both together keep the attribute round-tripping: the parser turns `&` and `"` + * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on + * every render anyway. + */ + const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -988,20 +1207,40 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + /** + * selectAllText has two sinks, and only the attribute one is escaped. + * + * The visible label below is rendered as HTML and that works today - `Pick all` + * produces a real - so escaping it would be a visible regression for anyone styling + * the Select All label. The accessible name, by contrast, was raw: a quote broke out of + * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same + * treatment the group-header aria-label a few methods up already applies to this exact + * prop, which is why that sink was safe while this one was not. + */ + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1132,14 +1371,29 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1157,33 +1411,34 @@ class VirtualSelect { this.openDropbox(); } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction: 'next' + direction }); } else { this.openDropbox(); } } + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); - if (this.isOpened()) { - this.focusOption({ - direction: 'previous' - }); - } else { - this.openDropbox(); - } + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1220,8 +1475,24 @@ class VirtualSelect { this.reset(); } } + + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + if (this.isDestroyed) { + return; + } + this.setVisibleOptions(true); + }); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1388,6 +1659,8 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } @@ -1453,6 +1726,12 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1511,9 +1790,16 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - this.focusOption({ - focusFirst: true - }); + + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ + focusFirst: true + }); + } + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1599,6 +1885,14 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1613,7 +1907,8 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - this.name = this.secureText(options.name); + /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ + this.name = options.name; this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1635,6 +1930,16 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -1663,13 +1968,25 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1693,10 +2010,19 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1718,11 +2044,17 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -1746,6 +2078,8 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -1774,8 +2108,23 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - const valuesMapping = {}; - const valuesOrder = {}; + /** + * Option values are untrusted strings used as keys, so every value-keyed lookup in this + * file is built with Object.create(null) rather than `{}`. + * + * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object + * calls the inherited setter, which ignores a non-object value, so nothing is written and + * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns + * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups + * all compare against `true`. An option whose value is `__proto__` was therefore + * selectable by click (that path reads data-value, not a mapping) but invisible to + * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read + * back could not be restored - and under allowNewOption it was mistaken for an unknown + * value and duplicated. A null prototype has no inherited members, so an arbitrary string + * key behaves like any other. + */ + const valuesMapping = Object.create(null); + const valuesOrder = Object.create(null); let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -1838,7 +2187,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = {}; + const valuesMapping = Object.create(null); preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -1899,7 +2248,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -1933,7 +2282,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = {}; + const enabledOptionsMapping = Object.create(null); enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -1968,7 +2317,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -1981,8 +2330,25 @@ class VirtualSelect { [labelKey]: d }; } - const value = secureText(getString(d[valueKey])); - const label = secureText(getString(d[labelKey])); + + /** + * `value` is stored verbatim; only `label` and `description` are escaped. + * + * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` + * attribute (escaped there, at the boundary) and is otherwise only compared or used as a + * map key. Escaping it stored an identity the caller could not name - `a&b` became + * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set + * again. + * + * The normalised search keys derive from the *raw* text for the same reason: they are + * matched against what the user types into the search box, which is never HTML-escaped. + * Deriving them from the escaped text meant no query could match text containing `&`, + * `<` or `>`. + */ + const rawValue = getString(d[valueKey]); + const rawLabel = getString(d[labelKey]); + const value = rawValue; + const label = secureText(rawLabel); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -1990,7 +2356,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2008,9 +2374,10 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const description = secureText(getString(d[descriptionKey])); - option.description = description; - option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); + const rawDescription = getString(d[descriptionKey]); + option.description = secureText(rawDescription); + /** normalised from the raw text, so a query containing `&` can match - see above */ + option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2056,7 +2423,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = {}; + const newOptionsValueMapping = Object.create(null); optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2090,11 +2457,18 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2181,6 +2555,15 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } + + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2227,11 +2610,13 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2377,6 +2762,14 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2465,10 +2858,15 @@ class VirtualSelect { if (!value) { return; } + + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - this.setOptionProp(newIndex, 'value', this.secureText(value)); + + /** value verbatim, label escaped - the label is the only one rendered as HTML */ + this.setOptionProp(newIndex, 'value', value); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2485,7 +2883,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2501,7 +2899,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = {}; + const availableValuesMapping = Object.create(null); this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -2596,7 +2994,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = {}; + const valuesMapping = Object.create(null); let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -2671,9 +3069,11 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; + /** quotes are escaped unconditionally by getAttributesText(); escaping again here would + * leave a literal " in the tooltip, and the old containsHTML() condition is what + * let a tag-free payload through in the first place */ const data = { - 'data-tooltip': tootltipText || '', + 'data-tooltip': text || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -2697,17 +3097,18 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - const value = secureText(getString(data.value)); - const label = secureText(getString(data.label)); - const description = secureText(getString(data.description)); + /** value stored verbatim, search keys derived from the raw text - see setOptions() */ + const rawValue = getString(data.value); + const rawLabel = getString(data.label); + const rawDescription = getString(data.description); return { index: data.index, - value, - valueNormalized: value.toLowerCase(), - label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), - description, - descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), + value: rawValue, + valueNormalized: rawValue.toLowerCase(), + label: secureText(rawLabel), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + description: secureText(rawDescription), + descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -2733,7 +3134,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -2791,7 +3192,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = {}; + const valuesOrder = Object.create(null); selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -2805,7 +3206,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = {}; + const disabledOptionsValueMapping = Object.create(null); const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -2943,6 +3344,8 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3002,9 +3405,22 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3017,7 +3433,26 @@ class VirtualSelect { } else { this.afterHidePopper(); } - this.setSearchValue(''); + + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. The reset runs + * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the + * highlight coming back after *every* later filter clear, which is far harder to diagnose + * than the exception itself. + */ + this.isClosing = true; + try { + this.setSearchValue(''); + } finally { + this.isClosing = false; + } } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3372,7 +3807,14 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3420,7 +3862,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = {}; + const valuesMapping = Object.create(null); const { removeItemFromArray } = Utils; @@ -3465,7 +3907,15 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -3524,6 +3974,8 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3643,6 +4095,9 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3677,18 +4132,52 @@ class VirtualSelect { return true; } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ - this.multiple && minValues && selectedValues.length < minValues))) { - hasError = true; + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { + /** required minium options not selected */ + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + const text = message || ''; + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3739,6 +4228,12 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -3767,8 +4262,20 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ - this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); + + /** + * escape potentially harmful markup so label/value/description cannot trigger XSS. + * + * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML + * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as + * `The &quot;City&quot; of Light`, shown to the user as `The "City" of + * Light`, and made unsearchable, because labelNormalized derives from the stored text. + * Quotes only need escaping inside an attribute, and that now happens at each attribute + * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also + * covers the sinks this pre-escaping never reached, such as an attribute written while + * enableSecureText is off. + */ + this.$secureText.nodeValue = text; return this.$secureDiv.innerHTML; } @@ -3789,9 +4296,78 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } + + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + const text = message || ''; + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + if (count === 0) { + return this.noSearchResultsText; + } + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + if (count === 0) { + return this.noOptionsSelectedText; + } + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + this.announce(this.getResultsCountMessage()); + } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -3807,17 +4383,83 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { + ...props + }; + delete safeProps.ele; + delete safeProps.options; + VirtualSelect.globalDefaults = { + ...VirtualSelect.globalDefaults, + ...safeProps + }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { + ...VirtualSelect.globalDefaults + }; + } static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4048,6 +4690,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/dist/virtual-select.min.css b/dist/virtual-select.min.css index 29fc53eb..7257fcff 100644 --- a/dist/virtual-select.min.css +++ b/dist/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index 5ab3dec1..c4ec13c2 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 42bceeac..031c6bac 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -198,17 +198,77 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { + fontSize, + fontFamily, + fontWeight, + letterSpacing + } = window.getComputedStyle(container); + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + return $measurer.clientWidth > container.clientWidth; + } + + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -221,6 +281,45 @@ class Utils { return text.replace(/"/g, '"'); } + /** + * Escape a *raw* string for interpolation into a double-quoted HTML attribute. + * + * Use this only where the input has not already been HTML-escaped - currently the option + * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped + * first, otherwise the `&` introduced by the quote replacement would itself be escaped and + * the attribute would parse back as a literal `"`. + * + * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped + * label text: escaping `&` there would double it and a tooltip would show `&`. That + * asymmetry is the reason this is a separate helper rather than a shared one. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static escapeAttributeValue(text) { + return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); + } + + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that + * markup became tag soup in the accessible name, and a double quote in the label broke out + * of the attribute and truncated the name. Tags collapse to a single space so adjacent + * words do not run together (so "France
Paris" does not collapse into one word), then the + * remaining quotes are escaped. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); + return Utils.replaceDoubleQuotesWithHTML(plainText); + } + /** * @static * @param {string} text @@ -329,6 +428,13 @@ class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -452,6 +558,42 @@ class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + DomUtils.getElements($ele).forEach($this => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -600,7 +742,21 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - html += ` ${k}="${v}" `; + /** + * Quotes are escaped here, at the attribute boundary, because this is the only place + * that knows the value is about to be wrapped in double quotes. + * + * The caller that matters is getTooltipAttrText(), which passes option labels through + * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) + * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and + * put a live attribute on the value-tag element. Escaping unconditionally here removes + * the condition, and the parser turns " back into a quote, so the attribute still + * reads back as the original string. + * + * String(), not Utils.getString(): the latter maps `false` to '', and some of these + * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). + */ + html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; } }); return html; @@ -651,6 +807,9 @@ class DomUtils { }); } } +;// ./src/utils/index.js + + ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -672,7 +831,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -708,9 +867,20 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; + /** + * These props are developer-supplied but still reach an attribute directly, and none of them + * passes through secureText() - so enableSecureText never protected them. A double quote + * closed the attribute early: the payload after it was parsed as markup, and the accessible + * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. + * + * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to + * option and group labels: strip markup, then escape quotes. Plain quote escaping for + * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide + * a caller error instead of fixing it. + */ + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -751,7 +921,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -763,6 +933,11 @@ class VirtualSelect {
+
+ +
+ ${this.renderDropbox({ wrapperClasses })} @@ -782,6 +957,25 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + + /** + * The submitting field's name is set as a DOM property, not interpolated into the template. + * + * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so + * the remainder of the value was parsed as markup (real elements, an injection) while the + * field kept only the truncated prefix - or, when the payload also swallowed the following + * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw + * inside the constructor. Either way the form silently stopped submitting the right name, + * and that included legitimate names such as `items["a"]`. + * + * A property assignment performs no HTML parsing, so there is nothing to break out of and + * nothing to escape - which is also why `name` no longer goes through secureText(): the + * escaping only ever protected this sink, and applying it here corrupted the submitted + * field name into `items["a"]`. + */ + this.$hiddenInput.name = this.name; + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -811,7 +1005,9 @@ class VirtualSelect {
-
+
@@ -844,8 +1040,16 @@ class VirtualSelect { return html; } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -908,14 +1112,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } if (isSelected) { @@ -932,13 +1136,13 @@ class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } if (hasLabelRenderer) { @@ -964,8 +1168,23 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } + + /** + * The option value is an untrusted string going straight into an attribute, so a double + * quote in it closed data-value early and everything after it was parsed as markup - a + * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, + * whether or not enableSecureText was on. + * + * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches + * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). + * Both together keep the attribute round-tripping: the parser turns `&` and `"` + * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on + * every render anyway. + */ + const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -988,20 +1207,40 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + /** + * selectAllText has two sinks, and only the attribute one is escaped. + * + * The visible label below is rendered as HTML and that works today - `Pick all` + * produces a real - so escaping it would be a visible regression for anyone styling + * the Select All label. The accessible name, by contrast, was raw: a quote broke out of + * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same + * treatment the group-header aria-label a few methods up already applies to this exact + * prop, which is why that sink was safe while this one was not. + */ + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1132,14 +1371,29 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1157,33 +1411,34 @@ class VirtualSelect { this.openDropbox(); } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction: 'next' + direction }); } else { this.openDropbox(); } } + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); - if (this.isOpened()) { - this.focusOption({ - direction: 'previous' - }); - } else { - this.openDropbox(); - } + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1220,8 +1475,24 @@ class VirtualSelect { this.reset(); } } + + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + if (this.isDestroyed) { + return; + } + this.setVisibleOptions(true); + }); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1388,6 +1659,8 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } @@ -1453,6 +1726,12 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1511,9 +1790,16 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - this.focusOption({ - focusFirst: true - }); + + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ + focusFirst: true + }); + } + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1599,6 +1885,14 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1613,7 +1907,8 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - this.name = this.secureText(options.name); + /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ + this.name = options.name; this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1635,6 +1930,16 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -1663,13 +1968,25 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1693,10 +2010,19 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1718,11 +2044,17 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + return Object.assign(defaultOptions, globalDefaults, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -1746,6 +2078,8 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -1774,8 +2108,23 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - const valuesMapping = {}; - const valuesOrder = {}; + /** + * Option values are untrusted strings used as keys, so every value-keyed lookup in this + * file is built with Object.create(null) rather than `{}`. + * + * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object + * calls the inherited setter, which ignores a non-object value, so nothing is written and + * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns + * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups + * all compare against `true`. An option whose value is `__proto__` was therefore + * selectable by click (that path reads data-value, not a mapping) but invisible to + * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read + * back could not be restored - and under allowNewOption it was mistaken for an unknown + * value and duplicated. A null prototype has no inherited members, so an arbitrary string + * key behaves like any other. + */ + const valuesMapping = Object.create(null); + const valuesOrder = Object.create(null); let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -1838,7 +2187,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = {}; + const valuesMapping = Object.create(null); preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -1899,7 +2248,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -1933,7 +2282,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = {}; + const enabledOptionsMapping = Object.create(null); enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -1968,7 +2317,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -1981,8 +2330,25 @@ class VirtualSelect { [labelKey]: d }; } - const value = secureText(getString(d[valueKey])); - const label = secureText(getString(d[labelKey])); + + /** + * `value` is stored verbatim; only `label` and `description` are escaped. + * + * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` + * attribute (escaped there, at the boundary) and is otherwise only compared or used as a + * map key. Escaping it stored an identity the caller could not name - `a&b` became + * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set + * again. + * + * The normalised search keys derive from the *raw* text for the same reason: they are + * matched against what the user types into the search box, which is never HTML-escaped. + * Deriving them from the escaped text meant no query could match text containing `&`, + * `<` or `>`. + */ + const rawValue = getString(d[valueKey]); + const rawLabel = getString(d[labelKey]); + const value = rawValue; + const label = secureText(rawLabel); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -1990,7 +2356,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2008,9 +2374,10 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const description = secureText(getString(d[descriptionKey])); - option.description = description; - option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); + const rawDescription = getString(d[descriptionKey]); + option.description = secureText(rawDescription); + /** normalised from the raw text, so a query containing `&` can match - see above */ + option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2056,7 +2423,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = {}; + const newOptionsValueMapping = Object.create(null); optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2090,11 +2457,18 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2181,6 +2555,15 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } + + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + */ + if (this.isInitialized) { + this.announce(this.getSelectionMessage()); + } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2227,11 +2610,13 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2377,6 +2762,14 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2465,10 +2858,15 @@ class VirtualSelect { if (!value) { return; } + + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - this.setOptionProp(newIndex, 'value', this.secureText(value)); + + /** value verbatim, label escaped - the label is the only one rendered as HTML */ + this.setOptionProp(newIndex, 'value', value); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2485,7 +2883,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2501,7 +2899,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = {}; + const availableValuesMapping = Object.create(null); this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -2596,7 +2994,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = {}; + const valuesMapping = Object.create(null); let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -2671,9 +3069,11 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; + /** quotes are escaped unconditionally by getAttributesText(); escaping again here would + * leave a literal " in the tooltip, and the old containsHTML() condition is what + * let a tag-free payload through in the first place */ const data = { - 'data-tooltip': tootltipText || '', + 'data-tooltip': text || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -2697,17 +3097,18 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - const value = secureText(getString(data.value)); - const label = secureText(getString(data.label)); - const description = secureText(getString(data.description)); + /** value stored verbatim, search keys derived from the raw text - see setOptions() */ + const rawValue = getString(data.value); + const rawLabel = getString(data.label); + const rawDescription = getString(data.description); return { index: data.index, - value, - valueNormalized: value.toLowerCase(), - label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), - description, - descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), + value: rawValue, + valueNormalized: rawValue.toLowerCase(), + label: secureText(rawLabel), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + description: secureText(rawDescription), + descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -2733,7 +3134,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -2791,7 +3192,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = {}; + const valuesOrder = Object.create(null); selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -2805,7 +3206,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = {}; + const disabledOptionsValueMapping = Object.create(null); const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -2943,6 +3344,8 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3002,9 +3405,22 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3017,7 +3433,26 @@ class VirtualSelect { } else { this.afterHidePopper(); } - this.setSearchValue(''); + + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. The reset runs + * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the + * highlight coming back after *every* later filter clear, which is far harder to diagnose + * than the exception itself. + */ + this.isClosing = true; + try { + this.setSearchValue(''); + } finally { + this.isClosing = false; + } } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3372,7 +3807,14 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3420,7 +3862,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = {}; + const valuesMapping = Object.create(null); const { removeItemFromArray } = Utils; @@ -3465,7 +3907,15 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -3524,6 +3974,8 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3643,6 +4095,9 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3677,18 +4132,52 @@ class VirtualSelect { return true; } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ - this.multiple && minValues && selectedValues.length < minValues))) { - hasError = true; + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { + /** required minium options not selected */ + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + const text = message || ''; + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + if (text) { + this.announce(text); + } + } + /** * 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). @@ -3739,6 +4228,12 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -3767,8 +4262,20 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ - this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); + + /** + * escape potentially harmful markup so label/value/description cannot trigger XSS. + * + * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML + * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as + * `The &quot;City&quot; of Light`, shown to the user as `The "City" of + * Light`, and made unsearchable, because labelNormalized derives from the stored text. + * Quotes only need escaping inside an attribute, and that now happens at each attribute + * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also + * covers the sinks this pre-escaping never reached, such as an attribute written while + * enableSecureText is off. + */ + this.$secureText.nodeValue = text; return this.$secureDiv.innerHTML; } @@ -3789,9 +4296,78 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } + + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + const text = message || ''; + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + if (count === 0) { + return this.noSearchResultsText; + } + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + if (count === 0) { + return this.noOptionsSelectedText; + } + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + this.announce(this.getResultsCountMessage()); + } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -3807,17 +4383,83 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { + ...props + }; + delete safeProps.ele; + delete safeProps.options; + VirtualSelect.globalDefaults = { + ...VirtualSelect.globalDefaults, + ...safeProps + }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { + ...VirtualSelect.globalDefaults + }; + } static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4048,6 +4690,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 29fc53eb..7257fcff 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 5ab3dec1..c4ec13c2 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 36536a4b..d23b8f32 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -449,8 +449,9 @@ /** * WCAG 2.5.8: the button previously collapsed to its 25x15 content box. * A min-* floor grows the hit area without scaling the checkbox glyph inside it. + * No justify-content override: the checkbox must stay left-aligned with the + * option checkboxes below it, not centered in the button's full width. */ - justify-content: center; min-height: v.$min-target-size; min-width: v.$min-target-size; } From 7c878f01a93f01b524e20bfff6f0806e9900119f Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 19:25:23 +0100 Subject: [PATCH 46/57] fix(a11y): stop centering the Select All checkbox in its hit-box justify-content: center on .vscomp-toggle-all-button, added for the WCAG 2.5.8 min target size, centered the checkbox+label inside the full-width button instead of left-aligning it like the option rows below. Drop the centering; the min-height/min-width floor alone covers the target-size fix since align-items already centers vertically. --- src/sass/partials/virtual-select.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index 36536a4b..d23b8f32 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -449,8 +449,9 @@ /** * WCAG 2.5.8: the button previously collapsed to its 25x15 content box. * A min-* floor grows the hit area without scaling the checkbox glyph inside it. + * No justify-content override: the checkbox must stay left-aligned with the + * option checkboxes below it, not centered in the button's full width. */ - justify-content: center; min-height: v.$min-target-size; min-width: v.$min-target-size; } From 97c9590f4e6825cfce4e897bd051d387d4060933 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 20:12:29 +0100 Subject: [PATCH 47/57] fix(a11y): make the error and status announcements actually reach the user Four blockers from the branch code review. All four were reproduced against the built bundle before the fix and re-checked after; each new spec case was confirmed failing first. They fall into two root causes. --- the announcement was written and then thrown away --- CR-01: setValue() called validate() - which announces its message through the polite live region - and then announced the selection summary in the same tick. A polite region is read from its *final* content, so the summary silently replaced the validation message: the region said "No options selected" while aria-invalid was true and the visible message said "This field is required". That silenced every interactive path (the clear button, deselecting below minValues) while still showing the error on screen, which is precisely the 3.3.1 failure the region was added to fix. Only the direct validate() call was covered by a spec, and that path announces correctly, so it shipped green. The summary is now skipped when validation failed: the error is the more urgent message and it already implies the selection state. CR-02: reset(formReset = true), the handler for the form's own reset event, removed the has-error class but left aria-invalid="true" and aria-describedby pointing at an error element that still held its text. The control stayed announced as invalid, describing a message the user could no longer see, with no interaction able to clear it. toggleRequired(false) was updated for this; reset() was not. It now clears aria-invalid and the message too. --- escaped storage text was reused as human-readable text --- With enableSecureText on, option label and description are stored HTML-escaped because they are inserted as HTML. Two places consume that text as *text*, and both were reading the escape sequences out loud. CR-03: Utils.getAriaLabelText() strips markup with /<[^>]+>/gi, but the label arrives already escaped, so there is no `<` to match and the markup passed through verbatim. The same option produced "Group, France" with escaping off and "Group, France" with it on - so AI-14's fix was a no-op in exactly the mode this release promotes via setGlobalDefaults() and the OutSystems wrapper default. CR-04: announce() writes with textContent, so a single select announcing its chosen label put the escape sequence into the region: "Tom & Jerry selected". Both now go through Utils.getPlainText(): undo the escaping, then strip markup, then collapse whitespace. getAriaLabelText() is that plus attribute escaping, which now covers `&` as well as `"` so a bare ampersand in a label is a valid character reference rather than raw markup. Worth recording: decoding alone was not enough, and a regression guard caught it. Undoing the escaping turns "<i class=\"flag\">" into "" - one unreadable announcement swapped for another. Reducing to plain text is what makes it speech. The review's CR-04 described only the ampersand half. The XSS guard is unaffected: decoding happens on the way *out* to text sinks, not on the way in to innerHTML. Verified that the img/onerror payload is still inert, that the live region contains no elements, and that HTML labels still render. Verification: 7 assertions red before, 23 green after, plus a 22-assertion re-run of the AI-20/AI-22/AI-23 security work and a sweep over the 36 demo instances - 198 data-value round-trips and 34 announcements, none containing markup or escape sequences. tsc, eslint, stylelint and the 72 scripts/ci tests pass. One commit rather than four: the fixes were verified as two shared root causes in a single red-then-green cycle, and the history should match the verification behind it. --- cypress/e2e/a11y-aria-label.cy.ts | 33 ++++++++++++ cypress/e2e/a11y-live-region.cy.ts | 55 +++++++++++++++++++ cypress/e2e/a11y-required-error.cy.ts | 76 +++++++++++++++++++++++++++ src/utils/utils.js | 60 +++++++++++++++++---- src/virtual-select.js | 35 ++++++++++-- 5 files changed, 246 insertions(+), 13 deletions(-) diff --git a/cypress/e2e/a11y-aria-label.cy.ts b/cypress/e2e/a11y-aria-label.cy.ts index 58bc009c..a4f2c051 100644 --- a/cypress/e2e/a11y-aria-label.cy.ts +++ b/cypress/e2e/a11y-aria-label.cy.ts @@ -75,6 +75,39 @@ describe('A11y: accessible names are plain text', { testIsolation: true }, () => .and('not.contain', ']+>/gi` tag pattern finds no `<` to match: the markup passed straight through and the + * accessible name became the literal tag soup ` France`. Same option, same + * code path, opposite outcome depending on a security flag — so the fix was a no-op exactly + * where the escaping it depends on is enabled. + */ + [false, true].forEach((enableSecureText) => { + it(`strips markup regardless of enableSecureText (${enableSecureText})`, () => { + mount([{ label: 'Europe', options: [{ label: ' France', value: 'fr' }] }], { + enableSecureText, + }); + + option('fr') + .should('have.attr', 'aria-label') + .and('contain', 'France') + .and('not.contain', ' { + // The escaped storage form must not leak into the accessible name as `&`. + mount([{ label: 'Europe', options: [{ label: 'Tom & Jerry', value: 'tj' }] }], { + enableSecureText: true, + }); + + option('tj').should('have.attr', 'aria-label').and('contain', 'Tom & Jerry').and('not.contain', '&'); + }); + it('strips markup from the tag clear button name', () => { mount([{ label: ' France', value: 'fr' }], { multiple: true, diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts index 4ec76a66..bc53d74a 100644 --- a/cypress/e2e/a11y-live-region.cy.ts +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -119,6 +119,61 @@ describe('A11y: status announcements via a live region', () => { liveRegion().should('have.text', 'Option 3 selected'); }); + /** + * The announcement is read as text, so it must carry human-readable text. + * + * A single select announces the chosen label, and with `enableSecureText: true` the stored + * label is HTML-escaped by design (it is rendered as HTML elsewhere). Announcing it verbatim + * put the escape sequence into the region: `Tom & Jerry selected`, which a screen reader + * reads out as the entity rather than as "Tom and Jerry". The region is written with + * textContent, so the escaping buys nothing here and costs intelligibility. + */ + it('announces an ampersand in a label as an ampersand', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: 'Tom & Jerry', value: 'tj' }, + { label: 'Plain', value: 'p' }, + ], + enableSecureText: true, + }), + ); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="tj"]').click(); + + liveRegion().should('have.text', 'Tom & Jerry selected'); + }); + + /** + * Decoding alone is not enough, which is what this case pins. + * + * A label can carry markup as well as escaping. Undoing the escaping turns + * `<i class="flag"></i> France` into ` France` — still not + * speech, just a different kind of noise. The region is reduced to plain text, the same + * treatment accessible names get. + */ + it('announces a label containing markup as words, not as tags', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: ' France', value: 'fr' }, + { label: 'Plain', value: 'p' }, + ], + enableSecureText: true, + }), + ); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="fr"]').click(); + + liveRegion().should('have.text', 'France selected'); + }); + it('announces when the selection is cleared', () => { mount({ multiple: true }); diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts index 89e8fafd..eddd2cde 100644 --- a/cypress/e2e/a11y-required-error.cy.ts +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -148,4 +148,80 @@ describe('A11y: required and error state are exposed', () => { errorMessage().should('not.be.visible'); }); }); + + /** + * The message has to survive the interaction that produced it. + * + * setValue() validates and then announces the selection summary, both in the same tick. A + * polite live region is read from its *final* content, so the summary silently replaced the + * validation message: the region said "No options selected" while aria-invalid was true and + * the visible message said "This field is required". On every interactive path - the clear + * button, or deselecting below minValues - the error was therefore shown but never spoken, + * which is the 3.3.1 failure this work set out to fix. + * + * Only the direct validate() call was covered before, and that path announces correctly. + */ + context('the announcement survives the interaction', () => { + it('keeps the required message after the clear button empties the field', () => { + mount({ required: true }); + + cy.get(`#${mountId}`).then(($e) => $e[0].setValue?.(['o1'])); + cy.get(`#${mountId}`).find('.vscomp-clear-button').click(); + + wrapper().should('have.attr', 'aria-invalid', 'true'); + errorMessage().should('have.text', 'This field is required'); + liveRegion().should('have.text', 'This field is required'); + }); + + it('keeps the minValues message after deselecting below the minimum', () => { + mount({ multiple: true, required: true, minValues: 2 }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + wrapper().should('not.have.attr', 'aria-invalid'); + + // back under the minimum: the message appears, and must also be the thing announced + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o2"]').click(); + + wrapper().should('have.attr', 'aria-invalid', 'true'); + liveRegion().should('have.text', 'Select at least 2 options'); + }); + + it('still announces the selection summary when validation passes', () => { + mount({ required: true }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); + + wrapper().should('not.have.attr', 'aria-invalid'); + liveRegion().should('have.text', 'Option 1 selected'); + }); + }); + + /** + * A native form reset must clear the error state, not just its colour. + * + * reset(formReset = true) is the handler for the form's own reset event. It removed the + * `has-error` class but left aria-invalid="true" and aria-describedby pointing at an error + * element that still held its text - so the control stayed announced as invalid, describing a + * message the user could no longer see, with no way to clear it. toggleRequired(false) was + * updated for this; reset() was not. + */ + context('form reset clears the whole error state', () => { + it('drops aria-invalid, aria-describedby and the message text', () => { + mount({ required: true }); + + validate(); + wrapper().should('have.attr', 'aria-invalid', 'true'); + wrapper().should('have.attr', 'aria-describedby'); + + cy.get(`#${mountId}`).then(($e) => $e[0].reset?.(true)); + + wrapper().should('not.have.class', 'has-error'); + wrapper().should('not.have.attr', 'aria-invalid'); + wrapper().should('not.have.attr', 'aria-describedby'); + errorMessage().should('have.text', ''); + }); + }); }); diff --git a/src/utils/utils.js b/src/utils/utils.js index 3c187a1e..c2f3a453 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -301,25 +301,65 @@ export class Utils { } /** - * Turn a label into text that is safe and sensible inside an aria-label attribute. + * Undo the escaping secureText() applies, recovering the text a human should read. + * + * Option label and description are stored HTML-escaped when enableSecureText is on, because + * they are inserted as HTML. Anywhere that text is consumed as *text* instead - an accessible + * name, a live-region announcement - the escape sequences have to come back off, or the user + * is read `&` and `<i class=...`. * - * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that - * markup became tag soup in the accessible name, and a double quote in the label broke out - * of the attribute and truncated the name. Tags collapse to a single space so adjacent - * words do not run together (so "France
Paris" does not collapse into one word), then the - * remaining quotes are escaped. + * `&` is decoded last: doing it first would turn a literal `&lt;` into `<` and then + * into `<`, inventing markup the consumer never wrote. * * @static * @param {string} text - * @returns {string} + * @return {string} + * @memberof Utils */ - static getAriaLabelText(text) { - const plainText = Utils.getString(text) + static decodeSecureText(text) { + return Utils.getString(text) + .replace(/</g, '<') + .replace(/>/g, '>') + .replace(/&/g, '&'); + } + + /** + * Reduce label text to the words a human should hear or read. + * + * Labels may legitimately contain markup - an icon, , a
. Wherever that text is + * consumed as text (an accessible name, a live-region announcement) the markup is meaningless + * and is read out as tag soup. Tags collapse to a single space so adjacent words do not run + * together, so "France
Paris" does not become one word. + * + * The escaping is undone first. With enableSecureText on the label arrives already escaped, so + * the tag pattern found no `<` to match and the markup passed through verbatim - the strip was + * a no-op in exactly the mode escaping is enabled in. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static getPlainText(text) { + return Utils.decodeSecureText(text) .replace(/<[^>]+>/gi, ' ') .replace(/\s+/g, ' ') .trim(); + } - return Utils.replaceDoubleQuotesWithHTML(plainText); + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Plain text, then escaped for the attribute - covering `&` as well as `"`, so a bare + * ampersand in a label is a valid character reference rather than raw markup, and a double + * quote can no longer close the attribute early and truncate the name. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + return Utils.escapeAttributeValue(Utils.getPlainText(text)); } /** diff --git a/src/virtual-select.js b/src/virtual-select.js index 3596a873..e6e489e2 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -2022,16 +2022,26 @@ export class VirtualSelect { DomUtils.setAttr(this.$clearButton, 'tabindex', hasValue ? '0' : '-1'); DomUtils.setAria(this.$clearButton, 'hidden', hasValue === false); + let isValid = true; + if (!disableValidation) { - this.validate(); + isValid = this.validate(); } /** * Selection changes are otherwise conveyed only by the (visual) value text. * Guarded on isInitialized so a value supplied at construction time is not * announced before the user has interacted with anything. + * + * Skipped when validation just failed. validate() announces its message through the same + * polite region, and a polite region is read from its *final* content - so announcing the + * selection summary here overwrote the validation message in the same tick and the user + * never heard it. That silenced every interactive path (the clear button, deselecting below + * minValues) while still setting aria-invalid and showing the message on screen, which is + * the 3.3.1 failure this region exists to fix. The error is the more urgent of the two, and + * it already implies the selection state. */ - if (this.isInitialized) { + if (this.isInitialized && isValid) { this.announce(this.getSelectionMessage()); } @@ -3635,7 +3645,18 @@ export class VirtualSelect { this.afterValueSet(); if (formReset) { + /** + * A native form reset clears the error state, not just the colour that showed it. + * + * Removing `has-error` alone left aria-invalid="true" on the combobox and + * aria-describedby pointing at an error element that still held its text - so the control + * stayed announced as invalid, describing a message the user could no longer see, with no + * interaction able to clear it. setErrorMessage('') empties the text and drops + * aria-describedby, and does not announce (it only announces a non-empty message). + */ DomUtils.removeClass(this.$allWrappers, 'has-error'); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); } DomUtils.dispatchEvent(this.$ele, 'reset'); @@ -4059,7 +4080,15 @@ export class VirtualSelect { return; } - const text = message || ''; + /** + * Reduced to plain text because the region is written with textContent, so whatever is put + * there is read out literally. A single select announces the chosen label, and a label can + * carry both escaping and markup: with enableSecureText on the region said + * "Tom & Jerry selected", and decoding alone would only have turned that into + * " France selected". Neither is speech. Messages the component composes + * itself contain no markup, so this is a no-op for them. + */ + const text = Utils.getPlainText(message || ''); if (this.$liveRegion.textContent !== text) { this.$liveRegion.textContent = text; From 91088282ab49f8bc0042875a0d459cc3451daa65 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 23:13:46 +0100 Subject: [PATCH 48/57] fix(a11y): finish the entity decode, silence uninvited announcements, honour globals MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Three findings from the second code review. Each was reproduced against the built bundle first and each new spec case was confirmed failing before the fix. --- BL-01: decodeSecureText() missed the fourth entity --- secureText() escapes by assigning to a text node and reading innerHTML back, and that serialiser escapes FOUR characters, not three. Measured rather than assumed: & -> & < -> < > -> > U+00A0 ->   " ' ` = é — U+202F U+200B all pass through untouched decodeSecureText() inverted the first three, so with enableSecureText on a label containing a no-break space was named and announced as the literal `Item A` while rendering correctly on screen - the exact failure mode the previous commit fixed for the other three, surviving for the fourth. My miss: I derived that list by reasoning about the serialiser instead of measuring it. ` ` is decoded before `&`, which must stay last, or a literal `&nbsp;` would turn into a real no-break space. Note what the fix does and does not do. The entity no longer survives; the character itself is normalised to an ordinary space in names and announcements, because getPlainText() collapses whitespace and JavaScript's \s matches U+00A0. That is the right outcome for text that will be spoken, and the visible label still carries the real character - both are pinned by spec cases. --- BL-02: a validation error was announced for interactions nobody made --- setErrorMessage() announced unconditionally, so two paths spoke an error the user had not caused: - construction. The initial setValueMethod() runs before isInitialized is set, so { multiple, required, minValues: 2, selectedValue: ['o1'] } loaded already saying "Select at least 2 options". - a programmatic refresh. afterSetOptions() calls reset(), which validates, so replacing the options announced a failure for an untouched field. The announcement is now guarded on isInitialized and on a new isRefreshingOptions flag scoped to the reset() inside afterSetOptions(), released in a finally for the same reason isClosing is - a stuck flag would silently suppress every later error, which is harder to diagnose than an exception. The state itself is still exposed unconditionally: aria-invalid and the visible message appear as before. Only the announcement waits. The interactive paths the previous commit fixed - the clear button, dropping below minValues, and an explicit validate() from the application - must still announce, and three spec cases hold that line so a future widening of the guard cannot regress them. Attribution, so nobody mis-blames the previous commit: the construction path is pre-existing, since setErrorMessage() was never guarded and the selection summary was already skipped at init. What that commit changed was only *which* message the refresh path spoke. Both were wrong. --- WR-10: an explicit undefined defeated a page-level policy --- Object.assign copies own enumerable keys including ones whose value is undefined, so `enableSecureText: wrapper.sanitizeValues` with an unset wrapper property overwrote setGlobalDefaults({ enableSecureText: true }) instead of falling back to it. A host could enable escaping page-wide and still get it off at every such call site, with nothing to show it had been overridden - and that is exactly the shape the OutSystems wrapper produces. undefined-valued keys are now dropped before the merge, which also makes it agree with this method's own resolve() helper; the two disagreed inside one function. This changes undefined for every prop, not just enableSecureText: it now means "fall back" rather than "override with undefined". That is the intended reading, it matches resolve(), and it fixes cases like placeholder: undefined previously rendering the string "undefined". It belongs in the upgrade notes. Still open, deliberately: setGlobalDefaults({}) does not clear and a non-object silently wipes the policy (WR-10's other halves). Fixing those means deciding the intended reset semantics of a public API, which is a design call rather than a bug fix. It bit this work once - a stale global leaked between checks in a manual sweep and made an unrelated case look broken - so it is worth settling soon. Verification: 6 assertions red before, 21 green after; a 22-assertion re-run of the AI-20/AI-22/AI-23/AI-24 work; and a sweep over the 36 demo instances - 198 data-value round-trips, 34 announcements and 6 accessible names, none carrying markup or an escape sequence, with every instance silent on load. tsc, eslint, stylelint and the scripts/ci tests pass. --- cypress/e2e/a11y-aria-label.cy.ts | 27 ++++++++++ cypress/e2e/a11y-live-region.cy.ts | 29 +++++++++++ cypress/e2e/a11y-required-error.cy.ts | 53 ++++++++++++++++++++ cypress/e2e/security-global-defaults.cy.ts | 29 +++++++++++ src/utils/utils.js | 1 + src/virtual-select.js | 57 ++++++++++++++++++++-- 6 files changed, 193 insertions(+), 3 deletions(-) diff --git a/cypress/e2e/a11y-aria-label.cy.ts b/cypress/e2e/a11y-aria-label.cy.ts index a4f2c051..b8bdac2e 100644 --- a/cypress/e2e/a11y-aria-label.cy.ts +++ b/cypress/e2e/a11y-aria-label.cy.ts @@ -99,6 +99,33 @@ describe('A11y: accessible names are plain text', { testIsolation: true }, () => }); }); + it('names a label containing a no-break space without the entity', () => { + /** + * `secureText()` escapes exactly four characters, because that is what serialising a text node + * through `innerHTML` emits: `&`, `<`, `>` and U+00A0 (as ` `). The decoder undid the first + * three, so a no-break space survived into the accessible name as the literal ` `. + * + * The character is written as an escape on purpose — a raw NBSP is invisible in a diff and is + * easily "tidied" into an ordinary space, which would silently stop testing anything. + */ + mount([{ label: 'Europe', options: [{ label: 'Item\u00A0A', value: 'nb' }] }], { + enableSecureText: true, + }); + + // The entity must not survive. The character itself is normalised to an ordinary space, + // because getPlainText() collapses whitespace and JavaScript's `\s` matches U+00A0 - which + // is the right outcome for a name that will be spoken. + option('nb') + .should('have.attr', 'aria-label') + .and('contain', 'Item A') + .and('not.contain', ' '); + + // ...while the visible label keeps the real no-break space. + option('nb').find('.vscomp-option-text').should(($text) => { + expect($text.text()).to.contain('Item\u00A0A'); + }); + }); + it('announces an ampersand in a label as an ampersand', () => { // The escaped storage form must not leak into the accessible name as `&`. mount([{ label: 'Europe', options: [{ label: 'Tom & Jerry', value: 'tj' }] }], { diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts index bc53d74a..df509e57 100644 --- a/cypress/e2e/a11y-live-region.cy.ts +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -147,6 +147,35 @@ describe('A11y: status announcements via a live region', () => { liveRegion().should('have.text', 'Tom & Jerry selected'); }); + /** + * The fourth character the text-node serialiser escapes, and the one the decoder first missed. + * + * `secureText()` emits `&`, `<`, `>` and U+00A0 (as ` `) — four, not three — so a + * no-break space in a label was announced as the literal ` ` even after the entities + * above were handled. + */ + it('announces a label containing a no-break space without the entity', () => { + cy.viewport(1280, 800); + cy.visit('get-started'); + cy.window().then((win) => + mountVs(win, mountId, { + options: [ + { label: 'Item\u00A0A', value: 'nb' }, + { label: 'Plain', value: 'p' }, + ], + enableSecureText: true, + }), + ); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('.vscomp-option[data-value="nb"]').click(); + + // The entity must not survive; the character is normalised to a space by the whitespace + // collapse in getPlainText(), which is correct for speech. + liveRegion().should('not.contain', ' '); + liveRegion().should('have.text', 'Item A selected'); + }); + /** * Decoding alone is not enough, which is what this case pins. * diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts index eddd2cde..39ac563a 100644 --- a/cypress/e2e/a11y-required-error.cy.ts +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -199,6 +199,59 @@ describe('A11y: required and error state are exposed', () => { }); }); + /** + * The region must stay silent for anything the user did not do. + * + * `setErrorMessage()` announces unconditionally, and it is reached during construction — the + * initial `setValueMethod()` runs before `isInitialized` is set — and again whenever + * `setOptions()` replaces the data, because `afterSetOptions()` calls `reset()`, which validates. + * So a page could load already speaking a validation error, and a background data refresh could + * speak one for a field the user has never touched. A live region is for status *changes* the + * user caused; announcing on load is the noise the `isInitialized` guard elsewhere exists to + * avoid. + * + * The cases above must keep passing: the point is to silence construction and programmatic + * refreshes *without* silencing the interactive paths. + */ + context('nothing is announced for interactions the user did not make', () => { + it('stays silent when an invalid initial value is supplied', () => { + mount({ multiple: true, required: true, minValues: 2, selectedValue: ['o1'] }); + + // The state is still exposed visually and to AT - it is only the announcement that waits. + wrapper().should('have.attr', 'aria-invalid', 'true'); + errorMessage().should('have.text', 'Select at least 2 options'); + liveRegion().should('have.text', ''); + }); + + it('stays silent when setOptions() replaces the data', () => { + mount({ required: true }); + + liveRegion().should('have.text', ''); + + cy.get(`#${mountId}`).then(($e) => + $e[0].setOptions?.([ + { label: 'New 1', value: 'n1' }, + { label: 'New 2', value: 'n2' }, + ]), + ); + + cy.get(`#${mountId}`).find('.vscomp-option[data-value="n1"]').should('exist'); + liveRegion().should('have.text', ''); + }); + + it('still announces once the user interacts after a refresh', () => { + mount({ required: true }); + + cy.get(`#${mountId}`).then(($e) => $e[0].setOptions?.([{ label: 'New 1', value: 'n1' }])); + liveRegion().should('have.text', ''); + + // the suppression must be scoped to the refresh, not sticky + validate(); + + liveRegion().should('have.text', 'This field is required'); + }); + }); + /** * A native form reset must clear the error state, not just its colour. * diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts index 3807f196..b3e19507 100644 --- a/cypress/e2e/security-global-defaults.cy.ts +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -81,6 +81,35 @@ describe('Security: global defaults for enableSecureText', () => { }); }); + it('does not let an undefined prop defeat the global default', () => { + /** + * `Object.assign` copies own enumerable keys *including* those whose value is `undefined`, so a + * prop forwarded from an unset variable overwrote the global instead of falling back to it — the + * escaping policy was silently off while the host believed it had enabled it page-wide. + * + * This is the exact shape a wrapper uses: `enableSecureText: this.SanitizeDropdownValues`, where + * the wrapper property may be undefined. It also contradicts setDefaultProps()'s own `resolve()` + * helper, which already treats `undefined` as "not supplied". + */ + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + mountWithPayload(win, { enableSecureText: undefined }); + }); + + cy.get(`#${mountId}`).should(($ele) => { + expect($ele[0].virtualSelect.enableSecureText, 'the global must still win').to.equal(true); + }); + + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + cy.get(`#${mountId}`).find('img[src="x"]').should('not.exist'); + + cy.window().then((win) => { + // @ts-expect-error - test marker + expect(win.__vsGlobalXss, 'payload must not execute').to.not.eq(true); + }); + }); + it('lets an explicit per-instance option override the global default', () => { cy.window().then((win) => { // @ts-expect-error - bundle global diff --git a/src/utils/utils.js b/src/utils/utils.js index c2f3a453..485d4370 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -320,6 +320,7 @@ export class Utils { return Utils.getString(text) .replace(/</g, '<') .replace(/>/g, '>') + .replace(/ /g, '\u00A0') .replace(/&/g, '&'); } diff --git a/src/virtual-select.js b/src/virtual-select.js index e6e489e2..49e8e1ba 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -1211,7 +1211,20 @@ export class VirtualSelect { } if (!keepValue) { - this.reset(); + /** + * reset() validates, and validation announces - so replacing the options used to speak a + * validation failure for an interaction the user never made. Scoped to this one call rather + * than the whole method, and released in a finally: a stuck flag would silently suppress + * every later error announcement, which is far harder to diagnose than an exception (the + * lesson from the isClosing guard in closeDropbox()). + */ + this.isRefreshingOptions = true; + + try { + this.reset(); + } finally { + this.isRefreshingOptions = false; + } } } /** after event methods - end */ @@ -1453,7 +1466,31 @@ export class VirtualSelect { * Globals let a host turn a policy on once (notably enableSecureText) instead of * repeating it at every call site, while an instance can still opt out explicitly. */ - return Object.assign(defaultOptions, globalDefaults, options); + /** + * `undefined` means "not supplied", so those keys are dropped before merging. + * + * Object.assign copies own enumerable keys *including* ones whose value is undefined, so a prop + * forwarded from an unset variable - `enableSecureText: wrapper.sanitizeValues`, the shape a + * host wrapper naturally produces - overwrote the page-level global instead of falling back to + * it. A host could call setGlobalDefaults({ enableSecureText: true }) and still get escaping + * off at every such call site, with nothing to show it had been overridden. + * + * This also makes the merge agree with the resolve() helper above, which already treats + * undefined as absent; the two disagreed inside the same method. + */ + const supplied = (source) => { + const result = {}; + + Object.keys(source || {}).forEach((key) => { + if (source[key] !== undefined) { + result[key] = source[key]; + } + }); + + return result; + }; + + return Object.assign(defaultOptions, supplied(globalDefaults), supplied(options)); } setPropsFromElementAttr(options) { @@ -3924,7 +3961,21 @@ export class VirtualSelect { this.$errorMessage.textContent = text; DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); - if (text) { + /** + * The message is shown and exposed unconditionally, but only *announced* for something the + * user did. A live region is for status changes they caused. + * + * isInitialized keeps construction quiet: the initial setValueMethod() runs before that flag + * is set, so a page supplied with an invalid initial value used to load already speaking + * "Select at least 2 options". isRefreshingOptions keeps a programmatic data swap quiet: + * afterSetOptions() calls reset(), which validates, so replacing the options announced a + * failure for a field the user had never touched. + * + * Both are deliberately narrow. The interactive paths - the clear button, deselecting below + * minValues, and an explicit validate() from the application - must still announce, which is + * the whole point of routing validation through this region. + */ + if (text && this.isInitialized && !this.isRefreshingOptions) { this.announce(text); } } From 6762b0c4b5673b5176b266c3151fb9a88cffc93c Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 23:32:33 +0100 Subject: [PATCH 49/57] chore: re-pin build output to master, it was committed again MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `.github/README.md` requires that build files are not committed in a PR, only generated for a release. This branch had held that line deliberately - dist/, dist-archive/ and docs/assets/ pinned to master's content in every commit, so the diff is source and tests only - until 35540fc committed all eight of them again. That is not just tidiness. Those artefacts predate the two most recent source commits (97c9590 and 9108828), so the committed bundle no longer matched src/: anyone opening the docs demo, or trusting dist/, got pre-fix code. It cost real time here - a verification run against the stale bundle appeared to show the validation announcement being overwritten, which looked like a regression in 97c9590 and was not. Re-checked against a fresh build, one announcement per transition and the error wins whenever the field is invalid. So the rule is worth restating: after `npm run build`, `git status` will show these eight files modified. That is the correct state on a feature branch - do not commit them. Restore with `git checkout HEAD -- dist/ …` (not master, once this commit has landed they are the same). The release procedure in .github/README.md is what generates them, after the version bump. --- dist-archive/virtual-select-1.3.0.min.css | 2 +- dist-archive/virtual-select-1.3.0.min.js | 2 +- dist/virtual-select.js | 873 +++------------------- dist/virtual-select.min.css | 2 +- dist/virtual-select.min.js | 2 +- docs/assets/virtual-select.js | 873 +++------------------- docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- 8 files changed, 234 insertions(+), 1524 deletions(-) diff --git a/dist-archive/virtual-select-1.3.0.min.css b/dist-archive/virtual-select-1.3.0.min.css index 7257fcff..29fc53eb 100644 --- a/dist-archive/virtual-select-1.3.0.min.css +++ b/dist-archive/virtual-select-1.3.0.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist-archive/virtual-select-1.3.0.min.js b/dist-archive/virtual-select-1.3.0.min.js index c4ec13c2..5ab3dec1 100644 --- a/dist-archive/virtual-select-1.3.0.min.js +++ b/dist-archive/virtual-select-1.3.0.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); diff --git a/dist/virtual-select.js b/dist/virtual-select.js index 031c6bac..42bceeac 100644 --- a/dist/virtual-select.js +++ b/dist/virtual-select.js @@ -198,77 +198,17 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - /** - * Called once per selected tag to decide whether that tag needs a tooltip. - * - * It used to create a div, read two separate getComputedStyle results, append it to - * , read clientWidth and remove it again - so every tag paid an element creation - * plus two DOM mutations, and each mutation invalidates layout for the read that - * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. - * - * One reusable off-screen node instead, and one getComputedStyle read for every property. - * The node stays out of flow and is aria-hidden, so it cannot affect layout or be - * announced, and it is removed once the last instance is destroyed. - */ - const $measurer = Utils.getTextMeasurer(); - const { - fontSize, - fontFamily, - fontWeight, - letterSpacing - } = window.getComputedStyle(container); - $measurer.style.fontSize = fontSize; - $measurer.style.fontFamily = fontFamily; - /** weight and tracking change advance width too, so ignoring them under-reported - * overflow and could drop a tooltip that was actually needed */ - $measurer.style.fontWeight = fontWeight; - $measurer.style.letterSpacing = letterSpacing; - $measurer.textContent = text; - return $measurer.clientWidth > container.clientWidth; - } - - /** - * Whether the user has asked the operating system to reduce motion. - * - * Read on each call rather than cached, so a preference changed after page load is picked up - * by the next instance. Guarded for environments without matchMedia. - * - * @static - * @returns {boolean} - */ - static prefersReducedMotion() { - return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; - } - - /** - * The shared, lazily created off-screen node used to measure text width. - * - * @static - * @returns {HTMLElement} - */ - static getTextMeasurer() { - if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { - const $measurer = document.createElement('div'); - $measurer.className = 'vscomp-text-measurer'; - $measurer.setAttribute('aria-hidden', 'true'); - $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; - document.body.appendChild($measurer); - Utils.$textMeasurer = $measurer; - } - return Utils.$textMeasurer; - } - - /** - * Drop the shared measuring node, so nothing of ours is left in the document once the last - * instance has gone. - * - * @static - */ - static removeTextMeasurer() { - if (Utils.$textMeasurer) { - Utils.$textMeasurer.remove(); - Utils.$textMeasurer = null; - } + const tempElement = document.createElement('div'); + tempElement.style.position = 'absolute'; + tempElement.style.visibility = 'hidden'; + tempElement.style.whiteSpace = 'nowrap'; + tempElement.style.fontSize = window.getComputedStyle(container).fontSize; + tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; + tempElement.textContent = text; + document.body.appendChild(tempElement); + const textWidth = tempElement.clientWidth; + document.body.removeChild(tempElement); + return textWidth > container.clientWidth; } /** @@ -281,45 +221,6 @@ class Utils { return text.replace(/"/g, '"'); } - /** - * Escape a *raw* string for interpolation into a double-quoted HTML attribute. - * - * Use this only where the input has not already been HTML-escaped - currently the option - * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped - * first, otherwise the `&` introduced by the quote replacement would itself be escaped and - * the attribute would parse back as a literal `"`. - * - * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped - * label text: escaping `&` there would double it and a tooltip would show `&`. That - * asymmetry is the reason this is a separate helper rather than a shared one. - * - * @static - * @param {string} text - * @return {string} - * @memberof Utils - */ - static escapeAttributeValue(text) { - return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); - } - - /** - * Turn a label into text that is safe and sensible inside an aria-label attribute. - * - * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that - * markup became tag soup in the accessible name, and a double quote in the label broke out - * of the attribute and truncated the name. Tags collapse to a single space so adjacent - * words do not run together (so "France
Paris" does not collapse into one word), then the - * remaining quotes are escaped. - * - * @static - * @param {string} text - * @returns {string} - */ - static getAriaLabelText(text) { - const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); - return Utils.replaceDoubleQuotesWithHTML(plainText); - } - /** * @static * @param {string} text @@ -428,13 +329,6 @@ class Utils { return throttled; } } - -/** - * Shared off-screen node used to measure text width, created on first use and removed when - * the last VirtualSelect instance is destroyed. - * @type {HTMLElement | null} - */ -Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -558,42 +452,6 @@ class DomUtils { $ele.setAttribute(name, value); } - /** - * @param {HTMLElement} $ele - * @param {string} name - */ - static removeAttr($ele, name) { - if (!$ele) { - return; - } - $ele.removeAttribute(name); - } - - /** - * Set an aria-* attribute when the state applies, remove it otherwise. - * - * Preferred over writing `aria-x="false"` for states whose absence is meaningful - * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some - * screen readers still verbalise. - * - * @param {HTMLElement | NodeListOf} $ele - * @param {string} name - * @param {boolean} isSet - * @param {string} [value='true'] - */ - static toggleAria($ele, name, isSet, value = 'true') { - if (!$ele) { - return; - } - DomUtils.getElements($ele).forEach($this => { - if (isSet) { - $this.setAttribute(`aria-${name}`, value); - } else { - $this.removeAttribute(`aria-${name}`); - } - }); - } - /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -742,21 +600,7 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - /** - * Quotes are escaped here, at the attribute boundary, because this is the only place - * that knows the value is about to be wrapped in double quotes. - * - * The caller that matters is getTooltipAttrText(), which passes option labels through - * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) - * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and - * put a live attribute on the value-tag element. Escaping unconditionally here removes - * the condition, and the parser turns " back into a quote, so the attribute still - * reads back as the original string. - * - * String(), not Utils.getString(): the latter maps `false` to '', and some of these - * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). - */ - html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; + html += ` ${k}="${v}" `; } }); return html; @@ -807,9 +651,6 @@ class DomUtils { }); } } -;// ./src/utils/index.js - - ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -831,7 +672,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -867,20 +708,9 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - /** - * These props are developer-supplied but still reach an attribute directly, and none of them - * passes through secureText() - so enableSecureText never protected them. A double quote - * closed the attribute early: the payload after it was parsed as markup, and the accessible - * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. - * - * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to - * option and group labels: strip markup, then escape quotes. Plain quote escaping for - * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide - * a caller error instead of fixing it. - */ - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -921,7 +751,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -933,11 +763,6 @@ class VirtualSelect {
-
- -
- ${this.renderDropbox({ wrapperClasses })} @@ -957,25 +782,6 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); - - /** - * The submitting field's name is set as a DOM property, not interpolated into the template. - * - * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so - * the remainder of the value was parsed as markup (real elements, an injection) while the - * field kept only the truncated prefix - or, when the payload also swallowed the following - * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw - * inside the constructor. Either way the form silently stopped submitting the right name, - * and that included legitimate names such as `items["a"]`. - * - * A property assignment performs no HTML parsing, so there is nothing to break out of and - * nothing to escape - which is also why `name` no longer goes through secureText(): the - * escaping only ever protected this sink, and applying it here corrupted the submitted - * field name into `items["a"]`. - */ - this.$hiddenInput.name = this.name; - this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); - this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1005,9 +811,7 @@ class VirtualSelect {
-
+
@@ -1040,16 +844,8 @@ class VirtualSelect { return html; } renderOptions() { - /** - * The ARIA scan walks every option, so running it per render made scrolling O(n) per - * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the - * filtered set or its order changes, never when the virtualisation window moves, so - * recompute on a dirty flag instead. Everything that alters the set marks it dirty. - */ - if (this.ariaMetadataDirty) { - this.calculateAriaMetadata(); - this.ariaMetadataDirty = false; - } + // Calculate ARIA metadata before rendering to ensure it's always up to date + this.calculateAriaMetadata(); let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -1112,14 +908,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - /** carried into every child's aria-label below, so strip markup once here */ - groupName = Utils.getAriaLabelText(d.label); + groupName = d.label; optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const selectAllText = Utils.getAriaLabelText(this.selectAllText); - ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; + const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); + const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); + ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; } } if (isSelected) { @@ -1136,13 +932,13 @@ class VirtualSelect { * 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 = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); - const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); + 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}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; + ariaLabel = `aria-label="${groupName}, ${d.label}"`; } } if (hasLabelRenderer) { @@ -1168,23 +964,8 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } - - /** - * The option value is an untrusted string going straight into an attribute, so a double - * quote in it closed data-value early and everything after it was parsed as markup - a - * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, - * whether or not enableSecureText was on. - * - * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches - * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). - * Both together keep the attribute round-tripping: the parser turns `&` and `"` - * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on - * every render anyway. - */ - const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -1207,40 +988,20 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - /** - * role="checkbox" + aria-checked so the control is announced as a checkbox and its - * state changes are audible. Without them it exposed as a generic element and every - * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). - * aria-checked is kept in sync by toggleAllOptionsClass(). - */ - /** - * selectAllText has two sinks, and only the attribute one is escaped. - * - * The visible label below is rendered as HTML and that works today - `Pick all` - * produces a real - so escaping it would be a visible regression for anyone styling - * the Select All label. The accessible name, by contrast, was raw: a quote broke out of - * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same - * treatment the group-header aria-label a few methods up already applies to this exact - * prop, which is why that sink was safe while this one was not. - */ - checkboxHtml = ` + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1371,29 +1132,14 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - - /** - * Space is the expected activation key for role="checkbox"; Enter is kept for - * backwards compatibility. preventDefault stops Space from scrolling the page - * (the previous behaviour, since the key was unhandled here). - */ - if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { - e.preventDefault(); + if (document.activeElement === this.$toggleAllButton && key === 13) { this.toggleAllOptions(); return; } - /** - * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). - * The element that contains the focused node differs by layout: with an external - * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be - * tested against $dropboxWrapper. In every other case - including the default - * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting - * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the - * default config, so the branch never ran and Escape did nothing. - */ + // Handle the Escape key when showing the dropdown as a popup, closing it if (key === 27 || e.key === 'Escape') { - const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; + const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1411,34 +1157,33 @@ class VirtualSelect { this.openDropbox(); } } - - /** - * Move the highlight without moving DOM focus. - * - * Previously both arrow handlers bailed out whenever the search input had focus, to let - * the caret move. But opening the dropdown focuses the search input, so in the default - * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). - * The APG editable-combobox pattern is what applies here: Up/Down drive the list while - * focus stays in the field, and the active option is published as aria-activedescendant. - * - * @param {KeyboardEvent} e - * @param {'next' | 'previous'} direction - */ - navigateOptions(e, direction) { + onDownArrowPress(e) { + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction + direction: 'next' }); } else { this.openDropbox(); } } - onDownArrowPress(e) { - this.navigateOptions(e, 'next'); - } onUpArrowPress(e) { - this.navigateOptions(e, 'previous'); + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } + e.preventDefault(); + if (this.isOpened()) { + this.focusOption({ + direction: 'previous' + }); + } else { + this.openDropbox(); + } } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1475,24 +1220,8 @@ class VirtualSelect { this.reset(); } } - - /** - * Scroll fires many times per drag and each event triggered a full re-render - * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for - * the whole gesture. Coalesce into at most one re-render per animation frame; the pending - * frame is cancelled in destroy() so it cannot run against a torn-down instance. - */ onOptionsScroll() { - if (this.scrollAnimationFrame) { - return; - } - this.scrollAnimationFrame = requestAnimationFrame(() => { - this.scrollAnimationFrame = null; - if (this.isDestroyed) { - return; - } - this.setVisibleOptions(true); - }); + this.setVisibleOptions(true); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1659,8 +1388,6 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); - /** the shared text measurer is the last page-level node we own */ - Utils.removeTextMeasurer(); } } @@ -1726,12 +1453,6 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } - - /** - * Marks the end of construction. Live-region announcements are suppressed until - * here so an initial value or the first render does not speak on page load. - */ - this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1790,16 +1511,9 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - - /** a closing dropbox must not take a highlight back - see closeDropbox() */ - if (!this.isClosing) { - this.focusOption({ - focusFirst: true - }); - } - if (!this.hasServerSearch) { - this.announceSearchResults(); - } + this.focusOption({ + focusFirst: true + }); } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1885,14 +1599,6 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; - /** live-region announcement texts (see announce/getResultsCountMessage) */ - this.searchResultsText = options.searchResultsText; - this.searchResultText = options.searchResultText; - this.noOptionsSelectedText = options.noOptionsSelectedText; - this.selectedText = options.selectedText; - this.loadingText = options.loadingText; - this.requiredErrorText = options.requiredErrorText; - this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1907,8 +1613,7 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ - this.name = options.name; + this.name = this.secureText(options.name); this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1930,16 +1635,6 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); - /** - * The open/close animation is driven from JS as well as CSS, so the stylesheet's - * prefers-reduced-motion rule alone would still leave the popover animating for - * showDuration/hideDuration milliseconds. Honour the preference here too. - */ - if (Utils.prefersReducedMotion()) { - this.showDuration = 0; - this.hideDuration = 0; - } - /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -1968,25 +1663,13 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property - this.isClosing = false; this.ariaSetSize = 0; - this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { - const globalDefaults = VirtualSelect.globalDefaults; - - /** - * Resolve a prop across the precedence chain for the few defaults that are derived - * from another prop, so a page-level default still drives them. - * @param {string} key - */ - const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; - const keepAlwaysOpen = resolve('keepAlwaysOpen'); - const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -2010,19 +1693,10 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', - /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ - searchResultsText: 'results available', - searchResultText: 'result available', - noOptionsSelectedText: 'No options selected', - selectedText: 'selected', - loadingText: 'Loading results', - /** validation messages; {count} in minValuesErrorText is replaced with minValues */ - requiredErrorText: 'This field is required', - minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: keepAlwaysOpen ? 1 : 2, + zIndex: options.keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -2044,17 +1718,11 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (hasOptionDescription) { + if (options.hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - - /** - * Precedence: per-instance options > page-level globals > built-in defaults. - * Globals let a host turn a policy on once (notably enableSecureText) instead of - * repeating it at every call site, while an instance can still opt out explicitly. - */ - return Object.assign(defaultOptions, globalDefaults, options); + return Object.assign(defaultOptions, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -2078,8 +1746,6 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; - /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -2108,23 +1774,8 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - /** - * Option values are untrusted strings used as keys, so every value-keyed lookup in this - * file is built with Object.create(null) rather than `{}`. - * - * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object - * calls the inherited setter, which ignores a non-object value, so nothing is written and - * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns - * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups - * all compare against `true`. An option whose value is `__proto__` was therefore - * selectable by click (that path reads data-value, not a mapping) but invisible to - * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read - * back could not be restored - and under allowNewOption it was mistaken for an unknown - * value and duplicated. A null prototype has no inherited members, so an arbitrary string - * key behaves like any other. - */ - const valuesMapping = Object.create(null); - const valuesOrder = Object.create(null); + const valuesMapping = {}; + const valuesOrder = {}; let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -2187,7 +1838,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = Object.create(null); + const valuesMapping = {}; preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2248,7 +1899,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -2282,7 +1933,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = Object.create(null); + const enabledOptionsMapping = {}; enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -2317,7 +1968,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -2330,25 +1981,8 @@ class VirtualSelect { [labelKey]: d }; } - - /** - * `value` is stored verbatim; only `label` and `description` are escaped. - * - * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` - * attribute (escaped there, at the boundary) and is otherwise only compared or used as a - * map key. Escaping it stored an identity the caller could not name - `a&b` became - * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set - * again. - * - * The normalised search keys derive from the *raw* text for the same reason: they are - * matched against what the user types into the search box, which is never HTML-escaped. - * Deriving them from the escaped text meant no query could match text containing `&`, - * `<` or `>`. - */ - const rawValue = getString(d[valueKey]); - const rawLabel = getString(d[labelKey]); - const value = rawValue; - const label = secureText(rawLabel); + const value = secureText(getString(d[valueKey])); + const label = secureText(getString(d[labelKey])); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -2356,7 +1990,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2374,10 +2008,9 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const rawDescription = getString(d[descriptionKey]); - option.description = secureText(rawDescription); - /** normalised from the raw text, so a query containing `&` can match - see above */ - option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); + const description = secureText(getString(d[descriptionKey])); + option.description = description; + option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2423,7 +2056,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = Object.create(null); + const newOptionsValueMapping = {}; optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2457,18 +2090,11 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); - - /** replace the "loading" message with the outcome of the fetch */ - if (this.isInitialized) { - this.announce(this.getResultsCountMessage()); - } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { - /** order drives aria-posinset */ - this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2555,15 +2181,6 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } - - /** - * Selection changes are otherwise conveyed only by the (visual) value text. - * Guarded on isInitialized so a value supplied at construction time is not - * announced before the user has interacted with anything. - */ - if (this.isInitialized) { - this.announce(this.getSelectionMessage()); - } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2610,13 +2227,11 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - /** markup in the label would otherwise land in the accessible name; a double - * quote in it would break out of the attribute entirely */ + // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = Utils.getAriaLabelText(label); - const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; + const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2762,14 +2377,6 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; - /** - * Number of options matching the current filter. Kept separately because - * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered - * virtualisation window, which is not what a "N results available" message means. - */ - this.filteredOptionsCount = visibleOptionsCount; - /** isVisible changed for the whole set, so positions and setsize must be recomputed */ - this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2858,15 +2465,10 @@ class VirtualSelect { if (!value) { return; } - - /** adds a row to the filtered set */ - this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - - /** value verbatim, label escaped - the label is the only one rendered as HTML */ - this.setOptionProp(newIndex, 'value', value); + this.setOptionProp(newIndex, 'value', this.secureText(value)); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2883,7 +2485,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2899,7 +2501,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = Object.create(null); + const availableValuesMapping = {}; this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -2994,7 +2596,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = Object.create(null); + const valuesMapping = {}; let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -3069,11 +2671,9 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - /** quotes are escaped unconditionally by getAttributesText(); escaping again here would - * leave a literal " in the tooltip, and the old containsHTML() condition is what - * let a tag-free payload through in the first place */ + const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; const data = { - 'data-tooltip': text || '', + 'data-tooltip': tootltipText || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -3097,18 +2697,17 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - /** value stored verbatim, search keys derived from the raw text - see setOptions() */ - const rawValue = getString(data.value); - const rawLabel = getString(data.label); - const rawDescription = getString(data.description); + const value = secureText(getString(data.value)); + const label = secureText(getString(data.label)); + const description = secureText(getString(data.description)); return { index: data.index, - value: rawValue, - valueNormalized: rawValue.toLowerCase(), - label: secureText(rawLabel), - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), - description: secureText(rawDescription), - descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), + value, + valueNormalized: value.toLowerCase(), + label, + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + description, + descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -3134,7 +2733,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -3192,7 +2791,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = Object.create(null); + const valuesOrder = {}; selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -3206,7 +2805,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = Object.create(null); + const disabledOptionsValueMapping = {}; const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -3344,8 +2943,6 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); - /** the search input is its own combobox over the listbox, so it needs the state too */ - DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3405,22 +3002,9 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$searchInput, 'expanded', false); - /** - * No option is active once the list is gone - and the highlight has to go with it, - * here, synchronously. - * - * afterHidePopper() already calls removeOptionFocus(), but for popover-backed - * instances it only runs when the hide transition ends (~200ms later). Until then the - * previous highlight and `focusedOptionIndex` survived the close, so reopening within - * that window resumed navigation from the old position instead of the first option: - * the next Up/Down moved one step past where the user expected, which on a grouped - * multi-select meant Enter landed on the first child option instead of toggling the - * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving - * the afterHidePopper() call in place costs nothing and still covers the silent path. - */ - this.removeOptionFocus(); - this.setActiveDescendant(''); + DomUtils.setAria(this.$wrapper, 'activedescendant', ''); + // Also clear aria-activedescendant on the listbox container + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3433,26 +3017,7 @@ class VirtualSelect { } else { this.afterHidePopper(); } - - /** - * Clearing the filter runs afterSetSearchValue(), which highlights the first visible - * option again. That undid the removeOptionFocus() above whenever the user had typed - * something: the highlight and aria-activedescendant came straight back on a combobox - * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option - * that is about to be display:none - so the keyboard position ended up on . - * - * isClosing is scoped to this one call rather than the whole method because everything - * above it (the wrapper refocus in particular) still needs the real state. The reset runs - * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the - * highlight coming back after *every* later filter clear, which is far harder to diagnose - * than the exception itself. - */ - this.isClosing = true; - try { - this.setSearchValue(''); - } finally { - this.isClosing = false; - } + this.setSearchValue(''); } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3807,14 +3372,7 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - const isChecked = isAllSelected || isAllVisibleSelected; - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); - /** - * Mirror the visual checked state onto the role="checkbox" host. This is the single - * point every selection path funnels through (select all, deselect all, per-option - * clicks, group toggles, setValue, reset), so the exposed state cannot drift. - */ - DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3862,7 +3420,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = Object.create(null); + const valuesMapping = {}; const { removeItemFromArray } = Utils; @@ -3907,15 +3465,7 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - /** - * Explicitly against null, not truthiness. focusedOptionIndex comes from - * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a - * truthiness test happens to pass for the first option. Normalise it to a number anywhere - * and index 0 would stop being cleared, so its `isFocused` prop would survive - and - * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the - * stale highlight back through the data path on the next render. - */ - if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { + if (this.focusedOptionIndex) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -3974,8 +3524,6 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { - /** removes a row from the filtered set */ - this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -4095,9 +3643,6 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); - - /** the spinner is a visual-only cue; announce that a fetch is in flight */ - this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -4132,52 +3677,18 @@ class VirtualSelect { return true; } let hasError = false; - let errorText = ''; const { selectedValues, minValues } = this; - if (this.required) { - if (Utils.isEmpty(selectedValues)) { - hasError = true; - errorText = this.requiredErrorText; - } else if (this.multiple && minValues && selectedValues.length < minValues) { - /** required minium options not selected */ - hasError = true; - errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); - } + if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ + this.multiple && minValues && selectedValues.length < minValues))) { + hasError = true; } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); - - /** - * Previously the only signal was the `has-error` class recolouring the toggle button - * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. - * Expose the state (aria-invalid), give it a text message, point the combobox at that - * message (aria-describedby) and announce it. - */ - DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); - this.setErrorMessage(hasError ? errorText : ''); return !hasError; } - /** - * Show or clear the validation message and its association with the combobox. - * An empty message removes aria-describedby rather than pointing at empty text. - * - * @param {string} message - */ - setErrorMessage(message) { - if (!this.$errorMessage) { - return; - } - const text = message || ''; - this.$errorMessage.textContent = text; - DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); - if (text) { - this.announce(text); - } - } - /** * 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). @@ -4228,12 +3739,6 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); - // Drop any queued scroll re-render so it cannot touch detached DOM - if (this.scrollAnimationFrame) { - cancelAnimationFrame(this.scrollAnimationFrame); - this.scrollAnimationFrame = null; - } - /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -4262,20 +3767,8 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - - /** - * escape potentially harmful markup so label/value/description cannot trigger XSS. - * - * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML - * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as - * `The &quot;City&quot; of Light`, shown to the user as `The "City" of - * Light`, and made unsearchable, because labelNormalized derives from the stored text. - * Quotes only need escaping inside an attribute, and that now happens at each attribute - * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also - * covers the sinks this pre-escaping never reached, such as an attribute written while - * enableSecureText is off. - */ - this.$secureText.nodeValue = text; + /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ + this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); return this.$secureDiv.innerHTML; } @@ -4296,78 +3789,9 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } - - /** - * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). - * - * Identical consecutive messages are intentionally left alone: re-writing the same text - * produces no DOM mutation, so assistive technology does not repeat "No results found" - * on every further keystroke that still matches nothing. - * - * @param {string} message - */ - announce(message) { - if (!this.$liveRegion) { - return; - } - const text = message || ''; - if (this.$liveRegion.textContent !== text) { - this.$liveRegion.textContent = text; - } - } - - /** - * Message describing how many options the current filter matched. - * @returns {string} - */ - getResultsCountMessage() { - const count = this.filteredOptionsCount || 0; - if (count === 0) { - return this.noSearchResultsText; - } - return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; - } - - /** - * Message describing the current selection. - * @returns {string} - */ - getSelectionMessage() { - const count = this.selectedValues.length; - if (count === 0) { - return this.noOptionsSelectedText; - } - if (this.multiple) { - return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; - } - - /** option flags are updated before setValue(), so the label is already current */ - const label = this.getDisplayValue() || this.selectedValues[0]; - return `${label} ${this.selectedText}`; - } - - /** - * Announce the match count, but only while the user is actually searching. - * setSearchValue('') also runs on close and after a value is set; announcing there - * would read a stale count into the user's ear for an interaction they did not make. - */ - announceSearchResults() { - if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { - return; - } - this.announce(this.getResultsCountMessage()); - } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); - - /** dropping the requirement also drops any error it produced */ - if (!this.required) { - DomUtils.toggleClass(this.$allWrappers, 'has-error', false); - DomUtils.toggleAria(this.$allWrappers, 'invalid', false); - this.setErrorMessage(''); - } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -4383,83 +3807,17 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - - /** - * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it - * had just un-highlighted, which is either pointless (focusOption immediately focuses the - * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is - * about to be hidden, fighting the wrapper refocus in closeDropbox(). - */ - if (isFocused && document.activeElement !== this.$searchInput) { + if (document.activeElement !== this.$searchInput) { $ele.focus(); } - - /** - * Publish the highlight on the elements that can carry it: the wrapper and the search - * input, both role="combobox". It used to also go on $dropboxContainer, a plain div - * with no role, where aria-activedescendant is meaningless - and never on the search - * input, which is the element that actually holds focus while navigating. - */ - this.setActiveDescendant(isFocused ? $ele.id : ''); - } - - /** - * Point the combobox elements at the active option, or clear the reference. - * @param {string} optionId - */ - setActiveDescendant(optionId) { - DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); - DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); - } - - /** static methods - start */ - - /** - * Set page-level default props applied to every instance created afterwards. - * - * The motivating case is security: option text is interpolated into innerHTML and is only - * escaped when `enableSecureText` is on, which it is not by default (escaping costs per - * option, and large trusted lists should not pay for it). A host that does render - * untrusted option text can turn escaping on once here rather than at every call site: - * - * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - * - * These are defaults, not overrides: an instance passing the prop explicitly still wins, - * so a host forwarding `enableSecureText` on every init must stop doing so (or forward - * `true`) for this to take effect. Calls merge, so features can be configured separately. - * Only instances created after the call are affected. - * - * @param {Partial} props - */ - static setGlobalDefaults(props) { - if (!props || typeof props !== 'object') { - VirtualSelect.globalDefaults = {}; - return; + if (isFocused) { + DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); + // Also set aria-activedescendant on the listbox container for better screen reader support + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); } - - /** `ele` and `options` are per-instance by nature and would alias state across instances */ - const safeProps = { - ...props - }; - delete safeProps.ele; - delete safeProps.options; - VirtualSelect.globalDefaults = { - ...VirtualSelect.globalDefaults, - ...safeProps - }; } - /** - * Currently active page-level defaults. - * A copy, so callers cannot mutate the live object. - * - * @returns {Partial} - */ - static getGlobalDefaults() { - return { - ...VirtualSelect.globalDefaults - }; - } + /** static methods - start */ static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4690,9 +4048,6 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; -// Page-level default props, applied under per-instance options (see setGlobalDefaults) -VirtualSelect.globalDefaults = {}; - /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/dist/virtual-select.min.css b/dist/virtual-select.min.css index 7257fcff..29fc53eb 100644 --- a/dist/virtual-select.min.css +++ b/dist/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/dist/virtual-select.min.js b/dist/virtual-select.min.js index c4ec13c2..5ab3dec1 100644 --- a/dist/virtual-select.min.js +++ b/dist/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); diff --git a/docs/assets/virtual-select.js b/docs/assets/virtual-select.js index 031c6bac..42bceeac 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -198,77 +198,17 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - /** - * Called once per selected tag to decide whether that tag needs a tooltip. - * - * It used to create a div, read two separate getComputedStyle results, append it to - * , read clientWidth and remove it again - so every tag paid an element creation - * plus two DOM mutations, and each mutation invalidates layout for the read that - * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. - * - * One reusable off-screen node instead, and one getComputedStyle read for every property. - * The node stays out of flow and is aria-hidden, so it cannot affect layout or be - * announced, and it is removed once the last instance is destroyed. - */ - const $measurer = Utils.getTextMeasurer(); - const { - fontSize, - fontFamily, - fontWeight, - letterSpacing - } = window.getComputedStyle(container); - $measurer.style.fontSize = fontSize; - $measurer.style.fontFamily = fontFamily; - /** weight and tracking change advance width too, so ignoring them under-reported - * overflow and could drop a tooltip that was actually needed */ - $measurer.style.fontWeight = fontWeight; - $measurer.style.letterSpacing = letterSpacing; - $measurer.textContent = text; - return $measurer.clientWidth > container.clientWidth; - } - - /** - * Whether the user has asked the operating system to reduce motion. - * - * Read on each call rather than cached, so a preference changed after page load is picked up - * by the next instance. Guarded for environments without matchMedia. - * - * @static - * @returns {boolean} - */ - static prefersReducedMotion() { - return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; - } - - /** - * The shared, lazily created off-screen node used to measure text width. - * - * @static - * @returns {HTMLElement} - */ - static getTextMeasurer() { - if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { - const $measurer = document.createElement('div'); - $measurer.className = 'vscomp-text-measurer'; - $measurer.setAttribute('aria-hidden', 'true'); - $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; - document.body.appendChild($measurer); - Utils.$textMeasurer = $measurer; - } - return Utils.$textMeasurer; - } - - /** - * Drop the shared measuring node, so nothing of ours is left in the document once the last - * instance has gone. - * - * @static - */ - static removeTextMeasurer() { - if (Utils.$textMeasurer) { - Utils.$textMeasurer.remove(); - Utils.$textMeasurer = null; - } + const tempElement = document.createElement('div'); + tempElement.style.position = 'absolute'; + tempElement.style.visibility = 'hidden'; + tempElement.style.whiteSpace = 'nowrap'; + tempElement.style.fontSize = window.getComputedStyle(container).fontSize; + tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; + tempElement.textContent = text; + document.body.appendChild(tempElement); + const textWidth = tempElement.clientWidth; + document.body.removeChild(tempElement); + return textWidth > container.clientWidth; } /** @@ -281,45 +221,6 @@ class Utils { return text.replace(/"/g, '"'); } - /** - * Escape a *raw* string for interpolation into a double-quoted HTML attribute. - * - * Use this only where the input has not already been HTML-escaped - currently the option - * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped - * first, otherwise the `&` introduced by the quote replacement would itself be escaped and - * the attribute would parse back as a literal `"`. - * - * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped - * label text: escaping `&` there would double it and a tooltip would show `&`. That - * asymmetry is the reason this is a separate helper rather than a shared one. - * - * @static - * @param {string} text - * @return {string} - * @memberof Utils - */ - static escapeAttributeValue(text) { - return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); - } - - /** - * Turn a label into text that is safe and sensible inside an aria-label attribute. - * - * Labels may legitimately contain markup - an icon, , a
. Interpolated raw, that - * markup became tag soup in the accessible name, and a double quote in the label broke out - * of the attribute and truncated the name. Tags collapse to a single space so adjacent - * words do not run together (so "France
Paris" does not collapse into one word), then the - * remaining quotes are escaped. - * - * @static - * @param {string} text - * @returns {string} - */ - static getAriaLabelText(text) { - const plainText = Utils.getString(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); - return Utils.replaceDoubleQuotesWithHTML(plainText); - } - /** * @static * @param {string} text @@ -428,13 +329,6 @@ class Utils { return throttled; } } - -/** - * Shared off-screen node used to measure text width, created on first use and removed when - * the last VirtualSelect instance is destroyed. - * @type {HTMLElement | null} - */ -Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -558,42 +452,6 @@ class DomUtils { $ele.setAttribute(name, value); } - /** - * @param {HTMLElement} $ele - * @param {string} name - */ - static removeAttr($ele, name) { - if (!$ele) { - return; - } - $ele.removeAttribute(name); - } - - /** - * Set an aria-* attribute when the state applies, remove it otherwise. - * - * Preferred over writing `aria-x="false"` for states whose absence is meaningful - * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some - * screen readers still verbalise. - * - * @param {HTMLElement | NodeListOf} $ele - * @param {string} name - * @param {boolean} isSet - * @param {string} [value='true'] - */ - static toggleAria($ele, name, isSet, value = 'true') { - if (!$ele) { - return; - } - DomUtils.getElements($ele).forEach($this => { - if (isSet) { - $this.setAttribute(`aria-${name}`, value); - } else { - $this.removeAttribute(`aria-${name}`); - } - }); - } - /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -742,21 +600,7 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - /** - * Quotes are escaped here, at the attribute boundary, because this is the only place - * that knows the value is about to be wrapped in double quotes. - * - * The caller that matters is getTooltipAttrText(), which passes option labels through - * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) - * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and - * put a live attribute on the value-tag element. Escaping unconditionally here removes - * the condition, and the parser turns " back into a quote, so the attribute still - * reads back as the original string. - * - * String(), not Utils.getString(): the latter maps `false` to '', and some of these - * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). - */ - html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; + html += ` ${k}="${v}" `; } }); return html; @@ -807,9 +651,6 @@ class DomUtils { }); } } -;// ./src/utils/index.js - - ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -831,7 +672,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -867,20 +708,9 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - /** - * These props are developer-supplied but still reach an attribute directly, and none of them - * passes through secureText() - so enableSecureText never protected them. A double quote - * closed the attribute early: the payload after it was parsed as markup, and the accessible - * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. - * - * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to - * option and group labels: strip markup, then escape quotes. Plain quote escaping for - * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide - * a caller error instead of fixing it. - */ - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -921,7 +751,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -933,11 +763,6 @@ class VirtualSelect {
-
- -
- ${this.renderDropbox({ wrapperClasses })} @@ -957,25 +782,6 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); - - /** - * The submitting field's name is set as a DOM property, not interpolated into the template. - * - * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so - * the remainder of the value was parsed as markup (real elements, an injection) while the - * field kept only the truncated prefix - or, when the payload also swallowed the following - * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw - * inside the constructor. Either way the form silently stopped submitting the right name, - * and that included legitimate names such as `items["a"]`. - * - * A property assignment performs no HTML parsing, so there is nothing to break out of and - * nothing to escape - which is also why `name` no longer goes through secureText(): the - * escaping only ever protected this sink, and applying it here corrupted the submitted - * field name into `items["a"]`. - */ - this.$hiddenInput.name = this.name; - this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); - this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1005,9 +811,7 @@ class VirtualSelect {
-
+
@@ -1040,16 +844,8 @@ class VirtualSelect { return html; } renderOptions() { - /** - * The ARIA scan walks every option, so running it per render made scrolling O(n) per - * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the - * filtered set or its order changes, never when the virtualisation window moves, so - * recompute on a dirty flag instead. Everything that alters the set marks it dirty. - */ - if (this.ariaMetadataDirty) { - this.calculateAriaMetadata(); - this.ariaMetadataDirty = false; - } + // Calculate ARIA metadata before rendering to ensure it's always up to date + this.calculateAriaMetadata(); let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -1112,14 +908,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - /** carried into every child's aria-label below, so strip markup once here */ - groupName = Utils.getAriaLabelText(d.label); + groupName = d.label; optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const selectAllText = Utils.getAriaLabelText(this.selectAllText); - ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; + const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); + const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); + ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; } } if (isSelected) { @@ -1136,13 +932,13 @@ class VirtualSelect { * 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 = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); - const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); + 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}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; + ariaLabel = `aria-label="${groupName}, ${d.label}"`; } } if (hasLabelRenderer) { @@ -1168,23 +964,8 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } - - /** - * The option value is an untrusted string going straight into an attribute, so a double - * quote in it closed data-value early and everything after it was parsed as markup - a - * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, - * whether or not enableSecureText was on. - * - * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches - * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). - * Both together keep the attribute round-tripping: the parser turns `&` and `"` - * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on - * every render anyway. - */ - const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -1207,40 +988,20 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - /** - * role="checkbox" + aria-checked so the control is announced as a checkbox and its - * state changes are audible. Without them it exposed as a generic element and every - * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). - * aria-checked is kept in sync by toggleAllOptionsClass(). - */ - /** - * selectAllText has two sinks, and only the attribute one is escaped. - * - * The visible label below is rendered as HTML and that works today - `Pick all` - * produces a real - so escaping it would be a visible regression for anyone styling - * the Select All label. The accessible name, by contrast, was raw: a quote broke out of - * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same - * treatment the group-header aria-label a few methods up already applies to this exact - * prop, which is why that sink was safe while this one was not. - */ - checkboxHtml = ` + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1371,29 +1132,14 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - - /** - * Space is the expected activation key for role="checkbox"; Enter is kept for - * backwards compatibility. preventDefault stops Space from scrolling the page - * (the previous behaviour, since the key was unhandled here). - */ - if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { - e.preventDefault(); + if (document.activeElement === this.$toggleAllButton && key === 13) { this.toggleAllOptions(); return; } - /** - * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). - * The element that contains the focused node differs by layout: with an external - * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be - * tested against $dropboxWrapper. In every other case - including the default - * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting - * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the - * default config, so the branch never ran and Escape did nothing. - */ + // Handle the Escape key when showing the dropdown as a popup, closing it if (key === 27 || e.key === 'Escape') { - const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; + const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1411,34 +1157,33 @@ class VirtualSelect { this.openDropbox(); } } - - /** - * Move the highlight without moving DOM focus. - * - * Previously both arrow handlers bailed out whenever the search input had focus, to let - * the caret move. But opening the dropdown focuses the search input, so in the default - * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). - * The APG editable-combobox pattern is what applies here: Up/Down drive the list while - * focus stays in the field, and the active option is published as aria-activedescendant. - * - * @param {KeyboardEvent} e - * @param {'next' | 'previous'} direction - */ - navigateOptions(e, direction) { + onDownArrowPress(e) { + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction + direction: 'next' }); } else { this.openDropbox(); } } - onDownArrowPress(e) { - this.navigateOptions(e, 'next'); - } onUpArrowPress(e) { - this.navigateOptions(e, 'previous'); + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } + e.preventDefault(); + if (this.isOpened()) { + this.focusOption({ + direction: 'previous' + }); + } else { + this.openDropbox(); + } } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1475,24 +1220,8 @@ class VirtualSelect { this.reset(); } } - - /** - * Scroll fires many times per drag and each event triggered a full re-render - * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for - * the whole gesture. Coalesce into at most one re-render per animation frame; the pending - * frame is cancelled in destroy() so it cannot run against a torn-down instance. - */ onOptionsScroll() { - if (this.scrollAnimationFrame) { - return; - } - this.scrollAnimationFrame = requestAnimationFrame(() => { - this.scrollAnimationFrame = null; - if (this.isDestroyed) { - return; - } - this.setVisibleOptions(true); - }); + this.setVisibleOptions(true); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1659,8 +1388,6 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); - /** the shared text measurer is the last page-level node we own */ - Utils.removeTextMeasurer(); } } @@ -1726,12 +1453,6 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } - - /** - * Marks the end of construction. Live-region announcements are suppressed until - * here so an initial value or the first render does not speak on page load. - */ - this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1790,16 +1511,9 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - - /** a closing dropbox must not take a highlight back - see closeDropbox() */ - if (!this.isClosing) { - this.focusOption({ - focusFirst: true - }); - } - if (!this.hasServerSearch) { - this.announceSearchResults(); - } + this.focusOption({ + focusFirst: true + }); } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1885,14 +1599,6 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; - /** live-region announcement texts (see announce/getResultsCountMessage) */ - this.searchResultsText = options.searchResultsText; - this.searchResultText = options.searchResultText; - this.noOptionsSelectedText = options.noOptionsSelectedText; - this.selectedText = options.selectedText; - this.loadingText = options.loadingText; - this.requiredErrorText = options.requiredErrorText; - this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1907,8 +1613,7 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ - this.name = options.name; + this.name = this.secureText(options.name); this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1930,16 +1635,6 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); - /** - * The open/close animation is driven from JS as well as CSS, so the stylesheet's - * prefers-reduced-motion rule alone would still leave the popover animating for - * showDuration/hideDuration milliseconds. Honour the preference here too. - */ - if (Utils.prefersReducedMotion()) { - this.showDuration = 0; - this.hideDuration = 0; - } - /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -1968,25 +1663,13 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property - this.isClosing = false; this.ariaSetSize = 0; - this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { - const globalDefaults = VirtualSelect.globalDefaults; - - /** - * Resolve a prop across the precedence chain for the few defaults that are derived - * from another prop, so a page-level default still drives them. - * @param {string} key - */ - const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; - const keepAlwaysOpen = resolve('keepAlwaysOpen'); - const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -2010,19 +1693,10 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', - /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ - searchResultsText: 'results available', - searchResultText: 'result available', - noOptionsSelectedText: 'No options selected', - selectedText: 'selected', - loadingText: 'Loading results', - /** validation messages; {count} in minValuesErrorText is replaced with minValues */ - requiredErrorText: 'This field is required', - minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: keepAlwaysOpen ? 1 : 2, + zIndex: options.keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -2044,17 +1718,11 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (hasOptionDescription) { + if (options.hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - - /** - * Precedence: per-instance options > page-level globals > built-in defaults. - * Globals let a host turn a policy on once (notably enableSecureText) instead of - * repeating it at every call site, while an instance can still opt out explicitly. - */ - return Object.assign(defaultOptions, globalDefaults, options); + return Object.assign(defaultOptions, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -2078,8 +1746,6 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; - /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -2108,23 +1774,8 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - /** - * Option values are untrusted strings used as keys, so every value-keyed lookup in this - * file is built with Object.create(null) rather than `{}`. - * - * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object - * calls the inherited setter, which ignores a non-object value, so nothing is written and - * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns - * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups - * all compare against `true`. An option whose value is `__proto__` was therefore - * selectable by click (that path reads data-value, not a mapping) but invisible to - * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read - * back could not be restored - and under allowNewOption it was mistaken for an unknown - * value and duplicated. A null prototype has no inherited members, so an arbitrary string - * key behaves like any other. - */ - const valuesMapping = Object.create(null); - const valuesOrder = Object.create(null); + const valuesMapping = {}; + const valuesOrder = {}; let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -2187,7 +1838,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = Object.create(null); + const valuesMapping = {}; preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2248,7 +1899,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -2282,7 +1933,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = Object.create(null); + const enabledOptionsMapping = {}; enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -2317,7 +1968,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -2330,25 +1981,8 @@ class VirtualSelect { [labelKey]: d }; } - - /** - * `value` is stored verbatim; only `label` and `description` are escaped. - * - * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` - * attribute (escaped there, at the boundary) and is otherwise only compared or used as a - * map key. Escaping it stored an identity the caller could not name - `a&b` became - * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set - * again. - * - * The normalised search keys derive from the *raw* text for the same reason: they are - * matched against what the user types into the search box, which is never HTML-escaped. - * Deriving them from the escaped text meant no query could match text containing `&`, - * `<` or `>`. - */ - const rawValue = getString(d[valueKey]); - const rawLabel = getString(d[labelKey]); - const value = rawValue; - const label = secureText(rawLabel); + const value = secureText(getString(d[valueKey])); + const label = secureText(getString(d[labelKey])); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -2356,7 +1990,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2374,10 +2008,9 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const rawDescription = getString(d[descriptionKey]); - option.description = secureText(rawDescription); - /** normalised from the raw text, so a query containing `&` can match - see above */ - option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); + const description = secureText(getString(d[descriptionKey])); + option.description = description; + option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2423,7 +2056,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = Object.create(null); + const newOptionsValueMapping = {}; optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2457,18 +2090,11 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); - - /** replace the "loading" message with the outcome of the fetch */ - if (this.isInitialized) { - this.announce(this.getResultsCountMessage()); - } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { - /** order drives aria-posinset */ - this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2555,15 +2181,6 @@ class VirtualSelect { if (!disableValidation) { this.validate(); } - - /** - * Selection changes are otherwise conveyed only by the (visual) value text. - * Guarded on isInitialized so a value supplied at construction time is not - * announced before the user has interacted with anything. - */ - if (this.isInitialized) { - this.announce(this.getSelectionMessage()); - } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); } @@ -2610,13 +2227,11 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - /** markup in the label would otherwise land in the accessible name; a double - * quote in it would break out of the attribute entirely */ + // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = Utils.getAriaLabelText(label); - const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; + const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2762,14 +2377,6 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; - /** - * Number of options matching the current filter. Kept separately because - * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered - * virtualisation window, which is not what a "N results available" message means. - */ - this.filteredOptionsCount = visibleOptionsCount; - /** isVisible changed for the whole set, so positions and setsize must be recomputed */ - this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2858,15 +2465,10 @@ class VirtualSelect { if (!value) { return; } - - /** adds a row to the filtered set */ - this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - - /** value verbatim, label escaped - the label is the only one rendered as HTML */ - this.setOptionProp(newIndex, 'value', value); + this.setOptionProp(newIndex, 'value', this.secureText(value)); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2883,7 +2485,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2899,7 +2501,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = Object.create(null); + const availableValuesMapping = {}; this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -2994,7 +2596,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = Object.create(null); + const valuesMapping = {}; let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -3069,11 +2671,9 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - /** quotes are escaped unconditionally by getAttributesText(); escaping again here would - * leave a literal " in the tooltip, and the old containsHTML() condition is what - * let a tag-free payload through in the first place */ + const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; const data = { - 'data-tooltip': text || '', + 'data-tooltip': tootltipText || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -3097,18 +2697,17 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - /** value stored verbatim, search keys derived from the raw text - see setOptions() */ - const rawValue = getString(data.value); - const rawLabel = getString(data.label); - const rawDescription = getString(data.description); + const value = secureText(getString(data.value)); + const label = secureText(getString(data.label)); + const description = secureText(getString(data.description)); return { index: data.index, - value: rawValue, - valueNormalized: rawValue.toLowerCase(), - label: secureText(rawLabel), - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), - description: secureText(rawDescription), - descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), + value, + valueNormalized: value.toLowerCase(), + label, + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + description, + descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -3134,7 +2733,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -3192,7 +2791,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = Object.create(null); + const valuesOrder = {}; selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -3206,7 +2805,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = Object.create(null); + const disabledOptionsValueMapping = {}; const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -3344,8 +2943,6 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); - /** the search input is its own combobox over the listbox, so it needs the state too */ - DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3405,22 +3002,9 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$searchInput, 'expanded', false); - /** - * No option is active once the list is gone - and the highlight has to go with it, - * here, synchronously. - * - * afterHidePopper() already calls removeOptionFocus(), but for popover-backed - * instances it only runs when the hide transition ends (~200ms later). Until then the - * previous highlight and `focusedOptionIndex` survived the close, so reopening within - * that window resumed navigation from the old position instead of the first option: - * the next Up/Down moved one step past where the user expected, which on a grouped - * multi-select meant Enter landed on the first child option instead of toggling the - * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving - * the afterHidePopper() call in place costs nothing and still covers the silent path. - */ - this.removeOptionFocus(); - this.setActiveDescendant(''); + DomUtils.setAria(this.$wrapper, 'activedescendant', ''); + // Also clear aria-activedescendant on the listbox container + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3433,26 +3017,7 @@ class VirtualSelect { } else { this.afterHidePopper(); } - - /** - * Clearing the filter runs afterSetSearchValue(), which highlights the first visible - * option again. That undid the removeOptionFocus() above whenever the user had typed - * something: the highlight and aria-activedescendant came straight back on a combobox - * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option - * that is about to be display:none - so the keyboard position ended up on . - * - * isClosing is scoped to this one call rather than the whole method because everything - * above it (the wrapper refocus in particular) still needs the real state. The reset runs - * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the - * highlight coming back after *every* later filter clear, which is far harder to diagnose - * than the exception itself. - */ - this.isClosing = true; - try { - this.setSearchValue(''); - } finally { - this.isClosing = false; - } + this.setSearchValue(''); } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3807,14 +3372,7 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - const isChecked = isAllSelected || isAllVisibleSelected; - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); - /** - * Mirror the visual checked state onto the role="checkbox" host. This is the single - * point every selection path funnels through (select all, deselect all, per-option - * clicks, group toggles, setValue, reset), so the exposed state cannot drift. - */ - DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3862,7 +3420,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = Object.create(null); + const valuesMapping = {}; const { removeItemFromArray } = Utils; @@ -3907,15 +3465,7 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - /** - * Explicitly against null, not truthiness. focusedOptionIndex comes from - * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a - * truthiness test happens to pass for the first option. Normalise it to a number anywhere - * and index 0 would stop being cleared, so its `isFocused` prop would survive - and - * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the - * stale highlight back through the data path on the next render. - */ - if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { + if (this.focusedOptionIndex) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -3974,8 +3524,6 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { - /** removes a row from the filtered set */ - this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -4095,9 +3643,6 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); - - /** the spinner is a visual-only cue; announce that a fetch is in flight */ - this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -4132,52 +3677,18 @@ class VirtualSelect { return true; } let hasError = false; - let errorText = ''; const { selectedValues, minValues } = this; - if (this.required) { - if (Utils.isEmpty(selectedValues)) { - hasError = true; - errorText = this.requiredErrorText; - } else if (this.multiple && minValues && selectedValues.length < minValues) { - /** required minium options not selected */ - hasError = true; - errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); - } + if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ + this.multiple && minValues && selectedValues.length < minValues))) { + hasError = true; } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); - - /** - * Previously the only signal was the `has-error` class recolouring the toggle button - * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. - * Expose the state (aria-invalid), give it a text message, point the combobox at that - * message (aria-describedby) and announce it. - */ - DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); - this.setErrorMessage(hasError ? errorText : ''); return !hasError; } - /** - * Show or clear the validation message and its association with the combobox. - * An empty message removes aria-describedby rather than pointing at empty text. - * - * @param {string} message - */ - setErrorMessage(message) { - if (!this.$errorMessage) { - return; - } - const text = message || ''; - this.$errorMessage.textContent = text; - DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); - if (text) { - this.announce(text); - } - } - /** * 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). @@ -4228,12 +3739,6 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); - // Drop any queued scroll re-render so it cannot touch detached DOM - if (this.scrollAnimationFrame) { - cancelAnimationFrame(this.scrollAnimationFrame); - this.scrollAnimationFrame = null; - } - /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -4262,20 +3767,8 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - - /** - * escape potentially harmful markup so label/value/description cannot trigger XSS. - * - * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML - * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as - * `The &quot;City&quot; of Light`, shown to the user as `The "City" of - * Light`, and made unsearchable, because labelNormalized derives from the stored text. - * Quotes only need escaping inside an attribute, and that now happens at each attribute - * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also - * covers the sinks this pre-escaping never reached, such as an attribute written while - * enableSecureText is off. - */ - this.$secureText.nodeValue = text; + /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ + this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); return this.$secureDiv.innerHTML; } @@ -4296,78 +3789,9 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } - - /** - * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). - * - * Identical consecutive messages are intentionally left alone: re-writing the same text - * produces no DOM mutation, so assistive technology does not repeat "No results found" - * on every further keystroke that still matches nothing. - * - * @param {string} message - */ - announce(message) { - if (!this.$liveRegion) { - return; - } - const text = message || ''; - if (this.$liveRegion.textContent !== text) { - this.$liveRegion.textContent = text; - } - } - - /** - * Message describing how many options the current filter matched. - * @returns {string} - */ - getResultsCountMessage() { - const count = this.filteredOptionsCount || 0; - if (count === 0) { - return this.noSearchResultsText; - } - return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; - } - - /** - * Message describing the current selection. - * @returns {string} - */ - getSelectionMessage() { - const count = this.selectedValues.length; - if (count === 0) { - return this.noOptionsSelectedText; - } - if (this.multiple) { - return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; - } - - /** option flags are updated before setValue(), so the label is already current */ - const label = this.getDisplayValue() || this.selectedValues[0]; - return `${label} ${this.selectedText}`; - } - - /** - * Announce the match count, but only while the user is actually searching. - * setSearchValue('') also runs on close and after a value is set; announcing there - * would read a stale count into the user's ear for an interaction they did not make. - */ - announceSearchResults() { - if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { - return; - } - this.announce(this.getResultsCountMessage()); - } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); - - /** dropping the requirement also drops any error it produced */ - if (!this.required) { - DomUtils.toggleClass(this.$allWrappers, 'has-error', false); - DomUtils.toggleAria(this.$allWrappers, 'invalid', false); - this.setErrorMessage(''); - } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -4383,83 +3807,17 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - - /** - * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it - * had just un-highlighted, which is either pointless (focusOption immediately focuses the - * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is - * about to be hidden, fighting the wrapper refocus in closeDropbox(). - */ - if (isFocused && document.activeElement !== this.$searchInput) { + if (document.activeElement !== this.$searchInput) { $ele.focus(); } - - /** - * Publish the highlight on the elements that can carry it: the wrapper and the search - * input, both role="combobox". It used to also go on $dropboxContainer, a plain div - * with no role, where aria-activedescendant is meaningless - and never on the search - * input, which is the element that actually holds focus while navigating. - */ - this.setActiveDescendant(isFocused ? $ele.id : ''); - } - - /** - * Point the combobox elements at the active option, or clear the reference. - * @param {string} optionId - */ - setActiveDescendant(optionId) { - DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); - DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); - } - - /** static methods - start */ - - /** - * Set page-level default props applied to every instance created afterwards. - * - * The motivating case is security: option text is interpolated into innerHTML and is only - * escaped when `enableSecureText` is on, which it is not by default (escaping costs per - * option, and large trusted lists should not pay for it). A host that does render - * untrusted option text can turn escaping on once here rather than at every call site: - * - * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - * - * These are defaults, not overrides: an instance passing the prop explicitly still wins, - * so a host forwarding `enableSecureText` on every init must stop doing so (or forward - * `true`) for this to take effect. Calls merge, so features can be configured separately. - * Only instances created after the call are affected. - * - * @param {Partial} props - */ - static setGlobalDefaults(props) { - if (!props || typeof props !== 'object') { - VirtualSelect.globalDefaults = {}; - return; + if (isFocused) { + DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); + // Also set aria-activedescendant on the listbox container for better screen reader support + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); } - - /** `ele` and `options` are per-instance by nature and would alias state across instances */ - const safeProps = { - ...props - }; - delete safeProps.ele; - delete safeProps.options; - VirtualSelect.globalDefaults = { - ...VirtualSelect.globalDefaults, - ...safeProps - }; } - /** - * Currently active page-level defaults. - * A copy, so callers cannot mutate the live object. - * - * @returns {Partial} - */ - static getGlobalDefaults() { - return { - ...VirtualSelect.globalDefaults - }; - } + /** static methods - start */ static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4690,9 +4048,6 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; -// Page-level default props, applied under per-instance options (see setGlobalDefaults) -VirtualSelect.globalDefaults = {}; - /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 7257fcff..29fc53eb 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index c4ec13c2..5ab3dec1 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static getAriaLabelText(e){const s=t.getString(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim();return t.replaceDoubleQuotesWithHTML(s)}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};return s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px"),Object.assign(i,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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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(),this.isInitialized&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const t=e||"";this.$liveRegion.textContent!==t&&(this.$liveRegion.textContent=t)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); From b6e4786a49764a86c15c72e264500369dd1db1b8 Mon Sep 17 00:00:00 2001 From: gnbm Date: Wed, 5 Aug 2026 23:53:50 +0100 Subject: [PATCH 50/57] test(security): give every XSS payload its own marker (AI-26) The CI run reported "payload must not execute" on `does not let an undefined prop defeat the global default`, 8 of 9 cases green. The component was behaving correctly; the marker was written by a different test. The file shared one `window.__vsGlobalXss`, reset in beforeEach. The insecure-by-default case deliberately creates a REAL `` and asserts the element exists - but an image error event is asynchronous and that assertion passes long before it fires. Measured against the built bundle, from the moment the assertion passed: first +7 ms still inside its own test second +313 ms inside the `undefined prop` test, after its reset Two images because the dropbox re-renders when its 300 ms open animation finishes (showDuration: 300), creating a second live element. At 134 ms per test, that second write lands two tests later. Timing-dependent, which is why the other eight cases were green. Two assumptions let it through, and the second corrects a note I had written in ACTION-ITEMS: testIsolation is false AND baseUrl ends in `#/`, so cy.visit('get-started') is a hash-only navigation that never reloads the document. One window for the whole spec - the file already relied on that, since it resets VirtualSelect.secureTextWarningShown by hand. So `cy.visit` was not clearing anything between cases. Fix, spec-only, no product change. Each test mints its own marker, so a late detonation writes the marker of the test that caused it and cannot fail another. Waiting it out was the alternative and was rejected: it swaps a real assertion for a sleep and is still a race. Two assertions added while here, both about tests that could pass for the wrong reason: - the insecure-by-default case now asserts its payload *does* execute, not merely that an element exists. That is the claim the case exists to make, and it drains the first detonation inside its own test. - the `undefined prop` case asserts the option rendered as text *before* asserting no exists. On its own, "no img" is equally true of a list that never rendered at all. resetGlobals() also could not do its job: setGlobalDefaults({}) merges, so `enableSecureText: true` leaked forward from the previous case and only test order kept it harmless - it contaminated my own diagnostic sweep twice. It now resets by supplying undefined, which the merge treats as "not supplied": the contract AI-25's WR-10 fix established, and independent of how the still-open `setGlobalDefaults({})` clearing question is settled. Verified by replaying all nine cases in a real browser back to back with no waits between them - the hostile ordering: 9/9 pass, and after letting every late detonation land, the markers of the two escaping cases are still unset while the two that should detonate are true. tsc, eslint and prettier pass. --- cypress/e2e/security-global-defaults.cy.ts | 74 +++++++++++++++++----- 1 file changed, 59 insertions(+), 15 deletions(-) diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts index b3e19507..7b7cd2c4 100644 --- a/cypress/e2e/security-global-defaults.cy.ts +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -18,17 +18,40 @@ import { mountVs, unmountVs } from '../support/mount'; describe('Security: global defaults for enableSecureText', () => { const mountId = 'vs-sec-global'; - const payload = ''; + + /** + * Every test detonates into its own marker, because the payload here is genuinely live. + * + * Test isolation is off and `cy.visit()` only changes the hash, so all of these tests share a + * single window that is never reloaded — this file already depends on that (see the + * `secureTextWarningShown` reset in the last test). The insecure-by-default test creates a real + * ``, and an image error event is asynchronous: measured against the built bundle it + * fires 7 ms after the "the element exists" assertion has already passed, and *again* at 313 ms, + * because the dropbox re-renders when its 300 ms open animation finishes and so produces a + * second live image. + * + * With one page-wide marker, that second detonation landed two tests later — after the + * `beforeEach` that had reset it — and failed whichever test was running at the time while the + * component under test was behaving perfectly. A marker per test removes the cross-talk instead + * of papering over it with a wait. + */ + let markerSeq = 0; + const newMarker = () => `__vsGlobalXss${(markerSeq += 1)}`; + const payloadFor = (marker: string) => ``; + const markerValue = (win: Window, marker: string) => (win as unknown as Record)[marker]; const resetGlobals = (win: Window) => { + /** + * `setGlobalDefaults()` merges, so `{}` cannot clear a key an earlier test set, and nothing + * reloads the page to do it for us. Supplying `undefined` is exactly what the merge treats as + * "not supplied", so the built-in defaults are back in force. + */ // @ts-expect-error - VirtualSelect is attached to window by the bundle - win.VirtualSelect.setGlobalDefaults({}); - // @ts-expect-error - test marker - win.__vsGlobalXss = undefined; + win.VirtualSelect.setGlobalDefaults({ enableSecureText: undefined, placeholder: undefined }); }; - const mountWithPayload = (win: Window, extra: Record = {}) => - mountVs(win, mountId, { options: [{ label: payload, value: 'p1' }], ...extra }); + const mountWithPayload = (win: Window, marker: string, extra: Record = {}) => + mountVs(win, mountId, { options: [{ label: payloadFor(marker), value: 'p1' }], ...extra }); beforeEach(() => { cy.viewport(1280, 800); @@ -53,19 +76,32 @@ describe('Security: global defaults for enableSecureText', () => { }); it('still renders option text as raw HTML by default, so behaviour is unchanged', () => { - cy.window().then((win) => mountWithPayload(win)); + const marker = newMarker(); + + cy.window().then((win) => mountWithPayload(win, marker)); cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); // The documented, insecure-by-default behaviour: a real element is created. cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] img[src="x"]').should('exist'); + + /** + * And it is not inert. Asserting the detonation rather than only the element proves the + * default really does execute attacker-controlled markup, which is the whole reason + * setGlobalDefaults() exists; `should` retries, and the first error event lands within ~10 ms. + */ + cy.window().should((win) => { + expect(markerValue(win, marker), 'the insecure default really does execute the payload').to.eq(true); + }); }); it('escapes option text for instances created after a global default is set', () => { + const marker = newMarker(); + cy.window().then((win) => { // @ts-expect-error - bundle global win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - mountWithPayload(win); + mountWithPayload(win, marker); }); cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); @@ -76,8 +112,7 @@ describe('Security: global defaults for enableSecureText', () => { cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] .vscomp-option-text').should('contain', 'img'); cy.window().then((win) => { - // @ts-expect-error - test marker - expect(win.__vsGlobalXss, 'payload must not execute').to.not.eq(true); + expect(markerValue(win, marker), 'payload must not execute').to.not.eq(true); }); }); @@ -91,10 +126,12 @@ describe('Security: global defaults for enableSecureText', () => { * the wrapper property may be undefined. It also contradicts setDefaultProps()'s own `resolve()` * helper, which already treats `undefined` as "not supplied". */ + const marker = newMarker(); + cy.window().then((win) => { // @ts-expect-error - bundle global win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - mountWithPayload(win, { enableSecureText: undefined }); + mountWithPayload(win, marker, { enableSecureText: undefined }); }); cy.get(`#${mountId}`).should(($ele) => { @@ -102,20 +139,25 @@ describe('Security: global defaults for enableSecureText', () => { }); cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); + + // Assert the option rendered *first*: `img` never existing is also true of a list that never + // rendered at all, so on its own that check can pass for the wrong reason. + cy.get(`#${mountId}`).find('.vscomp-option[data-value="p1"] .vscomp-option-text').should('contain', 'img'); cy.get(`#${mountId}`).find('img[src="x"]').should('not.exist'); cy.window().then((win) => { - // @ts-expect-error - test marker - expect(win.__vsGlobalXss, 'payload must not execute').to.not.eq(true); + expect(markerValue(win, marker), 'payload must not execute').to.not.eq(true); }); }); it('lets an explicit per-instance option override the global default', () => { + const marker = newMarker(); + cy.window().then((win) => { // @ts-expect-error - bundle global win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); // Opting back out for a trusted, HTML-rendering list. - mountWithPayload(win, { enableSecureText: false }); + mountWithPayload(win, marker, { enableSecureText: false }); }); cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); @@ -161,6 +203,8 @@ describe('Security: global defaults for enableSecureText', () => { }); it('suppresses the insecure-by-default console warning when the global default is on', () => { + const marker = newMarker(); + cy.window().then((win) => { // @ts-expect-error - internal flag reset so the once-per-page guard does not hide the result win.VirtualSelect.secureTextWarningShown = false; @@ -168,7 +212,7 @@ describe('Security: global defaults for enableSecureText', () => { // @ts-expect-error - bundle global win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - mountWithPayload(win); + mountWithPayload(win, marker); }); cy.get('@consoleWarn').should((spy: any) => { From 4cac73f867b7a648a0fe20d2f3689f4c7cd87276 Mon Sep 17 00:00:00 2001 From: gnbm Date: Thu, 6 Aug 2026 00:14:47 +0100 Subject: [PATCH 51/57] test(a11y): fix four spec-quality findings from the second review (AI-27) All four are in the safety net rather than the product, which is why they came before the remaining WR- items: every other conclusion on this branch leans on these specs. No product code changes here. Each rewritten case was replayed against the built bundle with real CDP key events - 30 assertions, all green - because Cypress still cannot start in this environment. --- WR-14: a case that documented the contract this branch removed --- `Arrow key behavior - no option navigation when search input focused` was left behind when 04abbe9 deliberately made Up/Down navigate options *from* the search input. Its name, its comments ("arrow key should move cursor, not navigate options") and a dead searchInputSelector variable all describe the old contract, and because its assertions only checked that DOM focus stayed in the field - still true - it passed while telling the next maintainer that the new behaviour is the bug. It also could not distinguish "navigates without stealing focus" from "does nothing at all". Renamed, and it now pins the whole contract: the highlight moves on Down, comes back on Up, DOM focus never leaves the field, and aria-activedescendant follows the highlight - the last of these being what makes the navigation perceivable to a screen reader while focus stays in the input (WCAG 4.1.2). cy.realPress() rather than cy.pressKeys() on purpose: pressKeys() focuses the field before pressing, which would make the focus assertion self-fulfilling. The cy.wait(100) is replaced by asserting the field's value and the filtered option count, so the case waits on a state instead of a clock. --- WR-15: an assertion that never ran --- "removes the measurer once the last instance is destroyed" guarded its only assertion behind `if (remaining === 0)`. Measured: the docs page keeps 2 instances alive, so that is false on every run. The case reported green while asserting nothing, and Utils.removeTextMeasurer() was never exercised. It now creates the state instead of testing for it - destroys every active instance, asserts the set is empty, then asserts the node is gone. Safe because this describe runs with testIsolation: true and it is the last case in the file. It also asserts there were instances to destroy, so the teardown cannot quietly become a no-op the way the old guard did. --- WR-16: .type() chained onto virtualised nodes, in two places --- The pattern 9d7d35c removed from four cases survived in the Option group suite with the count raised to 20: each iteration re-queried `.focused` and typed into a node renderOptions() may have replaced in between. The neighbouring case has the same defect and is not in the review's list, so it is fixed here too - same fault, 25 lines up. Both now use pressKeys() and a fresh query per assertion, with no aliases for option nodes. The alias mattered for more than the keystroke: a detached node keeps its classes, so `cy.get('@lastOption').should('have.class', 'focused')` would have passed without checking anything. One note on evidence: confirming the clamp with 20 synthetic keydowns in a tight loop showed the highlight back at index 0, which looks like wrap-around. That was a harness artefact - no re-render between presses. With real presses spaced as Cypress commands are, 20 presses land on the last group option and a 21st leaves it there. --- WR-17: pressKeys() broke on any search: false instance --- It resolved .vscomp-search-input unconditionally - the exact case openFresh() guards two commands above. Nothing currently mounts that way and calls pressKeys(), so this was a latent trap: the next such case would have failed with an opaque "expected to find element". It now focuses $searchInput || $wrapper. The wrapper is the right fallback rather than a workaround: it carries role="combobox" and tabindex="0", and it is where onKeyDown is bound ($allWrappers), which is how a keystroke in the search input reaches the handler in the first place - by bubbling up to it. Verified on a real search: false instance: ArrowDown navigates, a second press moves on, Enter selects. The invalid-key error also interpolated the caller's own keys where it meant the valid set, so a typo produced `Invalid key provided: "Foo". Must be one of: Foo`. A single SPECIAL_KEYS constant now feeds the type, the guard and the message, so they cannot drift. tsc passes. Prettier: both touched files were already unformatted on HEAD (the repo does not run prettier over cypress/), so they are left as they are rather than reformatted wholesale, which would bury the change - but every added line is within the configured 120-column width. --- cypress/e2e/examples.cy.ts | 111 +++++++++++++++++++-------- cypress/e2e/perf-text-measurer.cy.ts | 23 ++++-- cypress/support/commands.ts | 39 +++++++--- 3 files changed, 127 insertions(+), 46 deletions(-) diff --git a/cypress/e2e/examples.cy.ts b/cypress/e2e/examples.cy.ts index 944e9da2..122b8932 100644 --- a/cypress/e2e/examples.cy.ts +++ b/cypress/e2e/examples.cy.ts @@ -326,28 +326,73 @@ describe('Arrow key behavior in search input - cursor movement', () => { }); }); -describe('Arrow key behavior - no option navigation when search input focused', () => { +describe('Arrow key behavior - option navigation from the search input keeps focus in the field', () => { const idMultiple = 'multiple-select' - const searchInputSelector = '.vscomp-search-input'; - it('should not navigate options when arrow keys used in search input', () => { + /** + * This branch deliberately made Up/Down navigate options *from* the search input + * (`04abbe9`, `navigateOptions()`), and the other suites were updated for it - this one was not. + * It was called "no option navigation when search input focused" and asserted only that DOM + * focus stayed put, which is still true, so it passed while documenting the contract that had + * been removed on purpose. It also could not tell "navigates without stealing focus" from + * "does nothing at all". + * + * What is pinned now, all three measured against the built bundle: + * - the highlight moves on Down and moves back on Up; + * - DOM focus never leaves the field, so it stays typeable; + * - `aria-activedescendant` follows the highlight, which is what makes the navigation + * perceivable to a screen reader while focus stays in the input (WCAG 4.1.2). + * + * `cy.realPress()` rather than `cy.pressKeys()`: the latter focuses the field before pressing, + * which would make the focus assertion self-fulfilling. Focus is already in the field here, + * left there by `typeValue()`. + */ + it('navigates options with the arrow keys without moving focus out of the search input', () => { /** openFresh(): this suite drives the caret and the option highlight by key press, so it * must start from a known open state with nothing already highlighted. */ cy.openFresh(idMultiple); - // Type in search input - use text that will filter to a few options + // Text that filters to more than one option, so there is somewhere to navigate to. cy.getVs(idMultiple).typeValue('Option 1', true); - // Wait for filtering to complete - cy.wait(100); - // Verify search input is focused + // The filter is applied synchronously on input, so the field's value is the gate to wait on. + cy.getDropbox(null, idMultiple).find('.vscomp-search-input').should('have.value', 'Option 1'); + cy.getDropbox(null, idMultiple).find('.vscomp-option').should('have.length.greaterThan', 1); cy.checkActiveElementHasClass('vscomp-search-input'); - // Press Down arrow while focused on search input - cy.getVs(idMultiple).pressKeys('ArrowDown'); - // Search input should still be focused (arrow key should move cursor, not navigate options) - cy.checkActiveElementHasClass('vscomp-search-input'); - // Press Up arrow while focused on search input - cy.getVs(idMultiple).pressKeys('ArrowUp'); - // Search input should still be focused + + cy.realPress('ArrowDown'); + + // Focus stays in the field - and an option is now highlighted, which is the half the old + // version of this case never checked. cy.checkActiveElementHasClass('vscomp-search-input'); + cy.getVs(idMultiple).should(($ele) => { + const vs = $ele[0].virtualSelect; + const $focused = vs.$dropbox.querySelector('.vscomp-option.focused'); + + expect($focused, 'an option is highlighted').to.not.equal(null); + expect( + vs.$searchInput.getAttribute('aria-activedescendant'), + 'aria-activedescendant follows the highlight', + ).to.equal($focused.id); + }); + + // Down moves on, Up comes back: neither key is a no-op, and neither takes focus with it. + cy.getDropbox(null, idMultiple) + .find('.vscomp-option.focused') + .invoke('attr', 'id') + .then((afterFirstDown) => { + cy.realPress('ArrowDown'); + cy.getDropbox(null, idMultiple) + .find('.vscomp-option.focused') + .invoke('attr', 'id') + .should('not.equal', afterFirstDown); + + cy.realPress('ArrowUp'); + cy.getDropbox(null, idMultiple) + .find('.vscomp-option.focused') + .invoke('attr', 'id') + .should('equal', afterFirstDown); + + cy.checkActiveElementHasClass('vscomp-search-input'); + }); }); it('should close multiple-select dropdown', () => { @@ -636,17 +681,18 @@ describe('Option group', () => { cy.getDropbox(null, id) .find('.vscomp-option.group-title') .first() - .as('groupTitle') .should('have.class', 'focused') - .should('have.attr', 'tabindex', '0') - .type('{downarrow}'); + .should('have.attr', 'tabindex', '0'); - cy.getDropbox(null, id) - .find('.vscomp-option.focused') - .should('have.class', 'group-option') - .type('{uparrow}'); + /** pressKeys() and a fresh query per assertion, never .type() chained onto an option node + * or an alias for one: the virtualiser replaces those nodes on every render, so the + * keystroke can hit a node that is no longer in the document - and a detached node keeps + * its classes, so the assertion that follows would pass without proving anything. */ + cy.getVs(id).pressKeys('ArrowDown'); + cy.getDropbox(null, id).find('.vscomp-option.focused').should('have.class', 'group-option'); - cy.get('@groupTitle').should('have.class', 'focused'); + cy.getVs(id).pressKeys('ArrowUp'); + cy.getDropbox(null, id).find('.vscomp-option.group-title').first().should('have.class', 'focused'); }); it('opens dropdown and selects a group child option using keyboard only', () => { @@ -674,19 +720,22 @@ describe('Option group', () => { /** Deliberately more presses than there are rows: navigation clamps at the end, which * is the "navigating past the end" case under test, and this avoids hard-coding a count - * that shifts whenever the demo's option list changes. */ + * that shifts whenever the demo's option list changes. + * + * pressKeys() rather than .type() on `.focused`: that chained the keystroke onto a + * virtualised node re-queried a moment earlier, giving the virtualiser 20 chances per run to + * replace it in between - the pattern removed from four other cases in `9d7d35c`. */ Cypress._.times(20, () => { - cy.getDropbox(null, id).find('.vscomp-option.focused').type('{downarrow}'); + cy.getVs(id).pressKeys('ArrowDown'); }); - cy.getDropbox(null, id) - .find('.vscomp-option.group-option') - .last() - .as('lastOption') - .should('have.class', 'focused'); + cy.getDropbox(null, id).find('.vscomp-option.group-option').last().should('have.class', 'focused'); - cy.get('@lastOption').type('{downarrow}'); - cy.get('@lastOption').should('have.class', 'focused'); + /** re-queried instead of aliased, for the same reason: an alias captured before the press + * can point at a node the virtualiser has since replaced, and a detached node still carries + * `focused` - so the clamp would look verified when nothing had been checked. */ + cy.getVs(id).pressKeys('ArrowDown'); + cy.getDropbox(null, id).find('.vscomp-option.group-option').last().should('have.class', 'focused'); }); }); diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts index a15c2579..43fdf280 100644 --- a/cypress/e2e/perf-text-measurer.cy.ts +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -71,14 +71,27 @@ describe('Perf: one shared text measurer', { testIsolation: true }, () => { cy.window().then((win) => unmountVs(win, mountId)); - // The docs page hosts other instances, so only assert removal once none remain. + /** + * The docs page hosts its own instances, so unmounting ours does not reach the state this + * case is named for. It used to *test* for that state — `if (remaining === 0)` — which is + * false on every run, so its only assertion was skipped every time: the case reported green + * while verifying nothing, and `Utils.removeTextMeasurer()` was never exercised. + * + * Create the state instead of waiting for it. Safe to tear the page down here: this describe + * runs with `testIsolation: true`, so the next case gets a fresh page, and this is the last + * case in the file either way. + */ cy.window().then((win) => { // @ts-expect-error - bundle global - const remaining = win.VirtualSelect.activeInstances?.size ?? 0; + const instances = Array.from(win.VirtualSelect.activeInstances) as Array<{ destroy: () => void }>; - if (remaining === 0) { - cy.get('.vscomp-text-measurer').should('not.exist'); - } + expect(instances, 'the docs page has instances to destroy').to.have.length.greaterThan(0); + instances.forEach((vs) => vs.destroy()); + + // @ts-expect-error - bundle global + expect(win.VirtualSelect.activeInstances.size, 'no instances left').to.equal(0); }); + + cy.get('.vscomp-text-measurer').should('not.exist'); }); }); diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 6892e44e..ccce27e3 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -4,13 +4,18 @@ import 'cypress-real-events'; const dropboxCloseDuration = 200; const optionsScrollDuration = 300; -type SpecialKey = 'Tab' | 'Enter' | 'Escape' | 'ArrowUp' | 'ArrowDown' | 'ArrowLeft' | 'ArrowRight' | 'Home' | 'End'; +/** + * The one source of truth for pressKeys(): the type, the guard and the error message are all + * derived from it, so they cannot drift out of step with each other. + */ +const SPECIAL_KEYS = [ + 'Tab', 'Enter', 'Escape', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End', +] as const; + +type SpecialKey = (typeof SPECIAL_KEYS)[number]; // Type guard function -const isValidKey = (key: string): key is SpecialKey => { - const specialKeys = ['Tab', 'Enter', 'Escape', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End']; - return specialKeys.includes(key); -}; +const isValidKey = (key: string): key is SpecialKey => (SPECIAL_KEYS as readonly string[]).includes(key); Cypress.Commands.add('goToSection', (title) => { cy.get('a').contains(title).click({force: true}); @@ -173,18 +178,32 @@ Cypress.Commands.add('typeValue', { prevSubject: true }, (vsElem, value, clearTe }); Cypress.Commands.add('pressKeys', { prevSubject: true }, (vsElem, keys) => { - const searchInput = cy.getDropbox(vsElem).find('.vscomp-search-input'); - searchInput.focus(); + /** + * Focus the search input when there is one and the wrapper otherwise. + * + * This used to resolve `.vscomp-search-input` unconditionally, so any `search: false` instance + * failed with an opaque "expected to find element" - the very case `cy.openFresh()` guards + * above. The wrapper is the right fallback rather than a workaround: it carries + * `role="combobox"` and `tabindex="0"`, and it is where `onKeyDown` is actually bound + * (`$allWrappers`, src/virtual-select.js:589), which is how a keystroke in the search input + * reaches the handler in the first place - by bubbling up to it. + */ + cy.get(vsElem).then(($ele) => { + const vs = $ele[0].virtualSelect; + + cy.wrap(vs.$searchInput || vs.$wrapper).focus(); + }); const keysToPress = Array.isArray(keys) ? keys : [keys]; - + keysToPress.forEach(key => { if (isValidKey(key)) { // TypeScript now knows this is a valid key type cy.realPress(key); } else { - // Log an error or fail the test if an invalid key is passed - throw new Error(`Invalid key provided: "${key}". Must be one of: ${keysToPress.join(', ')}`); + /** the *valid* set - this used to interpolate the caller's own keys, so an invalid key + * produced `Invalid key provided: "Foo". Must be one of: Foo` */ + throw new Error(`Invalid key provided: "${key}". Must be one of: ${SPECIAL_KEYS.join(', ')}`); } }); cy.get(vsElem); From 8f280c1055d58cf2b42acecb373892ce81d500bd Mon Sep 17 00:00:00 2001 From: gnbm Date: Thu, 6 Aug 2026 00:23:34 +0100 Subject: [PATCH 52/57] Update docs --- docs/assets/virtual-select.js | 992 +++++++++++++++++++++++++---- docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- 3 files changed, 878 insertions(+), 118 deletions(-) diff --git a/docs/assets/virtual-select.js b/docs/assets/virtual-select.js index 42bceeac..1e1490e8 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -198,17 +198,77 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - const tempElement = document.createElement('div'); - tempElement.style.position = 'absolute'; - tempElement.style.visibility = 'hidden'; - tempElement.style.whiteSpace = 'nowrap'; - tempElement.style.fontSize = window.getComputedStyle(container).fontSize; - tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; - tempElement.textContent = text; - document.body.appendChild(tempElement); - const textWidth = tempElement.clientWidth; - document.body.removeChild(tempElement); - return textWidth > container.clientWidth; + /** + * Called once per selected tag to decide whether that tag needs a tooltip. + * + * It used to create a div, read two separate getComputedStyle results, append it to + * , read clientWidth and remove it again - so every tag paid an element creation + * plus two DOM mutations, and each mutation invalidates layout for the read that + * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. + * + * One reusable off-screen node instead, and one getComputedStyle read for every property. + * The node stays out of flow and is aria-hidden, so it cannot affect layout or be + * announced, and it is removed once the last instance is destroyed. + */ + const $measurer = Utils.getTextMeasurer(); + const { + fontSize, + fontFamily, + fontWeight, + letterSpacing + } = window.getComputedStyle(container); + $measurer.style.fontSize = fontSize; + $measurer.style.fontFamily = fontFamily; + /** weight and tracking change advance width too, so ignoring them under-reported + * overflow and could drop a tooltip that was actually needed */ + $measurer.style.fontWeight = fontWeight; + $measurer.style.letterSpacing = letterSpacing; + $measurer.textContent = text; + return $measurer.clientWidth > container.clientWidth; + } + + /** + * Whether the user has asked the operating system to reduce motion. + * + * Read on each call rather than cached, so a preference changed after page load is picked up + * by the next instance. Guarded for environments without matchMedia. + * + * @static + * @returns {boolean} + */ + static prefersReducedMotion() { + return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; + } + + /** + * The shared, lazily created off-screen node used to measure text width. + * + * @static + * @returns {HTMLElement} + */ + static getTextMeasurer() { + if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { + const $measurer = document.createElement('div'); + $measurer.className = 'vscomp-text-measurer'; + $measurer.setAttribute('aria-hidden', 'true'); + $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; + document.body.appendChild($measurer); + Utils.$textMeasurer = $measurer; + } + return Utils.$textMeasurer; + } + + /** + * Drop the shared measuring node, so nothing of ours is left in the document once the last + * instance has gone. + * + * @static + */ + static removeTextMeasurer() { + if (Utils.$textMeasurer) { + Utils.$textMeasurer.remove(); + Utils.$textMeasurer = null; + } } /** @@ -221,6 +281,83 @@ class Utils { return text.replace(/"/g, '"'); } + /** + * Escape a *raw* string for interpolation into a double-quoted HTML attribute. + * + * Use this only where the input has not already been HTML-escaped - currently the option + * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped + * first, otherwise the `&` introduced by the quote replacement would itself be escaped and + * the attribute would parse back as a literal `"`. + * + * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped + * label text: escaping `&` there would double it and a tooltip would show `&`. That + * asymmetry is the reason this is a separate helper rather than a shared one. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static escapeAttributeValue(text) { + return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); + } + + /** + * Undo the escaping secureText() applies, recovering the text a human should read. + * + * Option label and description are stored HTML-escaped when enableSecureText is on, because + * they are inserted as HTML. Anywhere that text is consumed as *text* instead - an accessible + * name, a live-region announcement - the escape sequences have to come back off, or the user + * is read `&` and `<i class=...`. + * + * `&` is decoded last: doing it first would turn a literal `&lt;` into `<` and then + * into `<`, inventing markup the consumer never wrote. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static decodeSecureText(text) { + return Utils.getString(text).replace(/</g, '<').replace(/>/g, '>').replace(/ /g, '\u00A0').replace(/&/g, '&'); + } + + /** + * Reduce label text to the words a human should hear or read. + * + * Labels may legitimately contain markup - an icon, , a
. Wherever that text is + * consumed as text (an accessible name, a live-region announcement) the markup is meaningless + * and is read out as tag soup. Tags collapse to a single space so adjacent words do not run + * together, so "France
Paris" does not become one word. + * + * The escaping is undone first. With enableSecureText on the label arrives already escaped, so + * the tag pattern found no `<` to match and the markup passed through verbatim - the strip was + * a no-op in exactly the mode escaping is enabled in. + * + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + static getPlainText(text) { + return Utils.decodeSecureText(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); + } + + /** + * Turn a label into text that is safe and sensible inside an aria-label attribute. + * + * Plain text, then escaped for the attribute - covering `&` as well as `"`, so a bare + * ampersand in a label is a valid character reference rather than raw markup, and a double + * quote can no longer close the attribute early and truncate the name. + * + * @static + * @param {string} text + * @returns {string} + */ + static getAriaLabelText(text) { + return Utils.escapeAttributeValue(Utils.getPlainText(text)); + } + /** * @static * @param {string} text @@ -329,6 +466,13 @@ class Utils { return throttled; } } + +/** + * Shared off-screen node used to measure text width, created on first use and removed when + * the last VirtualSelect instance is destroyed. + * @type {HTMLElement | null} + */ +Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -452,6 +596,42 @@ class DomUtils { $ele.setAttribute(name, value); } + /** + * @param {HTMLElement} $ele + * @param {string} name + */ + static removeAttr($ele, name) { + if (!$ele) { + return; + } + $ele.removeAttribute(name); + } + + /** + * Set an aria-* attribute when the state applies, remove it otherwise. + * + * Preferred over writing `aria-x="false"` for states whose absence is meaningful + * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some + * screen readers still verbalise. + * + * @param {HTMLElement | NodeListOf} $ele + * @param {string} name + * @param {boolean} isSet + * @param {string} [value='true'] + */ + static toggleAria($ele, name, isSet, value = 'true') { + if (!$ele) { + return; + } + DomUtils.getElements($ele).forEach($this => { + if (isSet) { + $this.setAttribute(`aria-${name}`, value); + } else { + $this.removeAttribute(`aria-${name}`); + } + }); + } + /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -600,7 +780,21 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - html += ` ${k}="${v}" `; + /** + * Quotes are escaped here, at the attribute boundary, because this is the only place + * that knows the value is about to be wrapped in double quotes. + * + * The caller that matters is getTooltipAttrText(), which passes option labels through + * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) + * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and + * put a live attribute on the value-tag element. Escaping unconditionally here removes + * the condition, and the parser turns " back into a quote, so the attribute still + * reads back as the original string. + * + * String(), not Utils.getString(): the latter maps `false` to '', and some of these + * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). + */ + html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; } }); return html; @@ -651,6 +845,9 @@ class DomUtils { }); } } +;// ./src/utils/index.js + + ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -672,7 +869,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -708,9 +905,20 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; + /** + * These props are developer-supplied but still reach an attribute directly, and none of them + * passes through secureText() - so enableSecureText never protected them. A double quote + * closed the attribute early: the payload after it was parsed as markup, and the accessible + * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. + * + * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to + * option and group labels: strip markup, then escape quotes. Plain quote escaping for + * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide + * a caller error instead of fixing it. + */ + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -751,7 +959,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -763,6 +971,11 @@ class VirtualSelect {
+
+ +
+ ${this.renderDropbox({ wrapperClasses })} @@ -782,6 +995,25 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + + /** + * The submitting field's name is set as a DOM property, not interpolated into the template. + * + * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so + * the remainder of the value was parsed as markup (real elements, an injection) while the + * field kept only the truncated prefix - or, when the payload also swallowed the following + * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw + * inside the constructor. Either way the form silently stopped submitting the right name, + * and that included legitimate names such as `items["a"]`. + * + * A property assignment performs no HTML parsing, so there is nothing to break out of and + * nothing to escape - which is also why `name` no longer goes through secureText(): the + * escaping only ever protected this sink, and applying it here corrupted the submitted + * field name into `items["a"]`. + */ + this.$hiddenInput.name = this.name; + this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); + this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -811,7 +1043,9 @@ class VirtualSelect {
-
+
@@ -844,8 +1078,16 @@ class VirtualSelect { return html; } renderOptions() { - // Calculate ARIA metadata before rendering to ensure it's always up to date - this.calculateAriaMetadata(); + /** + * The ARIA scan walks every option, so running it per render made scrolling O(n) per + * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the + * filtered set or its order changes, never when the virtualisation window moves, so + * recompute on a dirty flag instead. Everything that alters the set marks it dirty. + */ + if (this.ariaMetadataDirty) { + this.calculateAriaMetadata(); + this.ariaMetadataDirty = false; + } let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -908,14 +1150,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - groupName = d.label; + /** carried into every child's aria-label below, so strip markup once here */ + groupName = Utils.getAriaLabelText(d.label); optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); - const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); - ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; + const selectAllText = Utils.getAriaLabelText(this.selectAllText); + ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; } } if (isSelected) { @@ -932,13 +1174,13 @@ class VirtualSelect { * 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)); + const groupNameText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); + const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); groupName = d.customData.group_name !== undefined ? `${groupNameText}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${d.label}"`; + ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; } } if (hasLabelRenderer) { @@ -964,8 +1206,23 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } + + /** + * The option value is an untrusted string going straight into an attribute, so a double + * quote in it closed data-value early and everything after it was parsed as markup - a + * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, + * whether or not enableSecureText was on. + * + * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches + * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). + * Both together keep the attribute round-tripping: the parser turns `&` and `"` + * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on + * every render anyway. + */ + const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -988,20 +1245,40 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - checkboxHtml = ` + /** + * role="checkbox" + aria-checked so the control is announced as a checkbox and its + * state changes are audible. Without them it exposed as a generic element and every + * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). + * aria-checked is kept in sync by toggleAllOptionsClass(). + */ + /** + * selectAllText has two sinks, and only the attribute one is escaped. + * + * The visible label below is rendered as HTML and that works today - `Pick all` + * produces a real - so escaping it would be a visible regression for anyone styling + * the Select All label. The accessible name, by contrast, was raw: a quote broke out of + * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same + * treatment the group-header aria-label a few methods up already applies to this exact + * prop, which is why that sink was safe while this one was not. + */ + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1132,14 +1409,29 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - if (document.activeElement === this.$toggleAllButton && key === 13) { + + /** + * Space is the expected activation key for role="checkbox"; Enter is kept for + * backwards compatibility. preventDefault stops Space from scrolling the page + * (the previous behaviour, since the key was unhandled here). + */ + if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { + e.preventDefault(); this.toggleAllOptions(); return; } - // Handle the Escape key when showing the dropdown as a popup, closing it + /** + * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). + * The element that contains the focused node differs by layout: with an external + * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be + * tested against $dropboxWrapper. In every other case - including the default + * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting + * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the + * default config, so the branch never ran and Escape did nothing. + */ if (key === 27 || e.key === 'Escape') { - const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; + const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1157,33 +1449,34 @@ class VirtualSelect { this.openDropbox(); } } - onDownArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } + + /** + * Move the highlight without moving DOM focus. + * + * Previously both arrow handlers bailed out whenever the search input had focus, to let + * the caret move. But opening the dropdown focuses the search input, so in the default + * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). + * The APG editable-combobox pattern is what applies here: Up/Down drive the list while + * focus stays in the field, and the active option is published as aria-activedescendant. + * + * @param {KeyboardEvent} e + * @param {'next' | 'previous'} direction + */ + navigateOptions(e, direction) { e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction: 'next' + direction }); } else { this.openDropbox(); } } + onDownArrowPress(e) { + this.navigateOptions(e, 'next'); + } onUpArrowPress(e) { - // Allow default behavior (cursor movement) when search input is focused - if (document.activeElement === this.$searchInput) { - return; - } - e.preventDefault(); - if (this.isOpened()) { - this.focusOption({ - direction: 'previous' - }); - } else { - this.openDropbox(); - } + this.navigateOptions(e, 'previous'); } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1220,8 +1513,24 @@ class VirtualSelect { this.reset(); } } + + /** + * Scroll fires many times per drag and each event triggered a full re-render + * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for + * the whole gesture. Coalesce into at most one re-render per animation frame; the pending + * frame is cancelled in destroy() so it cannot run against a torn-down instance. + */ onOptionsScroll() { - this.setVisibleOptions(true); + if (this.scrollAnimationFrame) { + return; + } + this.scrollAnimationFrame = requestAnimationFrame(() => { + this.scrollAnimationFrame = null; + if (this.isDestroyed) { + return; + } + this.setVisibleOptions(true); + }); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1388,6 +1697,8 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); + /** the shared text measurer is the last page-level node we own */ + Utils.removeTextMeasurer(); } } @@ -1453,6 +1764,12 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } + + /** + * Marks the end of construction. Live-region announcements are suppressed until + * here so an initial value or the first render does not speak on page load. + */ + this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1511,9 +1828,16 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - this.focusOption({ - focusFirst: true - }); + + /** a closing dropbox must not take a highlight back - see closeDropbox() */ + if (!this.isClosing) { + this.focusOption({ + focusFirst: true + }); + } + if (!this.hasServerSearch) { + this.announceSearchResults(); + } } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1536,7 +1860,19 @@ class VirtualSelect { this.setSearchValue('', false, true); } if (!keepValue) { - this.reset(); + /** + * reset() validates, and validation announces - so replacing the options used to speak a + * validation failure for an interaction the user never made. Scoped to this one call rather + * than the whole method, and released in a finally: a stuck flag would silently suppress + * every later error announcement, which is far harder to diagnose than an exception (the + * lesson from the isClosing guard in closeDropbox()). + */ + this.isRefreshingOptions = true; + try { + this.reset(); + } finally { + this.isRefreshingOptions = false; + } } } /** after event methods - end */ @@ -1599,6 +1935,14 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; + /** live-region announcement texts (see announce/getResultsCountMessage) */ + this.searchResultsText = options.searchResultsText; + this.searchResultText = options.searchResultText; + this.noOptionsSelectedText = options.noOptionsSelectedText; + this.selectedText = options.selectedText; + this.loadingText = options.loadingText; + this.requiredErrorText = options.requiredErrorText; + this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1613,7 +1957,8 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - this.name = this.secureText(options.name); + /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ + this.name = options.name; this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1635,6 +1980,16 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); + /** + * The open/close animation is driven from JS as well as CSS, so the stylesheet's + * prefers-reduced-motion rule alone would still leave the popover animating for + * showDuration/hideDuration milliseconds. Honour the preference here too. + */ + if (Utils.prefersReducedMotion()) { + this.showDuration = 0; + this.hideDuration = 0; + } + /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -1663,13 +2018,25 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property + this.isClosing = false; this.ariaSetSize = 0; + this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { + const globalDefaults = VirtualSelect.globalDefaults; + + /** + * Resolve a prop across the precedence chain for the few defaults that are derived + * from another prop, so a page-level default still drives them. + * @param {string} key + */ + const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; + const keepAlwaysOpen = resolve('keepAlwaysOpen'); + const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -1693,10 +2060,19 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', + /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ + searchResultsText: 'results available', + searchResultText: 'result available', + noOptionsSelectedText: 'No options selected', + selectedText: 'selected', + loadingText: 'Loading results', + /** validation messages; {count} in minValuesErrorText is replaced with minValues */ + requiredErrorText: 'This field is required', + minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: options.keepAlwaysOpen ? 1 : 2, + zIndex: keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -1718,11 +2094,38 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (options.hasOptionDescription) { + if (hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - return Object.assign(defaultOptions, options); + + /** + * Precedence: per-instance options > page-level globals > built-in defaults. + * Globals let a host turn a policy on once (notably enableSecureText) instead of + * repeating it at every call site, while an instance can still opt out explicitly. + */ + /** + * `undefined` means "not supplied", so those keys are dropped before merging. + * + * Object.assign copies own enumerable keys *including* ones whose value is undefined, so a prop + * forwarded from an unset variable - `enableSecureText: wrapper.sanitizeValues`, the shape a + * host wrapper naturally produces - overwrote the page-level global instead of falling back to + * it. A host could call setGlobalDefaults({ enableSecureText: true }) and still get escaping + * off at every such call site, with nothing to show it had been overridden. + * + * This also makes the merge agree with the resolve() helper above, which already treats + * undefined as absent; the two disagreed inside the same method. + */ + const supplied = source => { + const result = {}; + Object.keys(source || {}).forEach(key => { + if (source[key] !== undefined) { + result[key] = source[key]; + } + }); + return result; + }; + return Object.assign(defaultOptions, supplied(globalDefaults), supplied(options)); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -1746,6 +2149,8 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; + /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -1774,8 +2179,23 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - const valuesMapping = {}; - const valuesOrder = {}; + /** + * Option values are untrusted strings used as keys, so every value-keyed lookup in this + * file is built with Object.create(null) rather than `{}`. + * + * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object + * calls the inherited setter, which ignores a non-object value, so nothing is written and + * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns + * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups + * all compare against `true`. An option whose value is `__proto__` was therefore + * selectable by click (that path reads data-value, not a mapping) but invisible to + * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read + * back could not be restored - and under allowNewOption it was mistaken for an unknown + * value and duplicated. A null prototype has no inherited members, so an arbitrary string + * key behaves like any other. + */ + const valuesMapping = Object.create(null); + const valuesOrder = Object.create(null); let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -1838,7 +2258,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = {}; + const valuesMapping = Object.create(null); preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -1899,7 +2319,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -1933,7 +2353,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = {}; + const enabledOptionsMapping = Object.create(null); enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -1968,7 +2388,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = {}; + const disabledOptionsMapping = Object.create(null); let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -1981,8 +2401,25 @@ class VirtualSelect { [labelKey]: d }; } - const value = secureText(getString(d[valueKey])); - const label = secureText(getString(d[labelKey])); + + /** + * `value` is stored verbatim; only `label` and `description` are escaped. + * + * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` + * attribute (escaped there, at the boundary) and is otherwise only compared or used as a + * map key. Escaping it stored an identity the caller could not name - `a&b` became + * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set + * again. + * + * The normalised search keys derive from the *raw* text for the same reason: they are + * matched against what the user types into the search box, which is never HTML-escaped. + * Deriving them from the escaped text meant no query could match text containing `&`, + * `<` or `>`. + */ + const rawValue = getString(d[valueKey]); + const rawLabel = getString(d[labelKey]); + const value = rawValue; + const label = secureText(rawLabel); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -1990,7 +2427,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2008,9 +2445,10 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const description = secureText(getString(d[descriptionKey])); - option.description = description; - option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); + const rawDescription = getString(d[descriptionKey]); + option.description = secureText(rawDescription); + /** normalised from the raw text, so a query containing `&` can match - see above */ + option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2056,7 +2494,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = {}; + const newOptionsValueMapping = Object.create(null); optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2090,11 +2528,18 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); + + /** replace the "loading" message with the outcome of the fetch */ + if (this.isInitialized) { + this.announce(this.getResultsCountMessage()); + } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { + /** order drives aria-posinset */ + this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2178,8 +2623,26 @@ class VirtualSelect { DomUtils.toggleClass(this.$allWrappers, 'max-value-selected', this.isMaxValuesSelected); DomUtils.setAttr(this.$clearButton, 'tabindex', hasValue ? '0' : '-1'); DomUtils.setAria(this.$clearButton, 'hidden', hasValue === false); + let isValid = true; if (!disableValidation) { - this.validate(); + isValid = this.validate(); + } + + /** + * Selection changes are otherwise conveyed only by the (visual) value text. + * Guarded on isInitialized so a value supplied at construction time is not + * announced before the user has interacted with anything. + * + * Skipped when validation just failed. validate() announces its message through the same + * polite region, and a polite region is read from its *final* content - so announcing the + * selection summary here overwrote the validation message in the same tick and the user + * never heard it. That silenced every interactive path (the clear button, deselecting below + * minValues) while still setting aria-invalid and showing the message on screen, which is + * the 3.3.1 failure this region exists to fix. The error is the more urgent of the two, and + * it already implies the selection state. + */ + if (this.isInitialized && isValid) { + this.announce(this.getSelectionMessage()); } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); @@ -2227,11 +2690,13 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) + /** markup in the label would otherwise land in the accessible name; a double + * quote in it would break out of the attribute entirely */ let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; + const stripHtmlLabel = Utils.getAriaLabelText(label); + const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2377,6 +2842,14 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; + /** + * Number of options matching the current filter. Kept separately because + * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered + * virtualisation window, which is not what a "N results available" message means. + */ + this.filteredOptionsCount = visibleOptionsCount; + /** isVisible changed for the whole set, so positions and setsize must be recomputed */ + this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2465,10 +2938,15 @@ class VirtualSelect { if (!value) { return; } + + /** adds a row to the filtered set */ + this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - this.setOptionProp(newIndex, 'value', this.secureText(value)); + + /** value verbatim, label escaped - the label is the only one rendered as HTML */ + this.setOptionProp(newIndex, 'value', value); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2485,7 +2963,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2501,7 +2979,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = {}; + const availableValuesMapping = Object.create(null); this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -2596,7 +3074,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = {}; + const valuesMapping = Object.create(null); let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -2671,9 +3149,11 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; + /** quotes are escaped unconditionally by getAttributesText(); escaping again here would + * leave a literal " in the tooltip, and the old containsHTML() condition is what + * let a tag-free payload through in the first place */ const data = { - 'data-tooltip': tootltipText || '', + 'data-tooltip': text || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -2697,17 +3177,18 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - const value = secureText(getString(data.value)); - const label = secureText(getString(data.label)); - const description = secureText(getString(data.description)); + /** value stored verbatim, search keys derived from the raw text - see setOptions() */ + const rawValue = getString(data.value); + const rawLabel = getString(data.label); + const rawDescription = getString(data.description); return { index: data.index, - value, - valueNormalized: value.toLowerCase(), - label, - labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), - description, - descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), + value: rawValue, + valueNormalized: rawValue.toLowerCase(), + label: secureText(rawLabel), + labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + description: secureText(rawDescription), + descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -2733,7 +3214,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = {}; + const valuesMapping = Object.create(null); this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -2791,7 +3272,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = {}; + const valuesOrder = Object.create(null); selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -2805,7 +3286,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = {}; + const disabledOptionsValueMapping = Object.create(null); const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -2943,6 +3424,8 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); + /** the search input is its own combobox over the listbox, so it needs the state too */ + DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3002,9 +3485,22 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$wrapper, 'activedescendant', ''); - // Also clear aria-activedescendant on the listbox container - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); + DomUtils.setAria(this.$searchInput, 'expanded', false); + /** + * No option is active once the list is gone - and the highlight has to go with it, + * here, synchronously. + * + * afterHidePopper() already calls removeOptionFocus(), but for popover-backed + * instances it only runs when the hide transition ends (~200ms later). Until then the + * previous highlight and `focusedOptionIndex` survived the close, so reopening within + * that window resumed navigation from the old position instead of the first option: + * the next Up/Down moved one step past where the user expected, which on a grouped + * multi-select meant Enter landed on the first child option instead of toggling the + * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving + * the afterHidePopper() call in place costs nothing and still covers the silent path. + */ + this.removeOptionFocus(); + this.setActiveDescendant(''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3017,7 +3513,26 @@ class VirtualSelect { } else { this.afterHidePopper(); } - this.setSearchValue(''); + + /** + * Clearing the filter runs afterSetSearchValue(), which highlights the first visible + * option again. That undid the removeOptionFocus() above whenever the user had typed + * something: the highlight and aria-activedescendant came straight back on a combobox + * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option + * that is about to be display:none - so the keyboard position ended up on . + * + * isClosing is scoped to this one call rather than the whole method because everything + * above it (the wrapper refocus in particular) still needs the real state. The reset runs + * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the + * highlight coming back after *every* later filter clear, which is far harder to diagnose + * than the exception itself. + */ + this.isClosing = true; + try { + this.setSearchValue(''); + } finally { + this.isClosing = false; + } } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3372,7 +3887,14 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + const isChecked = isAllSelected || isAllVisibleSelected; + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); + /** + * Mirror the visual checked state onto the role="checkbox" host. This is the single + * point every selection path funnels through (select all, deselect all, per-option + * clicks, group toggles, setValue, reset), so the exposed state cannot drift. + */ + DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3420,7 +3942,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = {}; + const valuesMapping = Object.create(null); const { removeItemFromArray } = Utils; @@ -3465,7 +3987,15 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - if (this.focusedOptionIndex) { + /** + * Explicitly against null, not truthiness. focusedOptionIndex comes from + * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a + * truthiness test happens to pass for the first option. Normalise it to a number anywhere + * and index 0 would stop being cleared, so its `isFocused` prop would survive - and + * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the + * stale highlight back through the data path on the next render. + */ + if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -3494,7 +4024,18 @@ class VirtualSelect { }); this.afterValueSet(); if (formReset) { + /** + * A native form reset clears the error state, not just the colour that showed it. + * + * Removing `has-error` alone left aria-invalid="true" on the combobox and + * aria-describedby pointing at an error element that still held its text - so the control + * stayed announced as invalid, describing a message the user could no longer see, with no + * interaction able to clear it. setErrorMessage('') empties the text and drops + * aria-describedby, and does not announce (it only announces a non-empty message). + */ DomUtils.removeClass(this.$allWrappers, 'has-error'); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); } DomUtils.dispatchEvent(this.$ele, 'reset'); } @@ -3524,6 +4065,8 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { + /** removes a row from the filtered set */ + this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -3643,6 +4186,9 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); + + /** the spinner is a visual-only cue; announce that a fetch is in flight */ + this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -3677,18 +4223,67 @@ class VirtualSelect { return true; } let hasError = false; + let errorText = ''; const { selectedValues, minValues } = this; - if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ - this.multiple && minValues && selectedValues.length < minValues))) { - hasError = true; + if (this.required) { + if (Utils.isEmpty(selectedValues)) { + hasError = true; + errorText = this.requiredErrorText; + } else if (this.multiple && minValues && selectedValues.length < minValues) { + /** required minium options not selected */ + hasError = true; + errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); + } } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + + /** + * Previously the only signal was the `has-error` class recolouring the toggle button + * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. + * Expose the state (aria-invalid), give it a text message, point the combobox at that + * message (aria-describedby) and announce it. + */ + DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); + this.setErrorMessage(hasError ? errorText : ''); return !hasError; } + /** + * Show or clear the validation message and its association with the combobox. + * An empty message removes aria-describedby rather than pointing at empty text. + * + * @param {string} message + */ + setErrorMessage(message) { + if (!this.$errorMessage) { + return; + } + const text = message || ''; + this.$errorMessage.textContent = text; + DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); + + /** + * The message is shown and exposed unconditionally, but only *announced* for something the + * user did. A live region is for status changes they caused. + * + * isInitialized keeps construction quiet: the initial setValueMethod() runs before that flag + * is set, so a page supplied with an invalid initial value used to load already speaking + * "Select at least 2 options". isRefreshingOptions keeps a programmatic data swap quiet: + * afterSetOptions() calls reset(), which validates, so replacing the options announced a + * failure for a field the user had never touched. + * + * Both are deliberately narrow. The interactive paths - the clear button, deselecting below + * minValues, and an explicit validate() from the application - must still announce, which is + * the whole point of routing validation through this region. + */ + if (text && this.isInitialized && !this.isRefreshingOptions) { + this.announce(text); + } + } + /** * 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). @@ -3739,6 +4334,12 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); + // Drop any queued scroll re-render so it cannot touch detached DOM + if (this.scrollAnimationFrame) { + cancelAnimationFrame(this.scrollAnimationFrame); + this.scrollAnimationFrame = null; + } + /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -3767,8 +4368,20 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ - this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); + + /** + * escape potentially harmful markup so label/value/description cannot trigger XSS. + * + * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML + * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as + * `The &quot;City&quot; of Light`, shown to the user as `The "City" of + * Light`, and made unsearchable, because labelNormalized derives from the stored text. + * Quotes only need escaping inside an attribute, and that now happens at each attribute + * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also + * covers the sinks this pre-escaping never reached, such as an attribute written while + * enableSecureText is off. + */ + this.$secureText.nodeValue = text; return this.$secureDiv.innerHTML; } @@ -3789,9 +4402,87 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } + + /** + * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). + * + * Identical consecutive messages are intentionally left alone: re-writing the same text + * produces no DOM mutation, so assistive technology does not repeat "No results found" + * on every further keystroke that still matches nothing. + * + * @param {string} message + */ + announce(message) { + if (!this.$liveRegion) { + return; + } + + /** + * Reduced to plain text because the region is written with textContent, so whatever is put + * there is read out literally. A single select announces the chosen label, and a label can + * carry both escaping and markup: with enableSecureText on the region said + * "Tom & Jerry selected", and decoding alone would only have turned that into + * " France selected". Neither is speech. Messages the component composes + * itself contain no markup, so this is a no-op for them. + */ + const text = Utils.getPlainText(message || ''); + if (this.$liveRegion.textContent !== text) { + this.$liveRegion.textContent = text; + } + } + + /** + * Message describing how many options the current filter matched. + * @returns {string} + */ + getResultsCountMessage() { + const count = this.filteredOptionsCount || 0; + if (count === 0) { + return this.noSearchResultsText; + } + return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; + } + + /** + * Message describing the current selection. + * @returns {string} + */ + getSelectionMessage() { + const count = this.selectedValues.length; + if (count === 0) { + return this.noOptionsSelectedText; + } + if (this.multiple) { + return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; + } + + /** option flags are updated before setValue(), so the label is already current */ + const label = this.getDisplayValue() || this.selectedValues[0]; + return `${label} ${this.selectedText}`; + } + + /** + * Announce the match count, but only while the user is actually searching. + * setSearchValue('') also runs on close and after a value is set; announcing there + * would read a stale count into the user's ear for an interaction they did not make. + */ + announceSearchResults() { + if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { + return; + } + this.announce(this.getResultsCountMessage()); + } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; + DomUtils.toggleAria(this.$allWrappers, 'required', this.required); + + /** dropping the requirement also drops any error it produced */ + if (!this.required) { + DomUtils.toggleClass(this.$allWrappers, 'has-error', false); + DomUtils.toggleAria(this.$allWrappers, 'invalid', false); + this.setErrorMessage(''); + } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -3807,17 +4498,83 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - if (document.activeElement !== this.$searchInput) { + + /** + * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it + * had just un-highlighted, which is either pointless (focusOption immediately focuses the + * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is + * about to be hidden, fighting the wrapper refocus in closeDropbox(). + */ + if (isFocused && document.activeElement !== this.$searchInput) { $ele.focus(); } - if (isFocused) { - DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); - // Also set aria-activedescendant on the listbox container for better screen reader support - DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); - } + + /** + * Publish the highlight on the elements that can carry it: the wrapper and the search + * input, both role="combobox". It used to also go on $dropboxContainer, a plain div + * with no role, where aria-activedescendant is meaningless - and never on the search + * input, which is the element that actually holds focus while navigating. + */ + this.setActiveDescendant(isFocused ? $ele.id : ''); + } + + /** + * Point the combobox elements at the active option, or clear the reference. + * @param {string} optionId + */ + setActiveDescendant(optionId) { + DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); + DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); } /** static methods - start */ + + /** + * Set page-level default props applied to every instance created afterwards. + * + * The motivating case is security: option text is interpolated into innerHTML and is only + * escaped when `enableSecureText` is on, which it is not by default (escaping costs per + * option, and large trusted lists should not pay for it). A host that does render + * untrusted option text can turn escaping on once here rather than at every call site: + * + * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + * + * These are defaults, not overrides: an instance passing the prop explicitly still wins, + * so a host forwarding `enableSecureText` on every init must stop doing so (or forward + * `true`) for this to take effect. Calls merge, so features can be configured separately. + * Only instances created after the call are affected. + * + * @param {Partial} props + */ + static setGlobalDefaults(props) { + if (!props || typeof props !== 'object') { + VirtualSelect.globalDefaults = {}; + return; + } + + /** `ele` and `options` are per-instance by nature and would alias state across instances */ + const safeProps = { + ...props + }; + delete safeProps.ele; + delete safeProps.options; + VirtualSelect.globalDefaults = { + ...VirtualSelect.globalDefaults, + ...safeProps + }; + } + + /** + * Currently active page-level defaults. + * A copy, so callers cannot mutate the live object. + * + * @returns {Partial} + */ + static getGlobalDefaults() { + return { + ...VirtualSelect.globalDefaults + }; + } static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4048,6 +4805,9 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; +// Page-level default props, applied under per-instance options (see setGlobalDefaults) +VirtualSelect.globalDefaults = {}; + /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 29fc53eb..7257fcff 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index 5ab3dec1..b1e55d59 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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)}static sanitizeClassNames(e){return e?String(e).replace(/["<>]/g,""):e}static throttle(e,t){let s,i=null,o=[],n=0;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); + */!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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static decodeSecureText(e){return t.getString(e).replace(/</g,"<").replace(/>/g,">").replace(/ /g," ").replace(/&/g,"&")}static getPlainText(e){return t.decodeSecureText(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim()}static getAriaLabelText(e){return t.escapeAttributeValue(t.getPlainText(e))}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){if(e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),!e){this.isRefreshingOptions=!0;try{this.reset()}finally{this.isRefreshingOptions=!1}}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px");const o=e=>{const t={};return Object.keys(e||{}).forEach(s=>{void 0!==e[s]&&(t[s]=e[s])}),t};return Object.assign(i,o(t),o(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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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);let l=!0;o||(l=this.validate()),this.isInitialized&&l&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage("")),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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const s=t.getPlainText(e||"");this.$liveRegion.textContent!==s&&(this.$liveRegion.textContent=s)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 From e4da35a285052e25deb119f8eb3111efdaec20ea Mon Sep 17 00:00:00 2001 From: gnbm Date: Thu, 6 Aug 2026 00:35:25 +0100 Subject: [PATCH 53/57] test(perf): reach the last-instance state without tearing down the page (AI-27) My WR-15 fix hung the Cypress runner. It created the "last instance destroyed" state by destroying every active instance, including the two the docs page owns, and the run stopped dead on that case with nothing printed after it. The mechanism is unexplained and is not in the component. Replayed outside Cypress against the built bundle, that same teardown is clean: three destroys, no throw, no re-entry, no page error, the shared MutationObserver and the page-level listeners both released, the measurer node removed and nothing left tagged .vscomp-ele. So something about destroying the AUT page's own components from inside a test upsets the runner rather than the code under test. Noted as unknown rather than guessed at - and worth not repeating. The other route is better anyway: mount on a docs page that has no demos of its own, and our instance is genuinely the last one, so plain unmountVs() reaches the state the case is named for. Measured instances per page - properties 0 (with 13.7k characters of real content, so it is a real page and loads the same bundle), methods 0, get-started 2, events 3. This uses properties. Nothing outside the test is torn down now, and the precondition is asserted rather than assumed: if that page ever gains a demo, the case fails loudly instead of quietly going vacuous again, which was the original defect. Verified 7/7 in a real browser: the page starts with no instances, the measurer appears once a tag is measured, our mount is the only instance, unmounting reaches zero, the node is removed, the shared observer and global listeners go with it, and the docs page is left intact. tsc and prettier pass. --- cypress/e2e/perf-text-measurer.cy.ts | 46 +++++++++++++++++----------- 1 file changed, 28 insertions(+), 18 deletions(-) diff --git a/cypress/e2e/perf-text-measurer.cy.ts b/cypress/e2e/perf-text-measurer.cy.ts index 43fdf280..119d5cd1 100644 --- a/cypress/e2e/perf-text-measurer.cy.ts +++ b/cypress/e2e/perf-text-measurer.cy.ts @@ -64,30 +64,40 @@ describe('Perf: one shared text measurer', { testIsolation: true }, () => { cy.window().then((win) => unmountVs(win, mountId)); }); + /** + * The one case that needs to be the *only* instance on the page, so it mounts on a docs page + * that hosts no demos of its own. + * + * `get-started` keeps two instances alive, which is why this case used to be written as + * `if (remaining === 0) { ...assert... }` — a condition that is false on every run, so its only + * assertion was skipped every time: it reported green while verifying nothing, and + * `Utils.removeTextMeasurer()` was never exercised at all. + * + * Destroying the page's own instances to force the condition works in a plain browser but hangs + * the Cypress runner, so this takes the other route: `properties` renders real content, loads + * the same bundle and starts with zero instances (measured), which makes our mount genuinely the + * last one. Nothing outside this test is torn down, and the precondition is asserted rather than + * assumed — if that page ever gains a demo, this fails loudly instead of going quiet again. + */ it('removes the measurer once the last instance is destroyed', () => { - mount(); + cy.viewport(1280, 800); + cy.visit('properties'); + + cy.window().should((win) => { + // @ts-expect-error - bundle global + expect(win.VirtualSelect.activeInstances.size, 'this page hosts no instances of its own').to.equal(0); + }); + + cy.window().then((win) => + mountVs(win, mountId, { options: makeOptions(5), multiple: true, showValueAsTags: true }), + ); + cy.get(`#${mountId}`).find('.vscomp-toggle-button').click(); cy.get(`#${mountId}`).find('.vscomp-option[data-value="o1"]').click(); cy.get('.vscomp-text-measurer').should('exist'); cy.window().then((win) => unmountVs(win, mountId)); - /** - * The docs page hosts its own instances, so unmounting ours does not reach the state this - * case is named for. It used to *test* for that state — `if (remaining === 0)` — which is - * false on every run, so its only assertion was skipped every time: the case reported green - * while verifying nothing, and `Utils.removeTextMeasurer()` was never exercised. - * - * Create the state instead of waiting for it. Safe to tear the page down here: this describe - * runs with `testIsolation: true`, so the next case gets a fresh page, and this is the last - * case in the file either way. - */ - cy.window().then((win) => { - // @ts-expect-error - bundle global - const instances = Array.from(win.VirtualSelect.activeInstances) as Array<{ destroy: () => void }>; - - expect(instances, 'the docs page has instances to destroy').to.have.length.greaterThan(0); - instances.forEach((vs) => vs.destroy()); - + cy.window().should((win) => { // @ts-expect-error - bundle global expect(win.VirtualSelect.activeInstances.size, 'no instances left').to.equal(0); }); From cbdc5dec04c6f9c099c0b7a11a638c58803b329f Mon Sep 17 00:00:00 2001 From: gnbm Date: Thu, 6 Aug 2026 11:37:06 +0100 Subject: [PATCH 54/57] fix(a11y): keep status text out of the accessible name, settle the nested combobox (AI-28) Three findings from a review of the whole branch diff. All three are in this branch's own additions rather than in pre-existing code: each ships a new public surface - a DOM node, an ARIA role, a static method - and each had a defect in that new surface. Two of them also close questions this branch had left open as design calls, which matters more than the fixes themselves. 1. The live region (AI-6) and the validation message (AI-4) were rendered inside .vscomp-wrapper, which carries role="combobox". An unlabelled combobox is named from its contents, and visually-hidden text still counts toward that computation - so the field's own accessible name absorbed the search result count and changed as the user typed. Both nodes are now siblings of the wrapper, inside the host element. The aria-describedby association and the role="status" announcement are unaffected; neither depends on nesting. The reveal rule becomes a sibling selector, so the stylesheet delta stays at five hunks - the rule changed shape, none was added. 2. The search input is no longer a second role="combobox". AI-7 gave it the role while the wrapper kept it for the closed control; the nesting was flagged twice as an open question and deferred to AI-13. It did not need AI-13 - the resolution is a subtraction. Everything the navigation depends on (aria-autocomplete, aria-controls, aria-activedescendant) is supported by the implicit textbox role, and aria-expanded, which is not, is dropped. This closes WR-08 by removing the class of bug rather than re-syncing the state: the input's aria-expanded was hard-coded false and updated only in the open/close paths, neither of which runs under keepAlwaysOpen, so the wrapper reported true while the input reported false for the same listbox. The review proposed writing both elements from one place; deleting one of the two writers leaves no second state to drift. 3. setGlobalDefaults() ignores a non-object instead of clearing every default, and resetGlobalDefaults() is added for explicit clearing. This settles the two questions left open under WR-10 while the API is still unreleased. Wiping a page-wide security policy is the worst outcome for what is usually a host forwarding an unset config variable; and {} meaning "clear" would make a merge method inconsistent with itself. A single key can still be cleared by passing it as undefined, which is the contract AI-25 established, so the two mechanisms now agree. Verified as one red-then-green cycle, not three, so the commit matches the verification boundary rather than being subdivided after the fact: 6 assertions failing first, all green after. WR-08's new keepAlwaysOpen case was separately confirmed red against a build with the two attributes restored - the failure message is the contradiction itself. Full suite green for the first time: 406/406 across 25 specs, including the 54 security cases that had only ever been verified by driving a browser. Cypress could not start on this machine because the editor host exports ELECTRON_RUN_AS_NODE=1, which makes the Electron binary run as plain Node and reject its own flags; env -u ELECTRON_RUN_AS_NODE works. eslint, stylelint and tsc clean. No build output committed. --- cypress/e2e/a11y-live-region.cy.ts | 7 +++ cypress/e2e/a11y-required-error.cy.ts | 10 ++++ .../e2e/a11y-search-arrow-navigation.cy.ts | 39 +++++++++++-- cypress/e2e/security-global-defaults.cy.ts | 37 +++++++++++- docs/methods.md | 3 + src/sass/partials/virtual-select.scss | 5 +- src/virtual-select.js | 58 ++++++++++++++----- 7 files changed, 134 insertions(+), 25 deletions(-) diff --git a/cypress/e2e/a11y-live-region.cy.ts b/cypress/e2e/a11y-live-region.cy.ts index df509e57..d66240c4 100644 --- a/cypress/e2e/a11y-live-region.cy.ts +++ b/cypress/e2e/a11y-live-region.cy.ts @@ -49,6 +49,13 @@ describe('A11y: status announcements via a live region', () => { it('starts empty so nothing is announced on page load', () => { liveRegion().should('have.text', ''); }); + + it('sits outside the combobox element, so it cannot leak into its accessible name', () => { + // Visually-hidden text inside a combobox that has no aria-label still joins the + // combobox's name-from-contents computation; a sibling of the combobox cannot. + liveRegion().should('have.length', 1); + cy.get(`#${mountId}`).find('[role="combobox"] .vscomp-live-region').should('not.exist'); + }); }); context('search results', () => { diff --git a/cypress/e2e/a11y-required-error.cy.ts b/cypress/e2e/a11y-required-error.cy.ts index 39ac563a..0d5dac79 100644 --- a/cypress/e2e/a11y-required-error.cy.ts +++ b/cypress/e2e/a11y-required-error.cy.ts @@ -74,6 +74,16 @@ describe('A11y: required and error state are exposed', () => { errorMessage().should('have.text', 'This field is required'); }); + it('renders the message outside the combobox element, so it cannot leak into its accessible name', () => { + // aria-describedby is the association; the text itself must not also sit inside the + // combobox, where it would join a name-from-contents computation for instances + // mounted without an aria-label. + validate(); + + errorMessage().should('be.visible'); + cy.get(`#${mountId}`).find('[role="combobox"] .vscomp-error-message').should('not.exist'); + }); + it('associates the message with the combobox via aria-describedby', () => { validate(); diff --git a/cypress/e2e/a11y-search-arrow-navigation.cy.ts b/cypress/e2e/a11y-search-arrow-navigation.cy.ts index 6c529337..05e6f91d 100644 --- a/cypress/e2e/a11y-search-arrow-navigation.cy.ts +++ b/cypress/e2e/a11y-search-arrow-navigation.cy.ts @@ -28,6 +28,7 @@ describe('A11y: arrow-key navigation from the search input', { testIsolation: tr const mountId = 'vs-a11y-search-arrows'; const searchInput = () => cy.get(`#${mountId}`).find('.vscomp-search-input'); + const wrapper = () => cy.get(`#${mountId}`).find('.vscomp-wrapper'); const listbox = () => cy.get(`#${mountId}`).find('.vscomp-options-container'); const focusedOption = () => cy.get(`#${mountId}`).find('.vscomp-option.focused'); @@ -62,8 +63,12 @@ describe('A11y: arrow-key navigation from the search input', { testIsolation: tr open(); }); - it('is a combobox controlling the listbox', () => { - searchInput().should('have.attr', 'role', 'combobox'); + it('drives the listbox as a plain textbox, not a second combobox', () => { + // The wrapper is already the combobox; a combobox nested inside a combobox is the + // kind of structure screen readers disagree on. The input keeps the wiring — + // aria-autocomplete, aria-controls, aria-activedescendant — on its implicit + // textbox role, which supports all three. + searchInput().should('not.have.attr', 'role'); searchInput().should('have.attr', 'aria-autocomplete', 'list'); listbox() @@ -74,12 +79,16 @@ describe('A11y: arrow-key navigation from the search input', { testIsolation: tr }); }); - it('reports the expanded state', () => { - searchInput().should('have.attr', 'aria-expanded', 'true'); + it('leaves the expanded state to the combobox wrapper', () => { + // aria-expanded is not a supported property of a textbox; the wrapper combobox + // is the single element that reports it. + searchInput().should('not.have.attr', 'aria-expanded'); + wrapper().should('have.attr', 'aria-expanded', 'true'); searchInput().type('{esc}'); - searchInput().should('have.attr', 'aria-expanded', 'false'); + wrapper().should('have.attr', 'aria-expanded', 'false'); + searchInput().should('not.have.attr', 'aria-expanded'); }); it('does not publish the highlight on the role-less dropbox container', () => { @@ -90,6 +99,24 @@ describe('A11y: arrow-key navigation from the search input', { testIsolation: tr }); }); + context('keepAlwaysOpen', () => { + /** + * The second combobox could not keep its state in sync in this layout: `aria-expanded` was + * rendered hard-coded as `false` on the input and only ever updated inside the non-silent + * branches of openDropbox()/closeDropbox(), neither of which runs when the dropbox is always + * open. The input therefore reported the listbox collapsed while it was visible and + * navigable, contradicting the wrapper on the same listbox (WCAG 4.1.2). + * + * Having one carrier of the state removes the class of bug rather than re-syncing it. + */ + it('reports one expanded state for the listbox, on the wrapper alone', () => { + mount({ keepAlwaysOpen: true }); + + wrapper().should('have.attr', 'aria-expanded', 'true'); + searchInput().should('not.have.attr', 'aria-expanded'); + }); + }); + context('ArrowDown / ArrowUp', () => { beforeEach(() => { mount(); @@ -193,7 +220,7 @@ describe('A11y: arrow-key navigation from the search input', { testIsolation: tr cy.get(`#${mountId}`).then(($e) => { expect($e[0].virtualSelect.selectedValues).to.have.members(['o1', 'o2']); }); - searchInput().should('have.attr', 'aria-expanded', 'true'); + wrapper().should('have.attr', 'aria-expanded', 'true'); }); }); diff --git a/cypress/e2e/security-global-defaults.cy.ts b/cypress/e2e/security-global-defaults.cy.ts index 7b7cd2c4..b5ea93b1 100644 --- a/cypress/e2e/security-global-defaults.cy.ts +++ b/cypress/e2e/security-global-defaults.cy.ts @@ -43,11 +43,10 @@ describe('Security: global defaults for enableSecureText', () => { const resetGlobals = (win: Window) => { /** * `setGlobalDefaults()` merges, so `{}` cannot clear a key an earlier test set, and nothing - * reloads the page to do it for us. Supplying `undefined` is exactly what the merge treats as - * "not supplied", so the built-in defaults are back in force. + * reloads the page to do it for us. resetGlobalDefaults() is the explicit clearing API. */ // @ts-expect-error - VirtualSelect is attached to window by the bundle - win.VirtualSelect.setGlobalDefaults({ enableSecureText: undefined, placeholder: undefined }); + win.VirtualSelect.resetGlobalDefaults(); }; const mountWithPayload = (win: Window, marker: string, extra: Record = {}) => @@ -202,6 +201,38 @@ describe('Security: global defaults for enableSecureText', () => { }); }); + it('ignores a non-object argument instead of wiping the configured policy', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true }); + + // A host accidentally forwarding an unset config variable must not silently turn + // page-wide escaping off; clearing is an explicit act (resetGlobalDefaults). + // @ts-expect-error - bundle global, deliberately wrong argument + win.VirtualSelect.setGlobalDefaults(undefined); + // @ts-expect-error - bundle global, deliberately wrong argument + win.VirtualSelect.setGlobalDefaults(null); + // @ts-expect-error - bundle global, deliberately wrong argument + win.VirtualSelect.setGlobalDefaults('enableSecureText'); + + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults().enableSecureText).to.eq(true); + }); + }); + + it('clears every configured default only through the explicit resetGlobalDefaults()', () => { + cy.window().then((win) => { + // @ts-expect-error - bundle global + win.VirtualSelect.setGlobalDefaults({ enableSecureText: true, placeholder: 'Pick one' }); + + // @ts-expect-error - bundle global + win.VirtualSelect.resetGlobalDefaults(); + + // @ts-expect-error - bundle global + expect(win.VirtualSelect.getGlobalDefaults()).to.deep.equal({}); + }); + }); + it('suppresses the insecure-by-default console warning when the global default is on', () => { const marker = newMarker(); diff --git a/docs/methods.md b/docs/methods.md index 45075e7a..0ef28624 100644 --- a/docs/methods.md +++ b/docs/methods.md @@ -292,5 +292,8 @@ Notes: - Only instances created **after** the call are affected. Call it before initialising dropdowns. - Calls **merge**, so unrelated settings can be configured separately. - `ele` and `options` are ignored, being inherently per-instance. +- A non-object argument (e.g. an accidentally-unset variable) is **ignored**, so a page-wide + policy cannot be wiped by mistake. To clear a single key, pass it with the value `undefined`; + to clear everything, call `VirtualSelect.resetGlobalDefaults()`. Read the current values with `VirtualSelect.getGlobalDefaults()`, which returns a copy. diff --git a/src/sass/partials/virtual-select.scss b/src/sass/partials/virtual-select.scss index d23b8f32..88be7466 100755 --- a/src/sass/partials/virtual-select.scss +++ b/src/sass/partials/virtual-select.scss @@ -603,8 +603,11 @@ /** * The message is the non-colour cue required by WCAG 1.4.1: the border tint alone * carried the whole meaning before. The leading glyph adds a second, shape-based cue. + * + * A sibling selector because the message lives *outside* the wrapper: inside it, the + * text would join the combobox's name-from-contents computation (see renderWrapper). */ - .vscomp-error-message { + ~ .vscomp-error-message { display: flex; } } diff --git a/src/virtual-select.js b/src/virtual-select.js index 49e8e1ba..cb040ed1 100644 --- a/src/virtual-select.js +++ b/src/virtual-select.js @@ -217,13 +217,13 @@ export class VirtualSelect {
-
+ ${this.renderDropbox({ wrapperClasses })} +
-
+
- ${this.renderDropbox({ wrapperClasses })} -
`; +
`; this.$ele.innerHTML = html; this.$body = document.querySelector('body'); @@ -260,6 +260,14 @@ export class VirtualSelect { * field name into `items["a"]`. */ this.$hiddenInput.name = this.name; + + /** + * Both live outside the wrapper, as siblings, because the wrapper is the combobox: for an + * instance mounted without ariaLabelText/ariaLabelledby the combobox takes its accessible + * name from its contents, and visually-hidden text still joins that computation - so a + * status update or validation message inside it would be read as part of the field's *name*. + * A sibling can be announced (live region) or associated (aria-describedby) without that. + */ this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); this.$dropbox = this.$dropboxContainer.querySelector('.vscomp-dropbox'); @@ -557,7 +565,7 @@ export class VirtualSelect { ×`; } @@ -2971,9 +2979,14 @@ export class VirtualSelect { DomUtils.setStyle(this.$dropboxContainer, 'display', 'inline-flex'); } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); + /** + * The wrapper is the one combobox and the one carrier of aria-expanded. The search + * input deliberately is not a second combobox: nesting one combobox inside another is + * a structure screen readers disagree on, and aria-expanded is not a supported state + * of the input's implicit textbox role - which does support the wiring the input + * needs (aria-autocomplete, aria-controls, aria-activedescendant). + */ DomUtils.setAria(this.$wrapper, 'expanded', true); - /** the search input is its own combobox over the listbox, so it needs the state too */ - DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); @@ -3051,7 +3064,6 @@ export class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$searchInput, 'expanded', false); /** * No option is active once the list is gone - and the highlight has to go with it, * here, synchronously. @@ -4237,16 +4249,18 @@ export class VirtualSelect { } /** - * Publish the highlight on the elements that can carry it: the wrapper and the search - * input, both role="combobox". It used to also go on $dropboxContainer, a plain div - * with no role, where aria-activedescendant is meaningless - and never on the search - * input, which is the element that actually holds focus while navigating. + * Publish the highlight on the elements that can carry it: the wrapper (the combobox) + * and the search input (a textbox, which also supports aria-activedescendant). It used + * to also go on $dropboxContainer, a plain div with no role, where aria-activedescendant + * is meaningless - and never on the search input, which is the element that actually + * holds focus while navigating. */ this.setActiveDescendant(isFocused ? $ele.id : ''); } /** - * Point the combobox elements at the active option, or clear the reference. + * Point the combobox wrapper and the search input at the active option, or clear the + * reference. * @param {string} optionId */ setActiveDescendant(optionId) { @@ -4274,8 +4288,14 @@ export class VirtualSelect { * @param {Partial} props */ static setGlobalDefaults(props) { + /** + * A non-object is ignored, not treated as "clear": a host forwarding an accidentally + * unset config variable would otherwise silently turn a page-wide security policy off. + * Clearing is an explicit act - resetGlobalDefaults(). A key can still be cleared + * individually by passing it with the value `undefined`, which setDefaultProps() + * treats as "not supplied". + */ if (!props || typeof props !== 'object') { - VirtualSelect.globalDefaults = {}; return; } @@ -4287,6 +4307,14 @@ export class VirtualSelect { VirtualSelect.globalDefaults = { ...VirtualSelect.globalDefaults, ...safeProps }; } + /** + * Drop every page-level default, restoring the built-in ones for instances created + * afterwards. The explicit counterpart to setGlobalDefaults(), which only ever merges. + */ + static resetGlobalDefaults() { + VirtualSelect.globalDefaults = {}; + } + /** * Currently active page-level defaults. * A copy, so callers cannot mutate the live object. From a2e41b7f150e2612d83554126b119450a5ad3c11 Mon Sep 17 00:00:00 2001 From: gnbm Date: Fri, 7 Aug 2026 09:00:34 +0100 Subject: [PATCH 55/57] chore: re-pin docs/assets to master, it was committed again `.github/README.md` requires that build files are not committed in a PR, only generated for a release, and 6762b0c re-pinned all eight of them for that reason. `8f280c1 Update docs` then committed the three `docs/assets/` artefacts again, which is what the review flagged: a minified diff in the PR, and a bundle that goes stale against `src/` as soon as the next source commit lands. Restored to master's content. `dist/`, `dist-archive/` and `docs/assets/` all show as modified after a local `npm run build` - that is the correct state on a feature branch, not something to commit. The release procedure in `.github/README.md` regenerates them after the version bump. --- docs/assets/virtual-select.js | 992 ++++------------------------- docs/assets/virtual-select.min.css | 2 +- docs/assets/virtual-select.min.js | 2 +- 3 files changed, 118 insertions(+), 878 deletions(-) diff --git a/docs/assets/virtual-select.js b/docs/assets/virtual-select.js index 1e1490e8..42bceeac 100644 --- a/docs/assets/virtual-select.js +++ b/docs/assets/virtual-select.js @@ -198,77 +198,17 @@ class Utils { * @memberof Utils */ static willTextOverflow(container, text) { - /** - * Called once per selected tag to decide whether that tag needs a tooltip. - * - * It used to create a div, read two separate getComputedStyle results, append it to - * , read clientWidth and remove it again - so every tag paid an element creation - * plus two DOM mutations, and each mutation invalidates layout for the read that - * follows. Rendering many tags therefore meant a burst of forced synchronous layouts. - * - * One reusable off-screen node instead, and one getComputedStyle read for every property. - * The node stays out of flow and is aria-hidden, so it cannot affect layout or be - * announced, and it is removed once the last instance is destroyed. - */ - const $measurer = Utils.getTextMeasurer(); - const { - fontSize, - fontFamily, - fontWeight, - letterSpacing - } = window.getComputedStyle(container); - $measurer.style.fontSize = fontSize; - $measurer.style.fontFamily = fontFamily; - /** weight and tracking change advance width too, so ignoring them under-reported - * overflow and could drop a tooltip that was actually needed */ - $measurer.style.fontWeight = fontWeight; - $measurer.style.letterSpacing = letterSpacing; - $measurer.textContent = text; - return $measurer.clientWidth > container.clientWidth; - } - - /** - * Whether the user has asked the operating system to reduce motion. - * - * Read on each call rather than cached, so a preference changed after page load is picked up - * by the next instance. Guarded for environments without matchMedia. - * - * @static - * @returns {boolean} - */ - static prefersReducedMotion() { - return typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches; - } - - /** - * The shared, lazily created off-screen node used to measure text width. - * - * @static - * @returns {HTMLElement} - */ - static getTextMeasurer() { - if (!Utils.$textMeasurer || !Utils.$textMeasurer.isConnected) { - const $measurer = document.createElement('div'); - $measurer.className = 'vscomp-text-measurer'; - $measurer.setAttribute('aria-hidden', 'true'); - $measurer.style.cssText = 'position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;'; - document.body.appendChild($measurer); - Utils.$textMeasurer = $measurer; - } - return Utils.$textMeasurer; - } - - /** - * Drop the shared measuring node, so nothing of ours is left in the document once the last - * instance has gone. - * - * @static - */ - static removeTextMeasurer() { - if (Utils.$textMeasurer) { - Utils.$textMeasurer.remove(); - Utils.$textMeasurer = null; - } + const tempElement = document.createElement('div'); + tempElement.style.position = 'absolute'; + tempElement.style.visibility = 'hidden'; + tempElement.style.whiteSpace = 'nowrap'; + tempElement.style.fontSize = window.getComputedStyle(container).fontSize; + tempElement.style.fontFamily = window.getComputedStyle(container).fontFamily; + tempElement.textContent = text; + document.body.appendChild(tempElement); + const textWidth = tempElement.clientWidth; + document.body.removeChild(tempElement); + return textWidth > container.clientWidth; } /** @@ -281,83 +221,6 @@ class Utils { return text.replace(/"/g, '"'); } - /** - * Escape a *raw* string for interpolation into a double-quoted HTML attribute. - * - * Use this only where the input has not already been HTML-escaped - currently the option - * value, which is stored verbatim because it reaches no innerHTML sink. `&` must be escaped - * first, otherwise the `&` introduced by the quote replacement would itself be escaped and - * the attribute would parse back as a literal `"`. - * - * Deliberately NOT used by DomUtils.getAttributesText(), whose inputs are already-escaped - * label text: escaping `&` there would double it and a tooltip would show `&`. That - * asymmetry is the reason this is a separate helper rather than a shared one. - * - * @static - * @param {string} text - * @return {string} - * @memberof Utils - */ - static escapeAttributeValue(text) { - return Utils.getString(text).replace(/&/g, '&').replace(/"/g, '"'); - } - - /** - * Undo the escaping secureText() applies, recovering the text a human should read. - * - * Option label and description are stored HTML-escaped when enableSecureText is on, because - * they are inserted as HTML. Anywhere that text is consumed as *text* instead - an accessible - * name, a live-region announcement - the escape sequences have to come back off, or the user - * is read `&` and `<i class=...`. - * - * `&` is decoded last: doing it first would turn a literal `&lt;` into `<` and then - * into `<`, inventing markup the consumer never wrote. - * - * @static - * @param {string} text - * @return {string} - * @memberof Utils - */ - static decodeSecureText(text) { - return Utils.getString(text).replace(/</g, '<').replace(/>/g, '>').replace(/ /g, '\u00A0').replace(/&/g, '&'); - } - - /** - * Reduce label text to the words a human should hear or read. - * - * Labels may legitimately contain markup - an icon, , a
. Wherever that text is - * consumed as text (an accessible name, a live-region announcement) the markup is meaningless - * and is read out as tag soup. Tags collapse to a single space so adjacent words do not run - * together, so "France
Paris" does not become one word. - * - * The escaping is undone first. With enableSecureText on the label arrives already escaped, so - * the tag pattern found no `<` to match and the markup passed through verbatim - the strip was - * a no-op in exactly the mode escaping is enabled in. - * - * @static - * @param {string} text - * @return {string} - * @memberof Utils - */ - static getPlainText(text) { - return Utils.decodeSecureText(text).replace(/<[^>]+>/gi, ' ').replace(/\s+/g, ' ').trim(); - } - - /** - * Turn a label into text that is safe and sensible inside an aria-label attribute. - * - * Plain text, then escaped for the attribute - covering `&` as well as `"`, so a bare - * ampersand in a label is a valid character reference rather than raw markup, and a double - * quote can no longer close the attribute early and truncate the name. - * - * @static - * @param {string} text - * @returns {string} - */ - static getAriaLabelText(text) { - return Utils.escapeAttributeValue(Utils.getPlainText(text)); - } - /** * @static * @param {string} text @@ -466,13 +329,6 @@ class Utils { return throttled; } } - -/** - * Shared off-screen node used to measure text width, created on first use and removed when - * the last VirtualSelect instance is destroyed. - * @type {HTMLElement | null} - */ -Utils.$textMeasurer = null; ;// ./src/utils/dom-utils.js class DomUtils { @@ -596,42 +452,6 @@ class DomUtils { $ele.setAttribute(name, value); } - /** - * @param {HTMLElement} $ele - * @param {string} name - */ - static removeAttr($ele, name) { - if (!$ele) { - return; - } - $ele.removeAttribute(name); - } - - /** - * Set an aria-* attribute when the state applies, remove it otherwise. - * - * Preferred over writing `aria-x="false"` for states whose absence is meaningful - * (aria-required, aria-invalid): a literal "false" is valid but adds noise that some - * screen readers still verbalise. - * - * @param {HTMLElement | NodeListOf} $ele - * @param {string} name - * @param {boolean} isSet - * @param {string} [value='true'] - */ - static toggleAria($ele, name, isSet, value = 'true') { - if (!$ele) { - return; - } - DomUtils.getElements($ele).forEach($this => { - if (isSet) { - $this.setAttribute(`aria-${name}`, value); - } else { - $this.removeAttribute(`aria-${name}`); - } - }); - } - /** * @param {HTMLElement} $from * @param {HTMLElement} $to @@ -780,21 +600,7 @@ class DomUtils { // @ts-ignore Object.entries(data).forEach(([k, v]) => { if (v !== undefined) { - /** - * Quotes are escaped here, at the attribute boundary, because this is the only place - * that knows the value is about to be wrapped in double quotes. - * - * The caller that matters is getTooltipAttrText(), which passes option labels through - * to data-tooltip. It used to escape quotes itself but only when containsHTML(label) - * was true, so a payload with no tag in it - `x" data-pwned="1" z="` - went in raw and - * put a live attribute on the value-tag element. Escaping unconditionally here removes - * the condition, and the parser turns " back into a quote, so the attribute still - * reads back as the original string. - * - * String(), not Utils.getString(): the latter maps `false` to '', and some of these - * attributes carry real boolean values (data-tooltip-ellipsis-only, -allow-html). - */ - html += ` ${k}="${Utils.replaceDoubleQuotesWithHTML(String(v))}" `; + html += ` ${k}="${v}" `; } }); return html; @@ -845,9 +651,6 @@ class DomUtils { }); } } -;// ./src/utils/index.js - - ;// ./src/virtual-select.js /** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ /* eslint-disable class-methods-use-this */ @@ -869,7 +672,7 @@ const nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', // the class below has been evaluated (see the assignment at the bottom of this file). // eslint-disable-next-line prefer-const let attrPropsMapping; -const dataProps = ['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', 'loadingText', 'minValuesErrorText', 'moreText', 'noOfDisplayValues', 'noOptionsSelectedText', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'requiredErrorText', 'search', 'searchByStartsWith', 'searchDelay', 'searchFormLabel', 'searchGroup', 'searchNormalize', 'searchPlaceholderText', 'searchResultText', 'searchResultsText', 'selectAllOnlyVisible', 'selectAllText', 'selectedText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; +const dataProps = ['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', 'showSecureTextWarning', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; /** Class representing VirtualSelect */ class VirtualSelect { @@ -905,20 +708,9 @@ class VirtualSelect { let toggleButtonClasses = 'vscomp-toggle-button'; const valueTooltip = this.showValueAsTags ? '' : this.getTooltipAttrText(this.placeholder, true, true); const clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); - /** - * These props are developer-supplied but still reach an attribute directly, and none of them - * passes through secureText() - so enableSecureText never protected them. A double quote - * closed the attribute early: the payload after it was parsed as markup, and the accessible - * name kept only the prefix, which is a WCAG 4.1.2 defect as much as an injection. - * - * getAriaLabelText() for the accessible names, because it is what AI-14 already applies to - * option and group labels: strip markup, then escape quotes. Plain quote escaping for - * aria-labelledby, which is an IDREF list rather than prose - stripping tags there would hide - * a caller error instead of fixing it. - */ - const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.ariaLabelledby))}"` : ''; - const ariaLabelText = this.ariaLabelText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelText)}"` : ''; - const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelClearButtonText)}"` : ''; + const ariaLabelledbyText = this.ariaLabelledby ? `aria-labelledby="${this.ariaLabelledby}"` : ''; + const ariaLabelText = this.ariaLabelText ? `aria-label="${this.ariaLabelText}"` : ''; + const ariaLabelClearBtnTxt = this.ariaLabelClearButtonText ? `aria-label="${this.ariaLabelClearButtonText}"` : ''; let isExpanded = false; if (this.additionalClasses) { wrapperClasses += ` ${Utils.sanitizeClassNames(this.additionalClasses)}`; @@ -959,7 +751,7 @@ class VirtualSelect { const html = `
- +
${this.placeholder} @@ -971,11 +763,6 @@ class VirtualSelect {
-
- -
- ${this.renderDropbox({ wrapperClasses })} @@ -995,25 +782,6 @@ class VirtualSelect { this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); this.$valueText = this.$ele.querySelector('.vscomp-value'); this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); - - /** - * The submitting field's name is set as a DOM property, not interpolated into the template. - * - * `name="${this.name}"` made the attribute an HTML sink: a double quote closed it early, so - * the remainder of the value was parsed as markup (real elements, an injection) while the - * field kept only the truncated prefix - or, when the payload also swallowed the following - * `class="vscomp-hidden-input"`, no field was found at all and the first setValue() threw - * inside the constructor. Either way the form silently stopped submitting the right name, - * and that included legitimate names such as `items["a"]`. - * - * A property assignment performs no HTML parsing, so there is nothing to break out of and - * nothing to escape - which is also why `name` no longer goes through secureText(): the - * escaping only ever protected this sink, and applying it here corrupted the submitted - * field name into `items["a"]`. - */ - this.$hiddenInput.name = this.name; - this.$liveRegion = this.$ele.querySelector('.vscomp-live-region'); - this.$errorMessage = this.$ele.querySelector('.vscomp-error-message'); 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'); @@ -1043,9 +811,7 @@ class VirtualSelect {
-
+
@@ -1078,16 +844,8 @@ class VirtualSelect { return html; } renderOptions() { - /** - * The ARIA scan walks every option, so running it per render made scrolling O(n) per - * event (~3.9 ms/call at 100k). aria-setsize/aria-posinset only change when the - * filtered set or its order changes, never when the virtualisation window moves, so - * recompute on a dirty flag instead. Everything that alters the set marks it dirty. - */ - if (this.ariaMetadataDirty) { - this.calculateAriaMetadata(); - this.ariaMetadataDirty = false; - } + // Calculate ARIA metadata before rendering to ensure it's always up to date + this.calculateAriaMetadata(); let html = ''; const visibleOptions = this.getVisibleOptions(); let checkboxHtml = ''; @@ -1150,14 +908,14 @@ class VirtualSelect { ariaDisabledText = 'aria-disabled="true"'; } if (d.isGroupTitle) { - /** carried into every child's aria-label below, so strip markup once here */ - groupName = Utils.getAriaLabelText(d.label); + groupName = d.label; optionClasses += ' group-title'; if (disableOptionGroupCheckbox) { leftSection = ''; } else if (this.multiple) { - const selectAllText = Utils.getAriaLabelText(this.selectAllText); - ariaLabel = `aria-label="${groupName}, ${selectAllText}"`; + const groupLabel = Utils.replaceDoubleQuotesWithHTML(Utils.getString(d.label)); + const selectAllText = Utils.replaceDoubleQuotesWithHTML(Utils.getString(this.selectAllText)); + ariaLabel = `aria-label="${groupLabel}, ${selectAllText}"`; } } if (isSelected) { @@ -1174,13 +932,13 @@ class VirtualSelect { * 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 = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.group_name))); - const groupDescText = Utils.getAriaLabelText(this.secureText(Utils.getString(d.customData.description))); + 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}, ` : ''; const optionDesc = d.customData.description !== undefined ? ` ${groupDescText},` : ''; - ariaLabel = `aria-label="${groupName} ${Utils.getAriaLabelText(d.label)}, ${optionDesc}"`; + ariaLabel = `aria-label="${groupName} ${d.label}, ${optionDesc}"`; } else { - ariaLabel = `aria-label="${groupName}, ${Utils.getAriaLabelText(d.label)}"`; + ariaLabel = `aria-label="${groupName}, ${d.label}"`; } } if (hasLabelRenderer) { @@ -1206,23 +964,8 @@ class VirtualSelect { ariaAttrs += ` aria-posinset="${d.filteredIndex}"`; } } - - /** - * The option value is an untrusted string going straight into an attribute, so a double - * quote in it closed data-value early and everything after it was parsed as markup - a - * value of `x" data-pwned="1" z="` put a live data-pwned attribute on the option row, - * whether or not enableSecureText was on. - * - * `&` is escaped here as well as `"`, because the value is now stored verbatim (it reaches - * no innerHTML sink, so escaping it only made the option unaddressable - see secureText). - * Both together keep the attribute round-tripping: the parser turns `&` and `"` - * back into `&` and `"`, and setOptionAttr() rewrites data-value through the DOM API on - * every render anyway. - */ - const optionValueAttr = Utils.escapeAttributeValue(d.value); html += `
${leftSection} @@ -1245,40 +988,20 @@ class VirtualSelect { let checkboxHtml = ''; let searchInput = ''; if (this.multiple && !this.disableSelectAll) { - /** - * role="checkbox" + aria-checked so the control is announced as a checkbox and its - * state changes are audible. Without them it exposed as a generic element and every - * select/deselect was silent to assistive technology (WCAG 4.1.2 / 1.3.1). - * aria-checked is kept in sync by toggleAllOptionsClass(). - */ - /** - * selectAllText has two sinks, and only the attribute one is escaped. - * - * The visible label below is rendered as HTML and that works today - `Pick all` - * produces a real - so escaping it would be a visible regression for anyone styling - * the Select All label. The accessible name, by contrast, was raw: a quote broke out of - * the attribute, and markup was announced as tag soup. getAriaLabelText() is the same - * treatment the group-header aria-label a few methods up already applies to this exact - * prop, which is why that sink was safe while this one was not. - */ - checkboxHtml = ` + checkboxHtml = ` ${this.selectAllText} `; } if (this.hasSearch) { - const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${Utils.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"` : ''; + const ariaLabelSearchClearBtnTxt = this.ariaLabelSearchClearButtonText ? `aria-label="${this.ariaLabelSearchClearButtonText}"` : ''; searchInput = ` - + ×`; } const html = `
@@ -1409,29 +1132,14 @@ class VirtualSelect { e.preventDefault(); this.focusFirstVisibleOption(); } - - /** - * Space is the expected activation key for role="checkbox"; Enter is kept for - * backwards compatibility. preventDefault stops Space from scrolling the page - * (the previous behaviour, since the key was unhandled here). - */ - if (document.activeElement === this.$toggleAllButton && (key === 13 || key === 32)) { - e.preventDefault(); + if (document.activeElement === this.$toggleAllButton && key === 13) { this.toggleAllOptions(); return; } - /** - * Escape must close the dropdown in every layout (WCAG 2.1.1 / 2.1.2). - * The element that contains the focused node differs by layout: with an external - * `dropboxWrapper` the dropbox is portalled out of $wrapper, so containment has to be - * tested against $dropboxWrapper. In every other case - including the default - * `dropboxWrapper: 'self'` on desktop - the dropbox lives inside $wrapper. Selecting - * $dropboxWrapper unconditionally for non-popup layouts left it `undefined` under the - * default config, so the branch never ran and Escape did nothing. - */ + // Handle the Escape key when showing the dropdown as a popup, closing it if (key === 27 || e.key === 'Escape') { - const wrapper = this.hasDropboxWrapper && !this.showAsPopup ? this.$dropboxWrapper : this.$wrapper; + const wrapper = this.showAsPopup ? this.$wrapper : this.$dropboxWrapper; if (wrapper && (document.activeElement === wrapper || wrapper.contains(document.activeElement)) && !this.keepAlwaysOpen) { this.closeDropbox(); return; @@ -1449,34 +1157,33 @@ class VirtualSelect { this.openDropbox(); } } - - /** - * Move the highlight without moving DOM focus. - * - * Previously both arrow handlers bailed out whenever the search input had focus, to let - * the caret move. But opening the dropdown focuses the search input, so in the default - * flow the arrows did nothing at all and no option was ever highlighted (WCAG 2.1.1). - * The APG editable-combobox pattern is what applies here: Up/Down drive the list while - * focus stays in the field, and the active option is published as aria-activedescendant. - * - * @param {KeyboardEvent} e - * @param {'next' | 'previous'} direction - */ - navigateOptions(e, direction) { + onDownArrowPress(e) { + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } e.preventDefault(); if (this.isOpened()) { this.focusOption({ - direction + direction: 'next' }); } else { this.openDropbox(); } } - onDownArrowPress(e) { - this.navigateOptions(e, 'next'); - } onUpArrowPress(e) { - this.navigateOptions(e, 'previous'); + // Allow default behavior (cursor movement) when search input is focused + if (document.activeElement === this.$searchInput) { + return; + } + e.preventDefault(); + if (this.isOpened()) { + this.focusOption({ + direction: 'previous' + }); + } else { + this.openDropbox(); + } } onBackspaceOrDeletePress(e) { if (e.target === this.$wrapper) { @@ -1513,24 +1220,8 @@ class VirtualSelect { this.reset(); } } - - /** - * Scroll fires many times per drag and each event triggered a full re-render - * (~9.5 ms at 100k unthrottled, ~44 ms at 4x CPU), so the main thread stayed blocked for - * the whole gesture. Coalesce into at most one re-render per animation frame; the pending - * frame is cancelled in destroy() so it cannot run against a torn-down instance. - */ onOptionsScroll() { - if (this.scrollAnimationFrame) { - return; - } - this.scrollAnimationFrame = requestAnimationFrame(() => { - this.scrollAnimationFrame = null; - if (this.isDestroyed) { - return; - } - this.setVisibleOptions(true); - }); + this.setVisibleOptions(true); } onOptionsClick(e) { const $option = e.target.closest('.vscomp-option'); @@ -1697,8 +1388,6 @@ class VirtualSelect { if (VirtualSelect.activeInstances.size === 0) { VirtualSelect.removeGlobalListeners(); VirtualSelect.disconnectDomObserver(); - /** the shared text measurer is the last page-level node we own */ - Utils.removeTextMeasurer(); } } @@ -1764,12 +1453,6 @@ class VirtualSelect { if (this.autofocus) { this.focus(); } - - /** - * Marks the end of construction. Live-region announcements are suppressed until - * here so an initial value or the first render does not speak on page load. - */ - this.isInitialized = true; } catch (e) { this.destroy(); throw e; @@ -1828,16 +1511,9 @@ class VirtualSelect { if (this.selectAllOnlyVisible) { this.toggleAllOptionsClass(); } - - /** a closing dropbox must not take a highlight back - see closeDropbox() */ - if (!this.isClosing) { - this.focusOption({ - focusFirst: true - }); - } - if (!this.hasServerSearch) { - this.announceSearchResults(); - } + this.focusOption({ + focusFirst: true + }); } afterSetVisibleOptionsCount() { this.scrollToTop(); @@ -1860,19 +1536,7 @@ class VirtualSelect { this.setSearchValue('', false, true); } if (!keepValue) { - /** - * reset() validates, and validation announces - so replacing the options used to speak a - * validation failure for an interaction the user never made. Scoped to this one call rather - * than the whole method, and released in a finally: a stuck flag would silently suppress - * every later error announcement, which is far harder to diagnose than an exception (the - * lesson from the isClosing guard in closeDropbox()). - */ - this.isRefreshingOptions = true; - try { - this.reset(); - } finally { - this.isRefreshingOptions = false; - } + this.reset(); } } /** after event methods - end */ @@ -1935,14 +1599,6 @@ class VirtualSelect { this.optionsSelectedText = options.optionsSelectedText; this.optionSelectedText = options.optionSelectedText; this.allOptionsSelectedText = options.allOptionsSelectedText; - /** live-region announcement texts (see announce/getResultsCountMessage) */ - this.searchResultsText = options.searchResultsText; - this.searchResultText = options.searchResultText; - this.noOptionsSelectedText = options.noOptionsSelectedText; - this.selectedText = options.selectedText; - this.loadingText = options.loadingText; - this.requiredErrorText = options.requiredErrorText; - this.minValuesErrorText = options.minValuesErrorText; this.clearButtonText = options.clearButtonText; this.moreText = options.moreText; this.placeholder = options.placeholder; @@ -1957,8 +1613,7 @@ class VirtualSelect { this.zIndex = parseInt(options.zIndex, 10); this.maxValues = parseInt(options.maxValues, 10); this.minValues = parseInt(options.minValues, 10); - /** not escaped: the only sink is the hidden input's `name` *property* (see renderWrapper) */ - this.name = options.name; + this.name = this.secureText(options.name); this.additionalClasses = options.additionalClasses; this.additionalDropboxClasses = options.additionalDropboxClasses; this.additionalDropboxContainerClasses = options.additionalDropboxContainerClasses; @@ -1980,16 +1635,6 @@ class VirtualSelect { this.showDuration = parseInt(options.showDuration, 10); this.hideDuration = parseInt(options.hideDuration, 10); - /** - * The open/close animation is driven from JS as well as CSS, so the stylesheet's - * prefers-reduced-motion rule alone would still leave the popover animating for - * showDuration/hideDuration milliseconds. Honour the preference here too. - */ - if (Utils.prefersReducedMotion()) { - this.showDuration = 0; - this.hideDuration = 0; - } - /** @type {string[]} */ this.selectedValues = []; /** @type {virtualSelectOption[]} */ @@ -2018,25 +1663,13 @@ class VirtualSelect { this.optionsHeight = this.getOptionsHeight(); this.uniqueId = this.getUniqueId(); this.shouldFocusWrapperOnClose = true; // Initialize focus management property - this.isClosing = false; this.ariaSetSize = 0; - this.ariaMetadataDirty = true; } /** * @param {virtualSelectOptions} options */ setDefaultProps(options) { - const globalDefaults = VirtualSelect.globalDefaults; - - /** - * Resolve a prop across the precedence chain for the few defaults that are derived - * from another prop, so a page-level default still drives them. - * @param {string} key - */ - const resolve = key => options[key] !== undefined ? options[key] : globalDefaults[key]; - const keepAlwaysOpen = resolve('keepAlwaysOpen'); - const hasOptionDescription = resolve('hasOptionDescription'); const defaultOptions = { dropboxWrapper: 'self', valueKey: 'value', @@ -2060,19 +1693,10 @@ class VirtualSelect { moreText: 'more...', optionsSelectedText: 'options selected', optionSelectedText: 'option selected', - /** live-region announcements (WCAG 4.1.3) - overridable for localisation */ - searchResultsText: 'results available', - searchResultText: 'result available', - noOptionsSelectedText: 'No options selected', - selectedText: 'selected', - loadingText: 'Loading results', - /** validation messages; {count} in minValuesErrorText is replaced with minValues */ - requiredErrorText: 'This field is required', - minValuesErrorText: 'Select at least {count} options', allOptionsSelectedText: 'All', placeholder: 'Select', position: 'bottom left', - zIndex: keepAlwaysOpen ? 1 : 2, + zIndex: options.keepAlwaysOpen ? 1 : 2, tooltipFontSize: '14px', tooltipAlignment: 'center', tooltipMaxWidth: '300px', @@ -2094,38 +1718,11 @@ class VirtualSelect { showDuration: 300, hideDuration: 200 }; - if (hasOptionDescription) { + if (options.hasOptionDescription) { defaultOptions.optionsCount = 4; defaultOptions.optionHeight = '50px'; } - - /** - * Precedence: per-instance options > page-level globals > built-in defaults. - * Globals let a host turn a policy on once (notably enableSecureText) instead of - * repeating it at every call site, while an instance can still opt out explicitly. - */ - /** - * `undefined` means "not supplied", so those keys are dropped before merging. - * - * Object.assign copies own enumerable keys *including* ones whose value is undefined, so a prop - * forwarded from an unset variable - `enableSecureText: wrapper.sanitizeValues`, the shape a - * host wrapper naturally produces - overwrote the page-level global instead of falling back to - * it. A host could call setGlobalDefaults({ enableSecureText: true }) and still get escaping - * off at every such call site, with nothing to show it had been overridden. - * - * This also makes the merge agree with the resolve() helper above, which already treats - * undefined as absent; the two disagreed inside the same method. - */ - const supplied = source => { - const result = {}; - Object.keys(source || {}).forEach(key => { - if (source[key] !== undefined) { - result[key] = source[key]; - } - }); - return result; - }; - return Object.assign(defaultOptions, supplied(globalDefaults), supplied(options)); + return Object.assign(defaultOptions, options); } setPropsFromElementAttr(options) { const $ele = options.ele; @@ -2149,8 +1746,6 @@ class VirtualSelect { $ele.name = this.name; $ele.disabled = false; $ele.required = this.required; - /** expose the constraint itself, not just the failure (WCAG 3.3.1) */ - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); $ele.autofocus = this.autofocus; $ele.multiple = this.multiple; $ele.form = $ele.closest('form'); @@ -2179,23 +1774,8 @@ class VirtualSelect { } } setValueMethod(newValue, silentChange) { - /** - * Option values are untrusted strings used as keys, so every value-keyed lookup in this - * file is built with Object.create(null) rather than `{}`. - * - * This is not about prototype pollution - `mapping['__proto__'] = true` on a plain object - * calls the inherited setter, which ignores a non-object value, so nothing is written and - * Object.prototype stays intact. The damage is to reads: `mapping['__proto__']` returns - * the inherited Object.prototype, which is truthy but never `=== true`, and these lookups - * all compare against `true`. An option whose value is `__proto__` was therefore - * selectable by click (that path reads data-value, not a mapping) but invisible to - * setValue / setDisabledOptions / setEnabledOptions, so a selection the app could read - * back could not be restored - and under allowNewOption it was mistaken for an unknown - * value and duplicated. A null prototype has no inherited members, so an arbitrary string - * key behaves like any other. - */ - const valuesMapping = Object.create(null); - const valuesOrder = Object.create(null); + const valuesMapping = {}; + const valuesOrder = {}; let validValues = []; const isMultiSelect = this.multiple; // Normalize input value first @@ -2258,7 +1838,7 @@ class VirtualSelect { setGroupOptionsValue(preparedValues) { const selectedValues = []; const selectedGroups = {}; - const valuesMapping = Object.create(null); + const valuesMapping = {}; preparedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2319,7 +1899,7 @@ class VirtualSelect { } } else { disabledOptionsArr = disabledOptions.map(d => d.toString()); - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; disabledOptionsArr.forEach(d => { disabledOptionsMapping[d] = true; }); @@ -2353,7 +1933,7 @@ class VirtualSelect { return d; }); } else { - const enabledOptionsMapping = Object.create(null); + const enabledOptionsMapping = {}; enabledOptions.forEach(d => { enabledOptionsMapping[d] = true; }); @@ -2388,7 +1968,7 @@ class VirtualSelect { const getAlias = this.getAlias.bind(this); let index = 0; let hasOptionGroup = false; - const disabledOptionsMapping = Object.create(null); + const disabledOptionsMapping = {}; let hasEmptyValueOption = false; this.disabledOptions.forEach(d => { disabledOptionsMapping[d] = true; @@ -2401,25 +1981,8 @@ class VirtualSelect { [labelKey]: d }; } - - /** - * `value` is stored verbatim; only `label` and `description` are escaped. - * - * Escaping is for HTML sinks, and the value has none: it goes into the `data-value` - * attribute (escaped there, at the boundary) and is otherwise only compared or used as a - * map key. Escaping it stored an identity the caller could not name - `a&b` became - * `a&b`, so setValue(['a&b']) matched nothing and a value read back could not be set - * again. - * - * The normalised search keys derive from the *raw* text for the same reason: they are - * matched against what the user types into the search box, which is never HTML-escaped. - * Deriving them from the escaped text meant no query could match text containing `&`, - * `<` or `>`. - */ - const rawValue = getString(d[valueKey]); - const rawLabel = getString(d[labelKey]); - const value = rawValue; - const label = secureText(rawLabel); + const value = secureText(getString(d[valueKey])); + const label = secureText(getString(d[labelKey])); const childOptions = d.options; const isGroupTitle = !!childOptions; const option = { @@ -2427,7 +1990,7 @@ class VirtualSelect { value, valueNormalized: value.toLowerCase(), label, - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), alias: getAlias(d[aliasKey]), isVisible: convertToBoolean(d.isVisible, true), isNew: d.isNew || false, @@ -2445,10 +2008,9 @@ class VirtualSelect { option.groupIndex = d.groupIndex; } if (hasOptionDescription) { - const rawDescription = getString(d[descriptionKey]); - option.description = secureText(rawDescription); - /** normalised from the raw text, so a query containing `&` can match - see above */ - option.descriptionNormalized = this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(); + const description = secureText(getString(d[descriptionKey])); + option.description = description; + option.descriptionNormalized = this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(); } if (d.customData) { option.customData = d.customData; @@ -2494,7 +2056,7 @@ class VirtualSelect { /** merging already selected options details with new options */ if (selectedOptions.length) { - const newOptionsValueMapping = Object.create(null); + const newOptionsValueMapping = {}; optionsUpdated = true; newOptions.forEach(d => { newOptionsValueMapping[d.value] = true; @@ -2528,18 +2090,11 @@ class VirtualSelect { } this.setVisibleOptionsCount(); DomUtils.removeClass(this.$allWrappers, 'server-searching'); - - /** replace the "loading" message with the outcome of the fetch */ - if (this.isInitialized) { - this.announce(this.getResultsCountMessage()); - } } setSelectedOptions() { this.selectedOptions = this.options.filter(d => d.isSelected); } setSortedOptions() { - /** order drives aria-posinset */ - this.ariaMetadataDirty = true; let sortedOptions = [...this.options]; if (this.showSelectedOptionsFirst && this.selectedValues.length) { if (this.hasOptionGroup) { @@ -2623,26 +2178,8 @@ class VirtualSelect { DomUtils.toggleClass(this.$allWrappers, 'max-value-selected', this.isMaxValuesSelected); DomUtils.setAttr(this.$clearButton, 'tabindex', hasValue ? '0' : '-1'); DomUtils.setAria(this.$clearButton, 'hidden', hasValue === false); - let isValid = true; if (!disableValidation) { - isValid = this.validate(); - } - - /** - * Selection changes are otherwise conveyed only by the (visual) value text. - * Guarded on isInitialized so a value supplied at construction time is not - * announced before the user has interacted with anything. - * - * Skipped when validation just failed. validate() announces its message through the same - * polite region, and a polite region is read from its *final* content - so announcing the - * selection summary here overwrote the validation message in the same tick and the user - * never heard it. That silenced every interactive path (the clear button, deselecting below - * minValues) while still setting aria-invalid and showing the message on screen, which is - * the 3.3.1 failure this region exists to fix. The error is the more urgent of the two, and - * it already implies the selection state. - */ - if (this.isInitialized && isValid) { - this.announce(this.getSelectionMessage()); + this.validate(); } if (!disableEvent) { DomUtils.dispatchEvent(this.$ele, 'change', true); @@ -2690,13 +2227,11 @@ class VirtualSelect { // Will cause text overflow in runtime and if so,the tooltip information is prepared const valueTooltipForTags = Utils.willTextOverflow($valueText.parentElement, label) ? this.getTooltipAttrText(label, false, true) : ''; - /** markup in the label would otherwise land in the accessible name; a double - * quote in it would break out of the attribute entirely */ + // replace is nedded to remove html tags from aria-label (ex: when there is an icon in the label) let ariaLabelClearBtnTxt = ''; if (this.ariaLabelTagClearButtonText) { - const stripHtmlLabel = Utils.getAriaLabelText(label); - const clearButtonText = Utils.getAriaLabelText(this.ariaLabelTagClearButtonText); - ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${clearButtonText}"`; + const stripHtmlLabel = label.replace(/<[^>]+>/ig, '').trim(); + ariaLabelClearBtnTxt = `aria-label="${stripHtmlLabel}, ${this.ariaLabelTagClearButtonText}"`; } const valueTagHtml = ` ${label} @@ -2842,14 +2377,6 @@ class VirtualSelect { } } this.visibleOptionsCount = visibleOptionsCount; - /** - * Number of options matching the current filter. Kept separately because - * setVisibleOptions() overwrites visibleOptionsCount with the size of the rendered - * virtualisation window, which is not what a "N results available" message means. - */ - this.filteredOptionsCount = visibleOptionsCount; - /** isVisible changed for the whole set, so positions and setsize must be recomputed */ - this.ariaMetadataDirty = true; this.afterSetVisibleOptionsCount(); } @@ -2938,15 +2465,10 @@ class VirtualSelect { if (!value) { return; } - - /** adds a row to the filtered set */ - this.ariaMetadataDirty = true; const newOption = this.getNewOption(); if (newOption) { const newIndex = newOption.index; - - /** value verbatim, label escaped - the label is the only one rendered as HTML */ - this.setOptionProp(newIndex, 'value', value); + this.setOptionProp(newIndex, 'value', this.secureText(value)); this.setOptionProp(newIndex, 'label', this.secureText(value)); } else { const data = { @@ -2963,7 +2485,7 @@ class VirtualSelect { } } setSelectedProp() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.selectedValues.forEach(d => { valuesMapping[d] = true; }); @@ -2979,7 +2501,7 @@ class VirtualSelect { return; } const setNewOption = this.setNewOption.bind(this); - const availableValuesMapping = Object.create(null); + const availableValuesMapping = {}; this.options.forEach(d => { availableValuesMapping[d.value] = true; }); @@ -3074,7 +2596,7 @@ class VirtualSelect { if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { return; } - const valuesMapping = Object.create(null); + const valuesMapping = {}; let selectedOptionIndex; selectedValues.forEach(d => { valuesMapping[d] = true; @@ -3149,11 +2671,9 @@ class VirtualSelect { return startIndex; } getTooltipAttrText(text, ellipsisOnly = false, allowHtml = false) { - /** quotes are escaped unconditionally by getAttributesText(); escaping again here would - * leave a literal " in the tooltip, and the old containsHTML() condition is what - * let a tag-free payload through in the first place */ + const tootltipText = Utils.containsHTML(text) ? Utils.replaceDoubleQuotesWithHTML(text) : text; const data = { - 'data-tooltip': text || '', + 'data-tooltip': tootltipText || '', 'data-tooltip-enter-delay': this.tooltipEnterDelay, 'data-tooltip-z-index': this.zIndex, 'data-tooltip-font-size': this.tooltipFontSize, @@ -3177,18 +2697,17 @@ class VirtualSelect { getString } = Utils; const secureText = this.secureText.bind(this); - /** value stored verbatim, search keys derived from the raw text - see setOptions() */ - const rawValue = getString(data.value); - const rawLabel = getString(data.label); - const rawDescription = getString(data.description); + const value = secureText(getString(data.value)); + const label = secureText(getString(data.label)); + const description = secureText(getString(data.description)); return { index: data.index, - value: rawValue, - valueNormalized: rawValue.toLowerCase(), - label: secureText(rawLabel), - labelNormalized: this.searchNormalize && rawLabel.trim() !== '' ? Utils.normalizeString(rawLabel).toLowerCase() : rawLabel.toLowerCase(), - description: secureText(rawDescription), - descriptionNormalized: this.searchNormalize && rawDescription.trim() !== '' ? Utils.normalizeString(rawDescription).toLowerCase() : rawDescription.toLowerCase(), + value, + valueNormalized: value.toLowerCase(), + label, + labelNormalized: this.searchNormalize && label.trim() !== '' ? Utils.normalizeString(label).toLowerCase() : label.toLowerCase(), + description, + descriptionNormalized: this.searchNormalize && description.trim() !== '' ? Utils.normalizeString(description).toLowerCase() : description.toLowerCase(), alias: this.getAlias(data.alias), isCurrentNew: data.isCurrentNew || false, isNew: data.isNew || false, @@ -3214,7 +2733,7 @@ class VirtualSelect { return index; } getNewValue() { - const valuesMapping = Object.create(null); + const valuesMapping = {}; this.newValues.forEach(d => { valuesMapping[d] = true; }); @@ -3272,7 +2791,7 @@ class VirtualSelect { } }); if (keepSelectionOrder) { - const valuesOrder = Object.create(null); + const valuesOrder = {}; selectedValues.forEach((d, i) => { valuesOrder[d] = i; }); @@ -3286,7 +2805,7 @@ class VirtualSelect { labelKey, disabledOptions } = this; - const disabledOptionsValueMapping = Object.create(null); + const disabledOptionsValueMapping = {}; const result = []; disabledOptions.forEach(value => { disabledOptionsValueMapping[value] = true; @@ -3424,8 +2943,6 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); DomUtils.setAria(this.$wrapper, 'expanded', true); - /** the search input is its own combobox over the listbox, so it needs the state too */ - DomUtils.setAria(this.$searchInput, 'expanded', true); } this.setDropboxWrapperWidth(); DomUtils.removeClass(this.$allWrappers, 'closed'); @@ -3485,22 +3002,9 @@ class VirtualSelect { } else { DomUtils.dispatchEvent(this.$ele, 'beforeClose'); DomUtils.setAria(this.$wrapper, 'expanded', false); - DomUtils.setAria(this.$searchInput, 'expanded', false); - /** - * No option is active once the list is gone - and the highlight has to go with it, - * here, synchronously. - * - * afterHidePopper() already calls removeOptionFocus(), but for popover-backed - * instances it only runs when the hide transition ends (~200ms later). Until then the - * previous highlight and `focusedOptionIndex` survived the close, so reopening within - * that window resumed navigation from the old position instead of the first option: - * the next Up/Down moved one step past where the user expected, which on a grouped - * multi-select meant Enter landed on the first child option instead of toggling the - * group title. removeOptionFocus() is a no-op when nothing is highlighted, so leaving - * the afterHidePopper() call in place costs nothing and still covers the silent path. - */ - this.removeOptionFocus(); - this.setActiveDescendant(''); + DomUtils.setAria(this.$wrapper, 'activedescendant', ''); + // Also clear aria-activedescendant on the listbox container + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', ''); } if (this.dropboxPopover && !isSilent) { this.dropboxPopover.hide(); @@ -3513,26 +3017,7 @@ class VirtualSelect { } else { this.afterHidePopper(); } - - /** - * Clearing the filter runs afterSetSearchValue(), which highlights the first visible - * option again. That undid the removeOptionFocus() above whenever the user had typed - * something: the highlight and aria-activedescendant came straight back on a combobox - * already marked aria-expanded="false", and focusOption() pulled DOM focus onto an option - * that is about to be display:none - so the keyboard position ended up on . - * - * isClosing is scoped to this one call rather than the whole method because everything - * above it (the wrapper refocus in particular) still needs the real state. The reset runs - * in a finally: if setSearchValue() ever threw, a stuck flag would silently stop the - * highlight coming back after *every* later filter clear, which is far harder to diagnose - * than the exception itself. - */ - this.isClosing = true; - try { - this.setSearchValue(''); - } finally { - this.isClosing = false; - } + this.setSearchValue(''); } afterHidePopper() { const isSilent = this.isSilentClose; @@ -3887,14 +3372,7 @@ class VirtualSelect { if (!isAllSelected && this.selectAllOnlyVisible && this.searchValue !== '' && (this.visibleOptionsCount > 0 || this.searchValue === '')) { isAllVisibleSelected = this.isAllOptionsSelected(true); } - const isChecked = isAllSelected || isAllVisibleSelected; - DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isChecked); - /** - * Mirror the visual checked state onto the role="checkbox" host. This is the single - * point every selection path funnels through (select all, deselect all, per-option - * clicks, group toggles, setValue, reset), so the exposed state cannot drift. - */ - DomUtils.setAria(this.$toggleAllButton, 'checked', isChecked); + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); this.isAllSelected = isAllSelected; } isAllOptionsSelected(visibleOnly) { @@ -3942,7 +3420,7 @@ class VirtualSelect { selectedValues, selectAllOnlyVisible } = this; - const valuesMapping = Object.create(null); + const valuesMapping = {}; const { removeItemFromArray } = Utils; @@ -3987,15 +3465,7 @@ class VirtualSelect { this.toggleOptionSelectedState($ele, isSelected); } toggleFocusedProp(index, isFocused = false) { - /** - * Explicitly against null, not truthiness. focusedOptionIndex comes from - * DomUtils.getData($ele, 'index') with no type, so today it is the *string* "0" and a - * truthiness test happens to pass for the first option. Normalise it to a number anywhere - * and index 0 would stop being cleared, so its `isFocused` prop would survive - and - * renderOptions() re-applies `.focused` and tabindex="0" from that prop, bringing the - * stale highlight back through the data path on the next render. - */ - if (this.focusedOptionIndex !== null && this.focusedOptionIndex !== undefined) { + if (this.focusedOptionIndex) { this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); } this.setOptionProp(index, 'isFocused', isFocused); @@ -4024,18 +3494,7 @@ class VirtualSelect { }); this.afterValueSet(); if (formReset) { - /** - * A native form reset clears the error state, not just the colour that showed it. - * - * Removing `has-error` alone left aria-invalid="true" on the combobox and - * aria-describedby pointing at an error element that still held its text - so the control - * stayed announced as invalid, describing a message the user could no longer see, with no - * interaction able to clear it. setErrorMessage('') empties the text and drops - * aria-describedby, and does not announce (it only announces a non-empty message). - */ DomUtils.removeClass(this.$allWrappers, 'has-error'); - DomUtils.toggleAria(this.$allWrappers, 'invalid', false); - this.setErrorMessage(''); } DomUtils.dispatchEvent(this.$ele, 'reset'); } @@ -4065,8 +3524,6 @@ class VirtualSelect { removeNewOption() { const newOption = this.getNewOption(); if (newOption) { - /** removes a row from the filtered set */ - this.ariaMetadataDirty = true; this.removeOption(newOption.index); } } @@ -4186,9 +3643,6 @@ class VirtualSelect { serverSearch() { DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); DomUtils.addClass(this.$allWrappers, 'server-searching'); - - /** the spinner is a visual-only cue; announce that a fetch is in flight */ - this.announce(this.loadingText); this.setSelectedOptions(); this.onServerSearch(this.searchValue, this); } @@ -4223,67 +3677,18 @@ class VirtualSelect { return true; } let hasError = false; - let errorText = ''; const { selectedValues, minValues } = this; - if (this.required) { - if (Utils.isEmpty(selectedValues)) { - hasError = true; - errorText = this.requiredErrorText; - } else if (this.multiple && minValues && selectedValues.length < minValues) { - /** required minium options not selected */ - hasError = true; - errorText = Utils.getString(this.minValuesErrorText).replace('{count}', minValues); - } + if (this.required && (Utils.isEmpty(selectedValues) || (/** required minium options not selected */ + this.multiple && minValues && selectedValues.length < minValues))) { + hasError = true; } DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); - - /** - * Previously the only signal was the `has-error` class recolouring the toggle button - * border: invisible to assistive technology and, being colour alone, a 1.4.1 failure. - * Expose the state (aria-invalid), give it a text message, point the combobox at that - * message (aria-describedby) and announce it. - */ - DomUtils.toggleAria(this.$allWrappers, 'invalid', hasError); - this.setErrorMessage(hasError ? errorText : ''); return !hasError; } - /** - * Show or clear the validation message and its association with the combobox. - * An empty message removes aria-describedby rather than pointing at empty text. - * - * @param {string} message - */ - setErrorMessage(message) { - if (!this.$errorMessage) { - return; - } - const text = message || ''; - this.$errorMessage.textContent = text; - DomUtils.toggleAria(this.$allWrappers, 'describedby', !!text, this.$errorMessage.id); - - /** - * The message is shown and exposed unconditionally, but only *announced* for something the - * user did. A live region is for status changes they caused. - * - * isInitialized keeps construction quiet: the initial setValueMethod() runs before that flag - * is set, so a page supplied with an invalid initial value used to load already speaking - * "Select at least 2 options". isRefreshingOptions keeps a programmatic data swap quiet: - * afterSetOptions() calls reset(), which validates, so replacing the options announced a - * failure for a field the user had never touched. - * - * Both are deliberately narrow. The interactive paths - the clear button, deselecting below - * minValues, and an explicit validate() from the application - must still announce, which is - * the whole point of routing validation through this region. - */ - if (text && this.isInitialized && !this.isRefreshingOptions) { - this.announce(text); - } - } - /** * 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). @@ -4334,12 +3739,6 @@ class VirtualSelect { // Clear any other pending timeouts so their callbacks don't run on a destroyed instance this.clearManagedTimeouts(); - // Drop any queued scroll re-render so it cannot touch detached DOM - if (this.scrollAnimationFrame) { - cancelAnimationFrame(this.scrollAnimationFrame); - this.scrollAnimationFrame = null; - } - /** Remove all event listeners to prevent memory leaks and ensure proper cleanup */ this.removeEvents(); if (this.hasDropboxWrapper) { @@ -4368,20 +3767,8 @@ class VirtualSelect { if (!text || !this.enableSecureText) { return text; } - - /** - * escape potentially harmful markup so label/value/description cannot trigger XSS. - * - * Quotes are deliberately *not* rewritten here. They were, and the text node's innerHTML - * then escaped the `&` that introduced - so `The "City" of Light` used to be stored as - * `The &quot;City&quot; of Light`, shown to the user as `The "City" of - * Light`, and made unsearchable, because labelNormalized derives from the stored text. - * Quotes only need escaping inside an attribute, and that now happens at each attribute - * boundary instead (data-value in renderOptions, DomUtils.getAttributesText) - which also - * covers the sinks this pre-escaping never reached, such as an attribute written while - * enableSecureText is off. - */ - this.$secureText.nodeValue = text; + /** escape potentially harmful JavaScript so, label and value fields cannot trigger XSS */ + this.$secureText.nodeValue = Utils.replaceDoubleQuotesWithHTML(text); return this.$secureDiv.innerHTML; } @@ -4402,87 +3789,9 @@ class VirtualSelect { // eslint-disable-next-line no-console console.warn('[virtual-select] Option text (label, value, description) and any `customData` used in ' + 'markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled ' + '(the default, kept off for performance on large datasets). If any option text can come ' + 'from untrusted input, set `enableSecureText: true` to prevent XSS. ' + 'Docs: https://sa-si-dev.github.io/virtual-select/#/properties'); } - - /** - * Write a message into the instance's polite live region (WCAG 4.1.3 Status Messages). - * - * Identical consecutive messages are intentionally left alone: re-writing the same text - * produces no DOM mutation, so assistive technology does not repeat "No results found" - * on every further keystroke that still matches nothing. - * - * @param {string} message - */ - announce(message) { - if (!this.$liveRegion) { - return; - } - - /** - * Reduced to plain text because the region is written with textContent, so whatever is put - * there is read out literally. A single select announces the chosen label, and a label can - * carry both escaping and markup: with enableSecureText on the region said - * "Tom & Jerry selected", and decoding alone would only have turned that into - * " France selected". Neither is speech. Messages the component composes - * itself contain no markup, so this is a no-op for them. - */ - const text = Utils.getPlainText(message || ''); - if (this.$liveRegion.textContent !== text) { - this.$liveRegion.textContent = text; - } - } - - /** - * Message describing how many options the current filter matched. - * @returns {string} - */ - getResultsCountMessage() { - const count = this.filteredOptionsCount || 0; - if (count === 0) { - return this.noSearchResultsText; - } - return `${count} ${count === 1 ? this.searchResultText : this.searchResultsText}`; - } - - /** - * Message describing the current selection. - * @returns {string} - */ - getSelectionMessage() { - const count = this.selectedValues.length; - if (count === 0) { - return this.noOptionsSelectedText; - } - if (this.multiple) { - return `${count} ${count === 1 ? this.optionSelectedText : this.optionsSelectedText}`; - } - - /** option flags are updated before setValue(), so the label is already current */ - const label = this.getDisplayValue() || this.selectedValues[0]; - return `${label} ${this.selectedText}`; - } - - /** - * Announce the match count, but only while the user is actually searching. - * setSearchValue('') also runs on close and after a value is set; announcing there - * would read a stale count into the user's ear for an interaction they did not make. - */ - announceSearchResults() { - if (!this.isInitialized || !this.isOpened() || document.activeElement !== this.$searchInput) { - return; - } - this.announce(this.getResultsCountMessage()); - } toggleRequired(isRequired) { this.required = Utils.convertToBoolean(isRequired); this.$ele.required = this.required; - DomUtils.toggleAria(this.$allWrappers, 'required', this.required); - - /** dropping the requirement also drops any error it produced */ - if (!this.required) { - DomUtils.toggleClass(this.$allWrappers, 'has-error', false); - DomUtils.toggleAria(this.$allWrappers, 'invalid', false); - this.setErrorMessage(''); - } } toggleOptionSelectedState($ele, value) { let isSelected = value; @@ -4498,83 +3807,17 @@ class VirtualSelect { } DomUtils.toggleClass($ele, 'focused', isFocused); DomUtils.setAttr($ele, 'tabindex', isFocused ? '0' : '-1'); - - /** - * Only *taking* the highlight moves DOM focus. Clearing it used to focus the element it - * had just un-highlighted, which is either pointless (focusOption immediately focuses the - * new option anyway) or actively wrong: on close it pulled focus into a dropbox that is - * about to be hidden, fighting the wrapper refocus in closeDropbox(). - */ - if (isFocused && document.activeElement !== this.$searchInput) { + if (document.activeElement !== this.$searchInput) { $ele.focus(); } - - /** - * Publish the highlight on the elements that can carry it: the wrapper and the search - * input, both role="combobox". It used to also go on $dropboxContainer, a plain div - * with no role, where aria-activedescendant is meaningless - and never on the search - * input, which is the element that actually holds focus while navigating. - */ - this.setActiveDescendant(isFocused ? $ele.id : ''); - } - - /** - * Point the combobox elements at the active option, or clear the reference. - * @param {string} optionId - */ - setActiveDescendant(optionId) { - DomUtils.toggleAria(this.$wrapper, 'activedescendant', !!optionId, optionId); - DomUtils.toggleAria(this.$searchInput, 'activedescendant', !!optionId, optionId); - } - - /** static methods - start */ - - /** - * Set page-level default props applied to every instance created afterwards. - * - * The motivating case is security: option text is interpolated into innerHTML and is only - * escaped when `enableSecureText` is on, which it is not by default (escaping costs per - * option, and large trusted lists should not pay for it). A host that does render - * untrusted option text can turn escaping on once here rather than at every call site: - * - * VirtualSelect.setGlobalDefaults({ enableSecureText: true }); - * - * These are defaults, not overrides: an instance passing the prop explicitly still wins, - * so a host forwarding `enableSecureText` on every init must stop doing so (or forward - * `true`) for this to take effect. Calls merge, so features can be configured separately. - * Only instances created after the call are affected. - * - * @param {Partial} props - */ - static setGlobalDefaults(props) { - if (!props || typeof props !== 'object') { - VirtualSelect.globalDefaults = {}; - return; + if (isFocused) { + DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); + // Also set aria-activedescendant on the listbox container for better screen reader support + DomUtils.setAria(this.$dropboxContainer, 'activedescendant', $ele.id); } - - /** `ele` and `options` are per-instance by nature and would alias state across instances */ - const safeProps = { - ...props - }; - delete safeProps.ele; - delete safeProps.options; - VirtualSelect.globalDefaults = { - ...VirtualSelect.globalDefaults, - ...safeProps - }; } - /** - * Currently active page-level defaults. - * A copy, so callers cannot mutate the live object. - * - * @returns {Partial} - */ - static getGlobalDefaults() { - return { - ...VirtualSelect.globalDefaults - }; - } + /** static methods - start */ static init(options) { let $eleArray = options.ele; if (!$eleArray) { @@ -4805,9 +4048,6 @@ VirtualSelect.lastInteractedInstance = null; // Ensures the "enableSecureText disabled" warning is logged at most once per page VirtualSelect.secureTextWarningShown = false; -// Page-level default props, applied under per-instance options (see setGlobalDefaults) -VirtualSelect.globalDefaults = {}; - /** polyfill to fix an issue in ie browser */ if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { NodeList.prototype.forEach = Array.prototype.forEach; diff --git a/docs/assets/virtual-select.min.css b/docs/assets/virtual-select.min.css index 7257fcff..29fc53eb 100644 --- a/docs/assets/virtual-select.min.css +++ b/docs/assets/virtual-select.min.css @@ -3,7 +3,7 @@ * https://sa-si-dev.github.io/virtual-select * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) */ -@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-error-message{align-items:flex-start;color:#b00020;display:none;font-size:13px;gap:4px;line-height:1.4;padding-top:4px;width:100%}.vscomp-error-message::before{content:"⚠";flex:none;font-size:1.1em;line-height:1.2}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex;min-height:24px;min-width:24px}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.has-error .vscomp-error-message{display:flex}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 24px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}@media(prefers-reduced-motion: reduce){.vscomp-dropbox-container,.vscomp-dropbox,.vscomp-wrapper .vscomp-toggle-button,.vscomp-dropbox-wrapper{transition-duration:0s !important}}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-label,.vscomp-live-region,.vscomp-dropbox-container-top,.vscomp-dropbox-container-bottom{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} /*! * Popover v1.0.13 * https://sa-si-dev.github.io/popover diff --git a/docs/assets/virtual-select.min.js b/docs/assets/virtual-select.min.js index b1e55d59..5ab3dec1 100644 --- a/docs/assets/virtual-select.min.js +++ b/docs/assets/virtual-select.min.js @@ -2,4 +2,4 @@ * Virtual Select v1.3.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,s){const i=t.getTextMeasurer(),{fontSize:o,fontFamily:n,fontWeight:r,letterSpacing:a}=window.getComputedStyle(e);return i.style.fontSize=o,i.style.fontFamily=n,i.style.fontWeight=r,i.style.letterSpacing=a,i.textContent=s,i.clientWidth>e.clientWidth}static prefersReducedMotion(){return"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}static getTextMeasurer(){if(!t.$textMeasurer||!t.$textMeasurer.isConnected){const e=document.createElement("div");e.className="vscomp-text-measurer",e.setAttribute("aria-hidden","true"),e.style.cssText="position:absolute;top:0;left:-9999px;visibility:hidden;white-space:nowrap;pointer-events:none;",document.body.appendChild(e),t.$textMeasurer=e}return t.$textMeasurer}static removeTextMeasurer(){t.$textMeasurer&&(t.$textMeasurer.remove(),t.$textMeasurer=null)}static replaceDoubleQuotesWithHTML(e){return e.replace(/"/g,""")}static escapeAttributeValue(e){return t.getString(e).replace(/&/g,"&").replace(/"/g,""")}static decodeSecureText(e){return t.getString(e).replace(/</g,"<").replace(/>/g,">").replace(/ /g," ").replace(/&/g,"&")}static getPlainText(e){return t.decodeSecureText(e).replace(/<[^>]+>/gi," ").replace(/\s+/g," ").trim()}static getAriaLabelText(e){return t.escapeAttributeValue(t.getPlainText(e))}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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}t.$textMeasurer=null;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 removeAttr(e,t){e&&e.removeAttribute(t)}static toggleAria(e,t,i,o="true"){e&&s.getElements(e).forEach(e=>{i?e.setAttribute(`aria-${t}`,o):e.removeAttribute(`aria-${t}`)})}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 s="";return e?(Object.entries(e).forEach(([e,i])=>{void 0!==i&&(s+=` ${e}="${t.replaceDoubleQuotesWithHTML(String(i))}" `)}),s):s}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","loadingText","minValuesErrorText","moreText","noOfDisplayValues","noOptionsSelectedText","noOptionsText","noSearchResultsText","optionHeight","optionSelectedText","optionsCount","optionsSelectedText","popupDropboxBreakpoint","popupPosition","position","requiredErrorText","search","searchByStartsWith","searchDelay","searchFormLabel","searchGroup","searchNormalize","searchPlaceholderText","searchResultText","searchResultsText","selectAllOnlyVisible","selectAllText","selectedText","setValueAsArray","showDropboxAsPopup","showOptionsOnlyOnSearch","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${t.replaceDoubleQuotesWithHTML(t.getString(this.ariaLabelledby))}"`:"",l=this.ariaLabelText?`aria-label="${t.getAriaLabelText(this.ariaLabelText)}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelClearButtonText)}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n
\n\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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.$hiddenInput.name=this.name,this.$liveRegion=this.$ele.querySelector(".vscomp-live-region"),this.$errorMessage=this.$ele.querySelector(".vscomp-error-message"),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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}renderOptions(){this.ariaMetadataDirty&&(this.calculateAriaMetadata(),this.ariaMetadataDirty=!1);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 g=this.getTooltipAttrText("",!0,!0);let f=i,x="",O="",S="",y="",$="-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)if(d=t.getAriaLabelText(s.label),m+=" group-title",l)f="";else if(this.multiple){const e=t.getAriaLabelText(this.selectAllText);y=`aria-label="${d}, ${e}"`}if(w&&(m+=" selected"),s.isGroupOption)if(m+=" group-option",S=`data-group-index="${s.groupIndex}"`,s.customData){const e=t.getAriaLabelText(this.secureText(t.getString(s.customData.group_name))),i=t.getAriaLabelText(this.secureText(t.getString(s.customData.description)));d=void 0!==s.customData.group_name?`${e}, `:"";const o=void 0!==s.customData.description?` ${i},`:"";y=`aria-label="${d} ${t.getAriaLabelText(s.label)}, ${o}"`}else y=`aria-label="${d}, ${t.getAriaLabelText(s.label)}"`;b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",x+=o):!n||s.isGroupTitle&&!p||(b=b.replace(r,"$1"));let T="";this.ariaSetSize>0&&(T=`aria-setsize="${this.ariaSetSize}"`,s.filteredIndex&&(T+=` aria-posinset="${s.filteredIndex}"`));const E=t.escapeAttributeValue(s.value);e+=`
\n ${f}\n \n ${b}\n \n ${O}\n ${x}\n
`}),d="",this.$options.innerHTML=e,this.$visibleOptions=this.$options.querySelectorAll(".vscomp-option"),this.afterRenderOptions()}renderSearch(){if(!this.hasSearchContainer)return;let e="",s="";if(this.multiple&&!this.disableSelectAll&&(e=`\n \n ${this.selectAllText}\n `),this.hasSearch){const e=this.ariaLabelSearchClearButtonText?`aria-label="${t.getAriaLabelText(this.ariaLabelSearchClearButtonText)}"`:"";s=`\n \n ×`}const i=`
\n ${e}\n ${s}\n
`;this.$search.innerHTML=i,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.registerInstance(this)}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||32===t))return e.preventDefault(),void this.toggleAllOptions();if(27===t||"Escape"===e.key){const e=this.hasDropboxWrapper&&!this.showAsPopup?this.$dropboxWrapper:this.$wrapper;if(e&&(document.activeElement===e||e.contains(document.activeElement))&&!this.keepAlwaysOpen)return void this.closeDropbox()}s&&this[s](e)}onEnterPress(e){e.preventDefault(),this.isOpened()?this.selectFocusedOption():!1===this.$ele.disabled&&this.openDropbox()}navigateOptions(e,t){e.preventDefault(),this.isOpened()?this.focusOption({direction:t}):this.openDropbox()}onDownArrowPress(e){this.navigateOptions(e,"next")}onUpArrowPress(e){this.navigateOptions(e,"previous")}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.scrollAnimationFrame||(this.scrollAnimationFrame=requestAnimationFrame(()=>{this.scrollAnimationFrame=null,this.isDestroyed||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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver(),t.removeTextMeasurer())}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();try{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(),this.isInitialized=!0}catch(e){throw this.destroy(),e}}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.isClosing||this.focusOption({focusFirst:!0}),this.hasServerSearch||this.announceSearchResults()}afterSetVisibleOptionsCount(){this.scrollToTop(),this.setOptionsHeight(),this.setVisibleOptions(),this.updatePosition()}afterValueSet(){this.scrollToTop(),this.setSearchValue(""),this.renderOptions()}afterSetOptions(e){if(e&&this.setSelectedProp(),this.setOptionsHeight(),this.setVisibleOptions(),this.showOptionsOnlyOnSearch&&this.setSearchValue("",!1,!0),!e){this.isRefreshingOptions=!0;try{this.reset()}finally{this.isRefreshingOptions=!1}}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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.searchResultsText=s.searchResultsText,this.searchResultText=s.searchResultText,this.noOptionsSelectedText=s.noOptionsSelectedText,this.selectedText=s.selectedText,this.loadingText=s.loadingText,this.requiredErrorText=s.requiredErrorText,this.minValuesErrorText=s.minValuesErrorText,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,10),this.zIndex=parseInt(s.zIndex,10),this.maxValues=parseInt(s.maxValues,10),this.minValues=parseInt(s.minValues,10),this.name=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,10),this.hideDuration=parseInt(s.hideDuration,10),t.prefersReducedMotion()&&(this.showDuration=0,this.hideDuration=0),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.isClosing=!1,this.ariaSetSize=0,this.ariaMetadataDirty=!0}setDefaultProps(e){const t=l.globalDefaults,s=s=>void 0!==e[s]?e[s]:t[s],i={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",searchResultsText:"results available",searchResultText:"result available",noOptionsSelectedText:"No options selected",selectedText:"selected",loadingText:"Loading results",requiredErrorText:"This field is required",minValuesErrorText:"Select at least {count} options",allOptionsSelectedText:"All",placeholder:"Select",position:"bottom left",zIndex:s("keepAlwaysOpen")?1:2,tooltipFontSize:"14px",tooltipAlignment:"center",tooltipMaxWidth:"300px",updatePositionThrottle:100,name:"",additionalClasses:"",additionalDropboxClasses:"",additionalDropboxContainerClasses:"",additionalToggleButtonClasses:"",maxValues:0,showDropboxAsPopup:!0,showSecureTextWarning:!0,popupDropboxBreakpoint:"576px",popupPosition:"center",hideValueTooltipOnSelectAll:!0,emptyValue:"",searchDelay:300,focusSelectedOptionOnOpen:!0,showDuration:300,hideDuration:200};s("hasOptionDescription")&&(i.optionsCount=4,i.optionHeight="50px");const o=e=>{const t={};return Object.keys(e||{}).forEach(s=>{void 0!==e[s]&&(t[s]=e[s])}),t};return Object.assign(i,o(t),o(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,s.toggleAria(this.$allWrappers,"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=Object.create(null),o=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);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=Object.create(null);let m=!1;this.disabledOptions.forEach(e=>{b[e]=!0});const g=e=>{"object"!=typeof e&&(e={[o]:e,[n]:e});const f=h(e[o]),x=h(e[n]),O=f,S=c(x),y=e.options,$=!!y,w={index:d,value:O,valueNormalized:O.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==x.trim()?t.normalizeString(x).toLowerCase():x.toLowerCase(),alias:u(e[a]),isVisible:p(e.isVisible,!0),isNew:e.isNew||!1,isGroupTitle:$,classNames:e.classNames};if(m||""!==O||(m=!0),i&&(w.isDisabled=!0===b[O]),e.isGroupOption&&(w.isGroupOption=!0,w.groupIndex=e.groupIndex),l){const s=h(e[r]);w.description=c(s),w.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(w.customData=e.customData),s.push(w),d+=1,$){const e=w.index;v=!0,y.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,g(t)})}};Array.isArray(e)&&e.forEach(g);const f=s.length,{$ele:x}=this;x.options=s,x.length=f,this.options=s,this.visibleOptionsCount=f,this.lastOptionIndex=f-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=Object.create(null);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"),this.isInitialized&&this.announce(this.getResultsCountMessage())}setSelectedOptions(){this.selectedOptions=this.options.filter(e=>e.isSelected)}setSortedOptions(){this.ariaMetadataDirty=!0;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,10);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);let l=!0;o||(l=this.validate()),this.isInitialized&&l&&this.announce(this.getSelectionMessage()),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="${t.getAriaLabelText(s)}, ${t.getAriaLabelText(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.filteredOptionsCount=s,this.ariaMetadataDirty=!0,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;this.ariaMetadataDirty=!0;const s=this.getNewOption();if(s){const e=s.index;this.setOptionProp(e,"value",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=Object.create(null);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=Object.create(null);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=Object.create(null);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,t=!1,i=!1){const o={"data-tooltip":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":t,"data-tooltip-allow-html":i};return s.getAttributesText(o)}getOptionObj(e){if(!e)return;const{getString:s}=t,i=this.secureText.bind(this),o=s(e.value),n=s(e.label),r=s(e.description);return{index:e.index,value:o,valueNormalized:o.toLowerCase(),label:i(n),labelNormalized:this.searchNormalize&&""!==n.trim()?t.normalizeString(n).toLowerCase():n.toLowerCase(),description:i(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=Object.create(null);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=Object.create(null);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=Object.create(null),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,10);return t}getOptionsHeight(){return this.optionsCount*this.optionHeight+"px"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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),s.setAria(this.$searchInput,"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.$searchInput,"expanded",!1),this.removeOptionFocus(),this.setActiveDescendant("")),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.isClosing=!0;try{this.setSearchValue("")}finally{this.isClosing=!1}}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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,10))})}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));const i=e||t;s.toggleClass(this.$toggleAllCheckbox,"checked",i),s.setAria(this.$toggleAllButton,"checked",i),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,10));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=Object.create(null),{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){null!==this.focusedOptionIndex&&void 0!==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.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage("")),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.ariaMetadataDirty=!0,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.announce(this.loadingText),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,i="";const{selectedValues:o,minValues:n}=this;return this.required&&(t.isEmpty(o)?(e=!0,i=this.requiredErrorText):this.multiple&&n&&o.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(){if(this.isDestroyed)return;this.isDestroyed=!0;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.scrollAnimationFrame&&(cancelAnimationFrame(this.scrollAnimationFrame),this.scrollAnimationFrame=null),this.removeEvents(),this.hasDropboxWrapper&&(this.$dropboxWrapper.virtualSelect=void 0,this.$dropboxWrapper.remove()),this.dropboxPopover&&this.dropboxPopover.destroy(),s.removeClass(e,"vscomp-ele"),this.events={},l.unregisterInstance(this)}createSecureTextElements(){this.$secureDiv=document.createElement("div"),this.$secureText=document.createTextNode(""),this.$secureDiv.appendChild(this.$secureText)}secureText(e){return e&&this.enableSecureText?(this.$secureText.nodeValue=e,this.$secureDiv.innerHTML):e}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}announce(e){if(!this.$liveRegion)return;const s=t.getPlainText(e||"");this.$liveRegion.textContent!==s&&(this.$liveRegion.textContent=s)}getResultsCountMessage(){const e=this.filteredOptionsCount||0;return 0===e?this.noSearchResultsText:`${e} ${1===e?this.searchResultText:this.searchResultsText}`}getSelectionMessage(){const e=this.selectedValues.length;return 0===e?this.noOptionsSelectedText:this.multiple?`${e} ${1===e?this.optionSelectedText:this.optionsSelectedText}`:`${this.getDisplayValue()||this.selectedValues[0]} ${this.selectedText}`}announceSearchResults(){this.isInitialized&&this.isOpened()&&document.activeElement===this.$searchInput&&this.announce(this.getResultsCountMessage())}toggleRequired(e){this.required=t.convertToBoolean(e),this.$ele.required=this.required,s.toggleAria(this.$allWrappers,"required",this.required),this.required||(s.toggleClass(this.$allWrappers,"has-error",!1),s.toggleAria(this.$allWrappers,"invalid",!1),this.setErrorMessage(""))}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"),t&&document.activeElement!==this.$searchInput&&e.focus(),this.setActiveDescendant(t?e.id:""))}setActiveDescendant(e){s.toggleAria(this.$wrapper,"activedescendant",!!e,e),s.toggleAria(this.$searchInput,"activedescendant",!!e,e)}static setGlobalDefaults(e){if(!e||"object"!=typeof e)return void(l.globalDefaults={});const t={...e};delete t.ele,delete t.options,l.globalDefaults={...l.globalDefaults,...t}}static getGlobalDefaults(){return{...l.globalDefaults}}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,l.globalDefaults={},"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;sx?x-b:M:w+p>L&&("right"===T?n="left":w=L+bO?O-u:P:C+c>I&&("bottom"===T?n="top":C=I+up-j&&(G=p-j):"left"!==T&&"right"!==T||((R=g/2+f-H)c-j&&(R=c-j)),s.setStyle(this.$arrowEle,"transform","translate3d(".concat(parseInt(G),"px, ").concat(parseInt(R),"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 + */!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;function r(){const t=s,i=o;o=[],s=void 0,e.apply(t,i)}function a(...e){const a=Date.now(),l=t-(a-n);o=e,s=this,l<=0||l>t?(i&&(clearTimeout(i),i=null),n=a,r()):i||(i=setTimeout(()=>{n=Date.now(),i=null,r()},l))}return a.cancel=function(){i&&(clearTimeout(i),i=null),n=0,o=[],s=void 0},a}}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","showSecureTextWarning","showSelectedOptionsFirst","showValueAsTags","silentInitialValueSet","textDirection","tooltipAlignment","tooltipFontSize","tooltipMaxWidth","updatePositionThrottle","useGroupValue","valueKey","zIndex"];class l{constructor(e){this.isDestroyed=!1;try{this.createSecureTextElements(),this.setProps(e),this.setDisabledOptions(e.disabledOptions),this.setOptions(e.options),this.warnIfSecureTextDisabled(),this.render()}catch(e){console.warn("Couldn't initiate Virtual Select"),console.error(e)}}render(){if(!this.$ele)return;const{uniqueId:e}=this;let i="vscomp-wrapper",o="vscomp-toggle-button";const n=this.showValueAsTags?"":this.getTooltipAttrText(this.placeholder,!0,!0),r=this.getTooltipAttrText(this.clearButtonText),a=this.ariaLabelledby?`aria-labelledby="${this.ariaLabelledby}"`:"",l=this.ariaLabelText?`aria-label="${this.ariaLabelText}"`:"",h=this.ariaLabelClearButtonText?`aria-label="${this.ariaLabelClearButtonText}"`:"";let p=!1;this.additionalClasses&&(i+=` ${t.sanitizeClassNames(this.additionalClasses)}`),this.additionalToggleButtonClasses&&(o+=` ${t.sanitizeClassNames(this.additionalToggleButtonClasses)}`),this.multiple&&(i+=" multiple",this.disableSelectAll||(i+=" has-select-all")),this.hideClearButton||(i+=" has-clear-button"),this.keepAlwaysOpen?(i+=" keep-always-open",p=!0):i+=" closed",this.showAsPopup&&(i+=" show-as-popup"),this.hasSearch&&(i+=" has-search-input"),this.showValueAsTags&&(i+=" show-value-as-tags"),this.textDirection&&(i+=` text-direction-${this.textDirection}`),this.popupPosition&&(i+=` popup-position-${this.popupPosition.toLowerCase()}`);const c=`
\n \n
\n
\n ${this.placeholder}\n
\n
\n
\n \n
\n
\n\n ${this.renderDropbox({wrapperClasses:i})}\n
`;this.$ele.innerHTML=c,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 i="self"!==this.dropboxWrapper?document.querySelector(this.dropboxWrapper):null;let o="vscomp-dropbox";this.additionalDropboxClasses&&(o+=` ${t.sanitizeClassNames(this.additionalDropboxClasses)}`);let n="vscomp-dropbox-container";this.additionalDropboxContainerClasses&&(n+=` ${t.sanitizeClassNames(this.additionalDropboxContainerClasses)}`);const r=`
\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(i){const t=document.createElement("div");return this.$dropboxWrapper=t,this.hasDropboxWrapper=!0,t.innerHTML=r,i.appendChild(t),s.addClass(t,`vscomp-dropbox-wrapper ${e}`),this.keepAlwaysOpen||(s.setAttr(t,"tabindex","-1"),s.setAria(t,"hidden",!0)),""}return this.hasDropboxWrapper=!1,r}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,S="",O="",x="",y="",$="-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="":this.multiple&&(y=`aria-label="${t.replaceDoubleQuotesWithHTML(t.getString(s.label))}, ${t.replaceDoubleQuotesWithHTML(t.getString(this.selectAllText))}"`)),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},`:"",y=`aria-label="${d} ${s.label}, ${e}"`}else y=`aria-label="${d}, ${s.label}"`}b=c?a(s):s.label,s.description&&(O=`
${s.description}
`),s.isCurrentNew?(m+=" current-new",S+=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 ${O}\n ${S}\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.registerInstance(this)}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()&&(this.shouldSkipOptionInNavigation(t)?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}))}static disconnectDomObserver(){l.domObserver&&(l.domObserver.disconnect(),l.domObserver=null)}static addGlobalListeners(){l.hasGlobalListeners||(document.addEventListener("reset",l.onFormReset),document.addEventListener("submit",l.onFormSubmit),window.addEventListener("resize",l.onResizeThrottled),l.hasGlobalListeners=!0)}static removeGlobalListeners(){l.hasGlobalListeners&&(document.removeEventListener("reset",l.onFormReset),document.removeEventListener("submit",l.onFormSubmit),window.removeEventListener("resize",l.onResizeThrottled),l.onResizeThrottled&&"function"==typeof l.onResizeThrottled.cancel&&l.onResizeThrottled.cancel(),l.hasGlobalListeners=!1)}static registerInstance(e){l.activeInstances.add(e),l.addGlobalListeners(),l.observeDomChanges()}static unregisterInstance(e){l.activeInstances.delete(e),0===l.activeInstances.size&&(l.removeGlobalListeners(),l.disconnectDomObserver())}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();try{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()}catch(e){throw this.destroy(),e}}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.showSecureTextWarning=i(s.showSecureTextWarning,!0),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,showSecureTextWarning:!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])),S=c(h(e[n])),O=e.options,x=!!O,y={index:d,value:g,valueNormalized:g.toLowerCase(),label:S,labelNormalized:this.searchNormalize&&""!==S.trim()?t.normalizeString(S).toLowerCase():S.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&&(y.isDisabled=!0===b[g]),e.isGroupOption&&(y.isGroupOption=!0,y.groupIndex=e.groupIndex),l){const s=c(h(e[r]));y.description=s,y.descriptionNormalized=this.searchNormalize&&""!==s.trim()?t.normalizeString(s).toLowerCase():s.toLowerCase()}if(e.customData&&(y.customData=e.customData),s.push(y),d+=1,x){const e=y.index;v=!0,O.forEach(t=>{t.isGroupOption=!0,t.groupIndex=e,f(t)})}};Array.isArray(e)&&e.forEach(f);const g=s.length,{$ele:S}=this;S.options=s,S.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"}isSelectableGroupTitle(e){return e&&s.hasClass(e,"group-title")&&this.multiple&&!this.disableOptionGroupCheckbox}shouldSkipOptionInNavigation(e){return!!e&&(!!s.hasClass(e,"disabled")||s.hasClass(e,"group-title")&&!this.isSelectableGroupTitle(e))}getSibling(e,t){const s="next"===t?"nextElementSibling":"previousElementSibling";let i=e;do{i&&(i=i[s])}while(this.shouldSkipOptionInNavigation(i));return i}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?(this.shouldSkipOptionInNavigation(e)&&(e=this.getSibling(e,"next")),e&&(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}"]`),this.shouldSkipOptionInNavigation(n)&&(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(){if(this.isDestroyed)return;this.isDestroyed=!0;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={},l.unregisterInstance(this)}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}warnIfSecureTextDisabled(){l.secureTextWarningShown||this.enableSecureText||!this.showSecureTextWarning||(l.secureTextWarningShown=!0,console.warn("[virtual-select] Option text (label, value, description) and any `customData` used in markup are rendered as HTML and are NOT escaped because `enableSecureText` is disabled (the default, kept off for performance on large datasets). If any option text can come from untrusted input, set `enableSecureText: true` to prevent XSS. Docs: https://sa-si-dev.github.io/virtual-select/#/properties"))}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()})}}l.onResizeThrottled=t.throttle(l.onResizeMethod,100),r=l.getAttrProps(),window.VirtualSelect=l,l.openInstances=new Set,l.domObserver=null,l.activeInstances=new Set,l.hasGlobalListeners=!1,l.lastInteractedInstance=null,l.secureTextWarningShown=!1,"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;sS?S-b:L:w+p>M&&("right"===E?n="left":w=M+bO?O-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}(); From 1f74b3554bfa7bcf8d40aaaed25a22ebfbf97c6f Mon Sep 17 00:00:00 2001 From: gnbm Date: Fri, 7 Aug 2026 09:00:54 +0100 Subject: [PATCH 56/57] docs(security): stop claiming option `value` is inserted as raw HTML The `setGlobalDefaults()` security note listed `label`, `value` and `description` as raw HTML that `enableSecureText` escapes. Only `label` and `description` are: since faef03c (AI-22) `value` is stored verbatim and reaches no HTML sink - it is compared, used as a map key, and written to `data-value`, which is escaped at that boundary. `properties.md` already states this in both the security note and the prop table, so the methods page was the last place contradicting it - and the one a consumer reads when sizing up their XSS exposure and what turning the flag on actually buys them. --- docs/methods.md | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/docs/methods.md b/docs/methods.md index 0ef28624..54ab9f25 100644 --- a/docs/methods.md +++ b/docs/methods.md @@ -275,10 +275,12 @@ document.querySelector('#sample-select').toggleRequired(true); Set default props applied to every instance created afterwards, so a page-wide policy does not have to be repeated at each call site. -The main use is security. Option `label`, `value` and `description` are inserted as raw HTML and -are only escaped when `enableSecureText` is on, which is **not** the default (escaping runs per -option and is measurable on 10k-100k+ lists). If any option text in your app can come from -untrusted input, turn it on once during startup: +The main use is security. Option `label` and `description` are inserted as raw HTML and are only +escaped when `enableSecureText` is on, which is **not** the default (escaping runs per option and +is measurable on 10k-100k+ lists). `value` is never rendered as HTML - it is only compared and +written to a `data-value` attribute, which is escaped at that boundary - so it stays exactly as +you supplied it. If any option text in your app can come from untrusted input, turn escaping on +once during startup: ```js VirtualSelect.setGlobalDefaults({ enableSecureText: true }); From dcf61d5cf373d59768fd4f70f66839f6c243f783 Mon Sep 17 00:00:00 2001 From: gnbm Date: Fri, 7 Aug 2026 12:10:07 +0100 Subject: [PATCH 57/57] docs: give resetGlobalDefaults() and getGlobalDefaults() their own headings Both statics landed in cbdc5de (AI-28) documented only as prose inside the `setGlobalDefaults()` section. Every other method on the page has its own `###` heading, and docsify builds the page ToC and the heading anchors from those - so neither was scannable, and nothing could link to them the way `properties.md` links to `methods.md#virtualselectsetglobaldefaults`. No behaviour change. Two small gains beyond the headings: the reset note now links to its section rather than just naming the method, and `getGlobalDefaults()` is described as returning a *shallow* copy, which is what it returns (`{ ...VirtualSelect.globalDefaults }`, src/virtual-select.js:4325) - the previous one-liner said "a copy", which would have been read as protecting nested values it does not protect. --- docs/methods.md | 22 ++++++++++++++++++++-- 1 file changed, 20 insertions(+), 2 deletions(-) diff --git a/docs/methods.md b/docs/methods.md index 54ab9f25..c21c9f1c 100644 --- a/docs/methods.md +++ b/docs/methods.md @@ -296,6 +296,24 @@ Notes: - `ele` and `options` are ignored, being inherently per-instance. - A non-object argument (e.g. an accidentally-unset variable) is **ignored**, so a page-wide policy cannot be wiped by mistake. To clear a single key, pass it with the value `undefined`; - to clear everything, call `VirtualSelect.resetGlobalDefaults()`. + to clear everything, call [`VirtualSelect.resetGlobalDefaults()`](#virtualselectresetglobaldefaults). -Read the current values with `VirtualSelect.getGlobalDefaults()`, which returns a copy. +### VirtualSelect.resetGlobalDefaults() + +Drop every global default, so instances created afterwards fall back to the library's own +defaults. Clearing is deliberately a separate method: `setGlobalDefaults()` only ever merges, so +passing it `{}` does nothing. + +```js +VirtualSelect.resetGlobalDefaults(); +``` + +### VirtualSelect.getGlobalDefaults() + +Read the global defaults currently in force, as set by +[`setGlobalDefaults()`](#virtualselectsetglobaldefaults). Returns a shallow copy, so writing to +the returned object does not change what later instances get. + +```js +VirtualSelect.getGlobalDefaults(); +```