@nova-design-system/nova-react 3.22.0 → 3.24.0

package/dist/cjs/{nv-fieldmultiselect.entry-BMLjhqoJ.js → nv-fieldmultiselect.entry-BWY5xOAd.js}

@@ -1,28 +1,37 @@
 'use strict';
 
-var index = require('./index-WPRkQD3O.js');
-var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
+var index = require('./index-kU2nW5aN.js');
+var i18n_utilsIlwlcG9l = require('./i18n.utils-IlwlcG9l-ku0bScip.js');
+var v4BdYh22OP = require('./v4-BdYh22OP-C1vaJ4yP.js');
+require('@stencil/react-output-target/runtime');
 require('react');
 require('react-dom');
 
-const nvFieldmultiselectCss = "nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldmultiselect{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldmultiselect[fluid]:not([fluid=false]){max-width:unset}nv-fieldmultiselect[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldmultiselect[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldmultiselect[required]:not([required=false]) label::after{content:\"*\";color:var(--components-form-text-required);font-weight:var(--font-weight-high-emphasis)}nv-fieldmultiselect label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-label-line-height)}nv-fieldmultiselect nv-popover{width:100%;display:block}nv-fieldmultiselect nv-popover [data-scope=popover]{min-width:100%;width:max-content;max-width:400px;padding:var(--list-dropdown-padding);border-radius:var(--list-dropdown-radius);background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border)}nv-fieldmultiselect nv-popover [slot=content]{gap:var(--list-dropdown-gap-y);display:flex;flex-direction:column}nv-fieldmultiselect nv-popover hr{color:var(--components-list-dropdown-separator)}nv-fieldmultiselect nv-popover div[slot=content]{max-height:calc(90vh - var(--list-dropdown-padding) * 2);overflow-y:auto;position:relative}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar{width:6px;height:6px}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}nv-fieldmultiselect .input-wrapper-multiselect{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;width:100%}nv-fieldmultiselect .input-container-multiselect{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out;position:relative;width:100%;min-height:40px}nv-fieldmultiselect .input-container-multiselect:hover{border-color:var(--nv-field-border-hover)}nv-fieldmultiselect .input-container-multiselect:focus-within,nv-fieldmultiselect .input-container-multiselect:focus-within:hover,nv-fieldmultiselect .input-container-multiselect:focus,nv-fieldmultiselect .input-container-multiselect:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldmultiselect .input-container-multiselect:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldmultiselect .input-container-multiselect:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldmultiselect .input-container-multiselect>nv-badge{margin-left:var(--form-field-padding-x)}nv-fieldmultiselect .input-container-multiselect input,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-field-line-height);width:100%;width:100%;flex-grow:1;margin:0;min-height:100%;box-sizing:border-box}nv-fieldmultiselect .input-container-multiselect input:focus,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text:focus{outline:none}nv-fieldmultiselect .input-container-multiselect input::placeholder,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:var(--font-weight-low-emphasis);line-height:var(--form-field-line-height)}nv-fieldmultiselect .input-container-multiselect input[type=password]::-ms-clear,nv-fieldmultiselect .input-container-multiselect input[type=password]::-ms-reveal,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text[type=password]::-ms-clear,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton{border:0px;border-radius:0px}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton:last-of-type{border-top-right-radius:var(--form-field-radius);border-bottom-right-radius:var(--form-field-radius)}nv-fieldmultiselect .input-container-multiselect nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldmultiselect .non-filterable-text{display:block;border-radius:var(--form-field-radius);background-color:var(--nv-field-background);color:var(--components-form-field-content-text);font-size:var(--form-field-font-size);font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-field-line-height);box-sizing:border-box;cursor:pointer;height:100%;min-height:40px}nv-fieldmultiselect .non-filterable-text span{display:inline-block;width:100%;overflow:hidden;text-overflow:ellipsis}nv-fieldmultiselect .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldmultiselect .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}.no-results-message{cursor:not-allowed;background-color:unset;color:var(--components-menu-contextual-item-content-disabled);padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x)}.multiselect-divider{display:block;width:100%;height:1px;background-color:var(--components-list-dropdown-separator);margin:var(--list-dropdown-item-padding-y) 0;border:0}.select-all-container{position:sticky;top:0;background-color:var(--components-list-dropdown-background);border-bottom:1px solid var(--components-list-dropdown-separator);padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);z-index:10;margin-bottom:0}.select-all-container .select-all-header{display:flex;align-items:center;gap:var(--form-field-gap)}.select-all-container .select-all-header nv-fieldcheckbox{flex:1;margin:0}.select-all-container .select-all-header nv-iconbutton,.select-all-container .select-all-header nv-button{flex-shrink:0;margin-left:auto}.select-all-container .select-all-header nv-button{justify-content:center}";
-const NvFieldmultiselectStyle0 = nvFieldmultiselectCss;
+const nvFieldmultiselectCss = "nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldmultiselect{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldmultiselect[fluid]:not([fluid=false]){max-width:unset}nv-fieldmultiselect[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldmultiselect[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldmultiselect[required]:not([required=false]) label::after,nv-fieldmultiselect[aria-required=true] label::after{content:\"*\";color:var(--components-form-text-required);font-weight:var(--font-weight-high-emphasis)}nv-fieldmultiselect label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-label-line-height)}nv-fieldmultiselect nv-popover{width:100%;display:block}nv-fieldmultiselect nv-popover [data-scope=popover]{min-width:100%;width:max-content;max-width:400px;padding:var(--list-dropdown-padding);border-radius:var(--list-dropdown-radius);background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border)}nv-fieldmultiselect nv-popover [slot=content]{gap:var(--list-dropdown-gap-y);display:flex;flex-direction:column}nv-fieldmultiselect nv-popover hr{color:var(--components-list-dropdown-separator)}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar{width:6px;height:6px}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}nv-fieldmultiselect nv-popover div[slot=content]::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}nv-fieldmultiselect nv-popover div[slot=content]{max-height:calc(90vh - var(--list-dropdown-padding) * 2);overflow-y:auto;position:relative}nv-fieldmultiselect .input-wrapper-multiselect{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;width:100%}nv-fieldmultiselect .input-container-multiselect{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fieldmultiselect .input-container-multiselect:hover{border-color:var(--nv-field-border-hover)}nv-fieldmultiselect .input-container-multiselect:focus-within,nv-fieldmultiselect .input-container-multiselect:focus-within:hover,nv-fieldmultiselect .input-container-multiselect:focus,nv-fieldmultiselect .input-container-multiselect:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldmultiselect .input-container-multiselect:has(input:read-only){background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldmultiselect .input-container-multiselect:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldmultiselect .input-container-multiselect{position:relative;width:100%;min-height:40px}nv-fieldmultiselect .input-container-multiselect>nv-badge{margin-left:var(--form-field-padding-x)}nv-fieldmultiselect .input-container-multiselect input,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:calc(var(--form-field-padding-y) - 1px) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-field-line-height);width:100%}nv-fieldmultiselect .input-container-multiselect input:focus,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text:focus{outline:none}nv-fieldmultiselect .input-container-multiselect input::placeholder,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:var(--font-weight-low-emphasis);line-height:var(--form-field-line-height)}nv-fieldmultiselect .input-container-multiselect input,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text{}nv-fieldmultiselect .input-container-multiselect input[type=password]::-ms-clear,nv-fieldmultiselect .input-container-multiselect input[type=password]::-ms-reveal,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text[type=password]::-ms-clear,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldmultiselect .input-container-multiselect input,nv-fieldmultiselect .input-container-multiselect p.non-filterable-text{width:100%;flex-grow:1;margin:0;min-height:100%;box-sizing:border-box}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton{border:0px;border-radius:0px}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fieldmultiselect .input-container-multiselect>nv-iconbutton:last-of-type{border-top-right-radius:var(--form-field-radius);border-bottom-right-radius:var(--form-field-radius)}nv-fieldmultiselect .input-container-multiselect nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldmultiselect .non-filterable-text{display:block;border-radius:var(--form-field-radius);background-color:var(--nv-field-background);color:var(--components-form-field-content-text);font-size:var(--form-field-font-size);font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-field-line-height);box-sizing:border-box;cursor:pointer;height:100%;min-height:40px}nv-fieldmultiselect .non-filterable-text span{display:inline-block;width:100%;overflow:hidden;text-overflow:ellipsis}nv-fieldmultiselect .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldmultiselect .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}.no-results-message{cursor:not-allowed;background-color:unset;color:var(--components-menu-contextual-item-content-disabled);padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x)}.multiselect-divider{display:block;width:100%;height:1px;background-color:var(--components-list-dropdown-separator);margin:var(--list-dropdown-item-padding-y) 0;border:0}.select-all-container{position:sticky;top:0;background-color:var(--components-list-dropdown-background);border-bottom:1px solid var(--components-list-dropdown-separator);padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);z-index:10;margin-bottom:0}.select-all-container .select-all-header{display:flex;align-items:center;gap:var(--form-field-gap)}.select-all-container .select-all-header nv-fieldcheckbox{flex:1;margin:0}.select-all-container .select-all-header nv-iconbutton,.select-all-container .select-all-header nv-button{flex-shrink:0;margin-left:auto}.select-all-container .select-all-header nv-button{justify-content:center}";
 
 const NvFieldmultiselect = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.valueChanged = index.createEvent(this, "valueChanged");
-        this.filterTextChanged = index.createEvent(this, "filterTextChanged");
+        this.valueChanged = index.createEvent(this, "valueChanged", 3);
+        this.filterTextChanged = index.createEvent(this, "filterTextChanged", 3);
         this.isBulkOperation = false;
         // Add the flag to the class
         this.preventBlurClose = false;
+        /** Pre-computed search index for efficient filtering */
+        this.indexedItems = [];
+        /** Raw items for worker initialization */
+        this.rawItems = [];
+        /** Web Worker client for async search operations */
+        this.workerClient = null;
+        /** Effective filter mode (may differ from prop if fuzzy falls back to smart) */
+        this.effectiveFilterMode = 'strict';
         /**
          * Sets the ID for the input element and the for attribute of the associated
          * label. If no ID is provided, a random one will be automatically generated
          * to ensure unique identification, facilitating proper label association and
          * accessibility.
          */
-        this.inputId = v4A79185f4.v4();
+        this.inputId = v4BdYh22OP.v4();
         /**
          * The autocomplete prop helps users fill out the input field faster by
          * suggesting entries they've used before, like their email or address.
@@ -32,8 +41,18 @@ const NvFieldmultiselect = class {
         this.autocomplete = 'off';
         /**
          * Marks the input field as required.
+         * @note This uses the native HTML `required` attribute, which triggers browser validation.
          */
         this.required = false;
+        /**
+         * Marks the input field as required for accessibility purposes without triggering
+         * native HTML validation. Use this when implementing custom validation logic.
+         * @note When set, this uses `aria-required` instead of the native `required` attribute.
+         * This allows developers to implement custom validation while maintaining accessibility.
+         * @note If this prop is not explicitly set, the component will check for the HTML attribute
+         * 'aria-required' directly to determine if it should be applied.
+         */
+        this.ariaRequiredAttr = false;
         /**
          * Display the input field's content without allowing users to change it.
          */
@@ -104,6 +123,39 @@ const NvFieldmultiselect = class {
          * Text for the "Deselect All" button.
          */
         this.deselectAllLabel = 'Select/deselect all';
+        /**
+         * Filter mode for multiselect search:
+         * - 'strict': Simple substring matching (normalized includes)
+         * - 'smart': Token-based matching (all query tokens must exist, order ignored)
+         * - 'fuzzy': Typo-tolerant matching using Fuse.js (runs in Web Worker)
+         * @default 'strict'
+         */
+        this.filterMode = 'strict';
+        /**
+         * Maximum number of results to display. Protects UI performance on large datasets.
+         * Values are clamped between 10 and 500 (hard cap).
+         * @default 25
+         */
+        this.maxResults = 25;
+        /**
+         * Minimum number of characters required before filtering starts.
+         * Useful for preventing overwhelming results on very large datasets.
+         * @default 0
+         */
+        this.startFilterAt = 0;
+        /**
+         * Number of items above which filtering is offloaded to a Web Worker.
+         * This keeps the main thread responsive for large datasets.
+         * @default 2000
+         */
+        this.workerThreshold = 2000;
+        /**
+         * Threshold for fuzzy matching (0-1). Lower values are stricter.
+         * Only applies when filterMode is 'fuzzy'.
+         * @default 0.3
+         * @see {@link https://fusejs.io/api/options.html#threshold} Fuse.js threshold documentation
+         */
+        this.fuzzyThreshold = 0.3;
         //#endregion PROPERTIES
         /****************************************************************************/
         //#region STATE
@@ -121,6 +173,19 @@ const NvFieldmultiselect = class {
          * Controls the visibility of the select all section.
          */
         this.isSelectAllSectionVisible = true;
+        /**
+         * Whether search results were truncated due to maxResults limit.
+         */
+        this.resultsTruncated = false;
+        /**
+         * Total number of matches before truncation.
+         */
+        this.totalResults = 0;
+        /**
+         * Whether a worker search is in progress.
+         */
+        this.isSearching = false;
+        // (filterItems handles both options and slots mode)
         /**
          * Handle badge close for options mode.
          */
@@ -255,7 +320,7 @@ const NvFieldmultiselect = class {
             }
             // Set a new timer for filtering
             this.debounceTimer = window.setTimeout(() => {
-                this.filterItemsOption();
+                void this.filterItems();
             }, this.debounceDelay);
         };
         /**
@@ -276,7 +341,7 @@ const NvFieldmultiselect = class {
             }
             // Set a new timer for filtering
             this.debounceTimer = window.setTimeout(() => {
-                this.filterSlotsItems();
+                void this.filterItems();
             }, this.debounceDelay);
         };
         /**
@@ -447,8 +512,12 @@ const NvFieldmultiselect = class {
          * @returns {any} The JSX for options mode
          */
         this.renderOptionsMode = () => {
-            var _a, _b, _c, _d;
-            return (index.h(index.Host, { "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { htmlFor: this.inputId }, index.h("slot", { name: "label" }, this.label))), index.h("nv-popover", { ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { class: "input-wrapper-multiselect", slot: "trigger" }, index.h("slot", { name: "before-input" }), index.h("div", { class: "input-container-multiselect" }, index.h("slot", { name: "leading-input" }), (((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0) > 0 && (index.h("nv-badge", { slot: "leading-input", "prevent-auto-close": true, color: "10", dismissible: (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) || 0) > 0, label: `${((_c = this.value) === null || _c === void 0 ? void 0 : _c.length) || 0} ${this.badgeLabel}`, "aria-label": `Clear all ${((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) || 0} ${this.badgeLabel} items`, onCloseClicked: this.handleBadgeCloseOptions })), this.filterable || this.disabled || this.readonly ? (index.h("input", { type: "text", id: this.inputId, ref: e => (this.inputElement = e), autofocus: this.autofocus, autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.filterText, required: this.required, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInputOptions, onFocus: this.handleInputFocusOptions, onBlur: this.handleInputBlurOptions, onKeyDown: this.handleKeyDown, "data-scope": "focusable", "aria-label": this.label, "aria-controls": `${this.inputId}-listbox` })) : (index.h(index.Fragment, null, index.h("input", { id: this.inputId, type: "text", style: {
+            return (index.h(index.Host, { "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { htmlFor: this.inputId }, index.h("slot", { name: "label" }, this.label))), index.h("nv-popover", { ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open, onOpenChanged: this.handleOpenChanged }, index.h("div", { class: "input-wrapper-multiselect", slot: "trigger" }, index.h("slot", { name: "before-input" }), index.h("div", { class: "input-container-multiselect" }, index.h("slot", { name: "leading-input" }), (this.value?.length || 0) > 0 && (index.h("nv-badge", { slot: "leading-input", "prevent-auto-close": true, color: "10", dismissible: (this.value?.length || 0) > 0, label: `${this.value?.length || 0} ${this.badgeLabel}`, "aria-label": `Clear all ${this.value?.length || 0} ${this.badgeLabel} items`, onCloseClicked: this.handleBadgeCloseOptions })), this.filterable || this.disabled || this.readonly ? (index.h("input", { type: "text", id: this.inputId, ref: e => (this.inputElement = e), autofocus: this.autofocus, autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.filterText, required: this.getRequiredAttributes().useNativeRequired
+                    ? this.required
+                    : undefined, ...(this.getRequiredAttributes().ariaRequiredValue !==
+                    undefined && {
+                    'aria-required': String(this.getRequiredAttributes().ariaRequiredValue),
+                }), disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInputOptions, onFocus: this.handleInputFocusOptions, onBlur: this.handleInputBlurOptions, onKeyDown: this.handleKeyDown, "data-scope": "focusable", "aria-label": this.label, "aria-controls": `${this.inputId}-listbox` })) : (index.h(index.Fragment, null, index.h("input", { id: this.inputId, type: "text", style: {
                     position: 'absolute',
                     opacity: '0',
                     width: '0',
@@ -464,8 +533,12 @@ const NvFieldmultiselect = class {
          * @returns {any} The JSX for slots mode
          */
         this.renderSlotsMode = () => {
-            var _a, _b, _c, _d;
-            return (index.h(index.Host, { "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { htmlFor: this.inputId }, index.h("slot", { name: "label" }, this.label))), index.h("nv-popover", { ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { class: "input-wrapper-multiselect", slot: "trigger" }, index.h("slot", { name: "before-input" }), index.h("div", { class: "input-container-multiselect", onClick: this.handleInputContainerClickSlots }, index.h("slot", { name: "leading-input" }), (((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0) > 0 && (index.h("nv-badge", { slot: "leading-input", "prevent-auto-close": true, color: "10", dismissible: (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) || 0) > 0, label: `${((_c = this.value) === null || _c === void 0 ? void 0 : _c.length) || 0} ${this.badgeLabel}`, "aria-label": `Clear all ${((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) || 0} ${this.badgeLabel} items`, onCloseClicked: this.handleBadgeCloseSlots })), this.filterable || this.disabled || this.readonly ? (index.h("input", { id: this.inputId, ref: e => (this.inputElement = e), autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.filterText, required: this.required, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInputSlots, onFocus: this.handleInputFocusSlots, onBlur: this.handleInputBlurSlots, onKeyDown: this.handleKeyDown, "data-scope": "focusable", "aria-label": this.label, "aria-controls": `${this.inputId}-listbox` })) : (index.h(index.Fragment, null, index.h("input", { id: this.inputId, type: "text", style: {
+            return (index.h(index.Host, { "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { htmlFor: this.inputId }, index.h("slot", { name: "label" }, this.label))), index.h("nv-popover", { ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { class: "input-wrapper-multiselect", slot: "trigger" }, index.h("slot", { name: "before-input" }), index.h("div", { class: "input-container-multiselect", onClick: this.handleInputContainerClickSlots }, index.h("slot", { name: "leading-input" }), (this.value?.length || 0) > 0 && (index.h("nv-badge", { slot: "leading-input", "prevent-auto-close": true, color: "10", dismissible: (this.value?.length || 0) > 0, label: `${this.value?.length || 0} ${this.badgeLabel}`, "aria-label": `Clear all ${this.value?.length || 0} ${this.badgeLabel} items`, onCloseClicked: this.handleBadgeCloseSlots })), this.filterable || this.disabled || this.readonly ? (index.h("input", { id: this.inputId, ref: e => (this.inputElement = e), autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.filterText, required: this.getRequiredAttributes().useNativeRequired
+                    ? this.required
+                    : undefined, ...(this.getRequiredAttributes().ariaRequiredValue !==
+                    undefined && {
+                    'aria-required': String(this.getRequiredAttributes().ariaRequiredValue),
+                }), disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInputSlots, onFocus: this.handleInputFocusSlots, onBlur: this.handleInputBlurSlots, onKeyDown: this.handleKeyDown, "data-scope": "focusable", "aria-label": this.label, "aria-controls": `${this.inputId}-listbox` })) : (index.h(index.Fragment, null, index.h("input", { id: this.inputId, type: "text", style: {
                     position: 'absolute',
                     opacity: '0',
                     width: '0',
@@ -531,46 +604,13 @@ const NvFieldmultiselect = class {
     //#endregion WATCHERS
     /****************************************************************************/
     //#region LISTENERS
-    /**
-     * Emitted when the input loses focus.
-     * @param {CustomEvent<boolean>} event - The event object containing the focus state.
-     */
-    handleOpenChanged(event) {
-        // Stop propagation to prevent the event from affecting parent components like dialogs
-        event.stopPropagation();
-        // Only update if the event comes from our popover
-        if (event.target === this.popoverElement) {
-            // Only update if open state differs to avoid redundant actions
-            if (this.open !== event.detail) {
-                this.open = event.detail;
-                if (this.open) {
-                    // Filter items only if there is filter text
-                    if (this.filterText) {
-                        this.filterItems();
-                    }
-                }
-                else {
-                    // Clear filter text on close if filterable
-                    if (this.filterable) {
-                        this.clearFilterText();
-                    }
-                    this.handlePopoverClose();
-                }
-                // Reorder content as needed
-                if (this.options) {
-                    this.reorderOptionsContent();
-                }
-                else {
-                    this.reorderSlotContent();
-                }
-            }
-        }
-    }
+    /* eslint-disable nova/native-event-listener */
     /**
      * Listen for the `itemChecked` event emitted by child items.
      * @param {CustomEvent} event - The event object containing the selected value and its checked state.
      */
     handleItemChecked(event) {
+        event.stopPropagation();
         if (this.disabled || this.readonly || this.isBulkOperation) {
             // Skip processing itemChecked events during bulk operations
             return;
@@ -602,6 +642,7 @@ const NvFieldmultiselect = class {
             console.warn('[Event:itemChecked] Received itemChecked event with undefined or null value'); // Warning log
         }
     }
+    /* eslint-enable nova/native-event-listener */
     // Add a listener for the slot content
     handleSlotChange(event) {
         // Check: we only want to reorder if it's the "content" slot
@@ -715,7 +756,6 @@ const NvFieldmultiselect = class {
      * Set the mode state and handle options change.
      */
     componentWillLoad() {
-        var _a;
         // Don't call handleOptionsChange if we are in slots mode
         if (this.options) {
             this.handleOptionsChange(this.options);
@@ -736,7 +776,7 @@ const NvFieldmultiselect = class {
         }
         // Initialize the sorted options array with the parsed options for initial rendering
         if (this.options) {
-            this.sortedOptions = [...((_a = this.options) !== null && _a !== void 0 ? _a : [])];
+            this.sortedOptions = [...(this.options ?? [])];
         }
         // Reset filter if needed
         if (!this.filterText) {
@@ -759,14 +799,17 @@ const NvFieldmultiselect = class {
             this.initializeValueFromSlots();
             this.syncChildComponents();
         }
+        // Build the search index on load
+        this.rebuildSearchIndex();
     }
     /**
-     * Unsubscribe from click outside event.
+     * Unsubscribe from click outside event and clean up worker.
      */
     disconnectedCallback() {
         if (this._boundHandleClickOutside) {
             document.removeEventListener('click', this._boundHandleClickOutside);
         }
+        this.terminateSearchWorker();
     }
     //#endregion LIFECYCLE
     /****************************************************************************/
@@ -917,211 +960,219 @@ const NvFieldmultiselect = class {
     }
     /**
      * Filter multiselect items based on the text entered by the user.
+     * Uses the search engine for optimized filtering with configurable modes.
      */
-    filterItems() {
+    async filterItems() {
         const ul = this.el.querySelector('ul');
         if (!ul)
             return;
-        // Remove existing empty message if any
-        const existingEmptyMessage = ul.querySelector('[data-empty]');
-        if (existingEmptyMessage) {
-            existingEmptyMessage.remove();
-        }
-        if (!this.filterText.trim()) {
-            if (this.options && this.options.length > 0) {
-                // Reset options display
-                const items = Array.from(ul.querySelectorAll('nv-fielddropdownitemcheck'));
-                items.forEach(item => {
-                    item.style.display = '';
-                });
-            }
-            else {
-                // Reset slot items display
-                const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitemcheck'));
-                items.forEach(item => {
-                    item.style.display = '';
-                });
-            }
-            // Reorder with divider
-            const items = Array.from(ul.querySelectorAll('nv-fielddropdownitemcheck'));
-            const selectedItems = items.filter(item => (this.value || []).includes(item.getAttribute('value') || ''));
-            const unselectedItems = items.filter(item => !(this.value || []).includes(item.getAttribute('value') || ''));
-            this.manageDivider(ul, selectedItems, unselectedItems);
-            return;
-        }
-        const normalizedFilter = this.normalizeText(this.filterText);
-        let hasVisibleItems = false;
-        if (this.options && this.options.length > 0) {
-            // Filter options mode
+        this.effectiveFilterMode = i18n_utilsIlwlcG9l.getEffectiveFilterMode(this.filterMode);
+        // Remove existing empty message and truncation message if any
+        ul.querySelector('[data-empty]')?.remove();
+        ul.querySelector('[data-truncated]')?.remove();
+        // Reset truncation state
+        this.resultsTruncated = false;
+        this.totalResults = 0;
+        if (!this.filterText.trim() ||
+            this.filterText.length < this.startFilterAt) {
+            // Reset display and apply maxResults limit
             const items = Array.from(ul.querySelectorAll('nv-fielddropdownitemcheck'));
+            const effectiveMaxResults = i18n_utilsIlwlcG9l.clampMaxResults(this.maxResults);
+            let visibleCount = 0;
             items.forEach(item => {
-                const option = this.options.find(opt => opt.value === item.getAttribute('value'));
-                if (option && !option.isDivider) {
-                    const matchesFilter = this.normalizeText(option.label).includes(normalizedFilter) ||
-                        this.normalizeText(option.value).includes(normalizedFilter);
-                    item.style.display = matchesFilter ? '' : 'none';
-                    if (matchesFilter)
-                        hasVisibleItems = true;
+                if (visibleCount < effectiveMaxResults) {
+                    item.style.display = '';
+                    visibleCount++;
+                }
+                else {
+                    item.style.display = 'none';
                 }
             });
-            // Manage the divider with the visible items
+            // Track truncation
+            this.totalResults = items.length;
+            this.resultsTruncated = items.length > effectiveMaxResults;
+            this.hasFilterResults = visibleCount > 0;
+            // Reorder with divider
             const visibleItems = items.filter(item => item.style.display !== 'none');
-            const visibleSelected = visibleItems.filter(item => (this.value || []).includes(item.getAttribute('value') || ''));
-            const visibleUnselected = visibleItems.filter(item => !(this.value || []).includes(item.getAttribute('value') || ''));
-            this.manageDivider(ul, visibleSelected, visibleUnselected);
-        }
-        else {
-            // Filter slot items mode
-            const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitemcheck'));
-            items.forEach(item => {
-                const label = item.getAttribute('label') || '';
-                const value = item.getAttribute('value') || '';
-                const textContent = item.textContent || '';
-                const matchesFilter = this.normalizeText(label).includes(normalizedFilter) ||
-                    this.normalizeText(value).includes(normalizedFilter) ||
-                    this.normalizeText(textContent).includes(normalizedFilter);
-                item.style.display = matchesFilter ? '' : 'none';
-                if (matchesFilter)
-                    hasVisibleItems = true;
-            });
-        }
-        // Add empty message if no items match the filter
-        if (!hasVisibleItems) {
-            const emptyMessage = document.createElement('li');
-            emptyMessage.setAttribute('data-empty', 'true');
-            emptyMessage.textContent = this.emptyResult;
-            emptyMessage.classList.add('no-results-message');
-            ul.appendChild(emptyMessage);
-        }
-        this.reorderSlotContent();
-    }
-    /**
-     * Filter multiselect items in options mode.
-     */
-    filterItemsOption() {
-        const ul = this.el.querySelector('ul');
-        if (!ul)
+            const selectedItems = visibleItems.filter(item => (this.value || []).includes(item.getAttribute('value') || ''));
+            const unselectedItems = visibleItems.filter(item => !(this.value || []).includes(item.getAttribute('value') || ''));
+            this.manageDivider(ul, selectedItems, unselectedItems);
+            if (this.resultsTruncated) {
+                this.addTruncatedMessage(ul, effectiveMaxResults, items.length);
+            }
             return;
-        const normalizedFilter = this.normalizeText(this.filterText);
+        }
+        // Use advanced search engine
+        const result = await this.performAdvancedSearch();
+        this.resultsTruncated = result.truncated;
+        this.totalResults = result.total;
+        // Create a Set of matching IDs for fast lookup
+        const matchingIds = new Set(result.ids);
         let hasVisibleItems = false;
         const items = Array.from(ul.querySelectorAll('nv-fielddropdownitemcheck'));
-        // Reset items if the filter text is empty
-        if (!this.filterText.trim()) {
-            this.removeEmptyMessageOption(ul);
-            items.forEach(item => {
-                item.style.display = '';
-                item.removeAttribute('aria-hidden'); // Ensure accessibility
-            });
-            this.reorderOptionsContent();
-            this.hasFilterResults = true;
-            return;
-        }
-        // Filter the items
+        const effectiveMaxResults = i18n_utilsIlwlcG9l.clampMaxResults(this.maxResults);
+        let visibleCount = 0;
         items.forEach(item => {
-            const option = this.options.find(opt => opt.value === item.getAttribute('value'));
-            if (option && !option.isDivider) {
-                const matchesFilter = this.normalizeText(option.label).includes(normalizedFilter) ||
-                    this.normalizeText(option.value).includes(normalizedFilter);
-                item.style.display = matchesFilter ? '' : 'none';
-                item.setAttribute('aria-hidden', matchesFilter ? 'false' : 'true'); // Update accessibility
-                if (matchesFilter)
-                    hasVisibleItems = true;
+            const itemValue = item.getAttribute('value') || '';
+            // Check if this item matches
+            const isMatch = matchingIds.has(itemValue);
+            if (isMatch && visibleCount < effectiveMaxResults) {
+                item.style.display = '';
+                hasVisibleItems = true;
+                visibleCount++;
             }
             else {
-                item.style.display = 'none'; // Hide dividers during filtering
-                item.setAttribute('aria-hidden', 'true');
+                item.style.display = 'none';
             }
         });
-        // Update the filter results state
-        this.hasFilterResults = hasVisibleItems;
         // Manage the divider with the visible items
         const visibleItems = items.filter(item => item.style.display !== 'none');
         const visibleSelected = visibleItems.filter(item => (this.value || []).includes(item.getAttribute('value') || ''));
         const visibleUnselected = visibleItems.filter(item => !(this.value || []).includes(item.getAttribute('value') || ''));
         this.manageDivider(ul, visibleSelected, visibleUnselected);
-        // Add or remove the empty message
+        // Add empty message if no items match the filter
+        this.hasFilterResults = hasVisibleItems;
         if (!hasVisibleItems) {
-            this.addEmptyMessageOption(ul);
+            const emptyMessage = document.createElement('li');
+            emptyMessage.setAttribute('data-empty', 'true');
+            emptyMessage.textContent = this.emptyResult;
+            emptyMessage.classList.add('no-results-message');
+            ul.appendChild(emptyMessage);
+        }
+        else if (result.truncated) {
+            this.addTruncatedMessage(ul, result.ids.length, result.total);
+        }
+        if (this.options) {
+            this.reorderOptionsContent();
         }
         else {
-            this.removeEmptyMessageOption(ul);
+            this.reorderSlotContent();
         }
     }
     /**
-     * Filter multiselect items in slots mode
+     * Rebuilds the search index from current items (options prop or slot items).
      */
-    filterSlotsItems() {
-        if (this.options)
-            return;
-        const ul = this.el.querySelector('ul');
-        if (!ul)
-            return;
-        // Remove existing empty message if any
-        const existingEmptyMessage = ul.querySelector('[data-empty]');
-        if (existingEmptyMessage) {
-            existingEmptyMessage.remove();
+    async rebuildSearchIndex() {
+        // Build raw items array for indexing
+        this.rawItems = [];
+        if (this.options?.length) {
+            this.options.forEach((opt, index) => {
+                if (!opt.isDivider) {
+                    this.rawItems.push({
+                        id: opt.value || `opt-${index}`,
+                        label: opt.label || opt.value || '',
+                    });
+                }
+            });
         }
-        // If filter text is empty, reset all items visibility
-        if (!this.filterText.trim()) {
-            this.resetFilter();
-            this.hasFilterResults = true; // Reset filter means we have results
+        else {
+            // Use slot items
+            const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitemcheck'));
+            items.forEach((item, index) => {
+                this.rawItems.push({
+                    id: item.getAttribute('value') || `item-${index}`,
+                    label: item.getAttribute('label') || item.textContent?.trim() || '',
+                });
+            });
+        }
+        // Build local index for main-thread search
+        this.indexedItems = i18n_utilsIlwlcG9l.buildIndex(this.rawItems);
+        // Determine effective filter mode
+        this.effectiveFilterMode = i18n_utilsIlwlcG9l.getEffectiveFilterMode(this.filterMode);
+        // Initialize worker if needed
+        const itemCount = this.rawItems.length;
+        const threshold = i18n_utilsIlwlcG9l.clampWorkerThreshold(this.workerThreshold);
+        if (i18n_utilsIlwlcG9l.shouldUseWorker(itemCount, this.effectiveFilterMode, threshold)) {
+            await this.initSearchWorker();
+        }
+        else {
+            this.terminateSearchWorker();
+        }
+    }
+    /**
+     * Initializes the Web Worker for search operations.
+     * Falls back to main thread if worker is not available.
+     * Note: Fuzzy search now works on main thread with Fuse.js, so no mode change needed.
+     */
+    async initSearchWorker() {
+        if (!i18n_utilsIlwlcG9l.isWorkerSupported()) {
+            // Workers not supported - will use main thread (fuzzy still works with Fuse.js)
             return;
         }
-        const normalizedFilter = this.normalizeText(this.filterText);
-        let hasVisibleItems = false;
-        // Get all items and preserve them in the DOM
-        const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitemcheck'));
-        // Instead of removing/reordering, just hide/show items
-        items.forEach(item => {
-            var _a;
-            const label = item.getAttribute('label') || '';
-            const value = item.getAttribute('value') || '';
-            const textContent = ((_a = item.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
-            const matchesFilter = this.normalizeText(label).includes(normalizedFilter) ||
-                this.normalizeText(value).includes(normalizedFilter) ||
-                this.normalizeText(textContent).includes(normalizedFilter);
-            item.style.display = matchesFilter ? '' : 'none';
-            if (matchesFilter)
-                hasVisibleItems = true;
-        });
-        // Update the filter results state
-        this.hasFilterResults = hasVisibleItems;
-        // Get visible items after filtering
-        const visibleItems = items.filter(item => item.style.display !== 'none');
-        const visibleSelectedItems = visibleItems.filter(item => (this.value || []).includes(item.getAttribute('value') || ''));
-        this.manageDivider(ul, visibleSelectedItems, visibleItems.filter(item => !(this.value || []).includes(item.getAttribute('value') || '')));
-        // Add empty message if no items match the filter
-        if (!hasVisibleItems) {
-            const emptyMessage = document.createElement('li');
-            emptyMessage.setAttribute('data-empty', 'true');
-            emptyMessage.textContent = this.emptyResult;
-            emptyMessage.classList.add('no-results-message');
-            ul.appendChild(emptyMessage);
+        if (!this.workerClient) {
+            this.workerClient = new i18n_utilsIlwlcG9l.SearchWorkerClient();
+            // No fallback mode change needed - fuzzy works on main thread now
         }
+        // Init will silently handle fallback if worker can't be created
+        await this.workerClient.init(this.rawItems);
     }
     /**
-     * Normalizes text by removing accents and converting to lowercase
-     * @param {string} text - The text to normalize
-     * @returns {string} The normalized text
-     *
-     * @example
-     * normalizeText("Café Latte") => "cafe latte"
-     *
-     * @description
-     * This function performs text normalization in three steps:
-     * 1. Decomposes characters into their base form and combining characters (NFD)
-     * 2. Removes all diacritical marks (accents, umlauts, etc.)
-     * 3. Converts to lowercase and trims whitespace
-     *
-     * @see {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/normalize} - MDN documentation on String.normalize()
-     * @see {@link https://en.wikipedia.org/wiki/Unicode_equivalence#Normal_forms} - More info about Unicode normalization forms
+     * Terminates the Web Worker and cleans up resources.
      */
-    normalizeText(text) {
-        return text
-            .normalize('NFD') // Decompose characters into base + combining characters (e.g., é => e + ´)
-            .replace(/[\u0300-\u036f]/g, '') // Remove all diacritical marks (Unicode range for combining characters)
-            .toLowerCase() // Convert to lowercase
-            .trim(); // Remove leading and trailing whitespace
+    terminateSearchWorker() {
+        if (this.workerClient) {
+            this.workerClient.terminate();
+            this.workerClient = null;
+        }
+    }
+    /**
+     * Performs a search over the indexed items, using a Web Worker when available
+     * and falling back to the main thread otherwise.
+     * @returns {Promise<SearchResult>} Resolves with the search results.
+     */
+    async performAdvancedSearch() {
+        // Ensure index is built
+        if (!this.indexedItems.length) {
+            await this.rebuildSearchIndex();
+        }
+        const itemCount = this.rawItems.length;
+        const threshold = i18n_utilsIlwlcG9l.clampWorkerThreshold(this.workerThreshold);
+        const useWorker = i18n_utilsIlwlcG9l.shouldUseWorker(itemCount, this.effectiveFilterMode, threshold);
+        if (useWorker && this.workerClient?.isReady) {
+            this.isSearching = true;
+            try {
+                return await this.workerClient.search(this.filterText, this.effectiveFilterMode, this.maxResults, this.fuzzyThreshold);
+            }
+            catch (error) {
+                console.error('Worker search failed:', error);
+                // Fall back to main thread (fuzzy now works with Fuse.js)
+                return i18n_utilsIlwlcG9l.search(this.indexedItems, {
+                    query: this.filterText,
+                    filterMode: this.effectiveFilterMode,
+                    maxResults: this.maxResults,
+                    startFilterAt: this.startFilterAt,
+                    fuzzyThreshold: this.fuzzyThreshold,
+                });
+            }
+            finally {
+                this.isSearching = false;
+            }
+        }
+        // Use main thread search (fuzzy now works with Fuse.js)
+        return i18n_utilsIlwlcG9l.search(this.indexedItems, {
+            query: this.filterText,
+            filterMode: this.effectiveFilterMode,
+            maxResults: this.maxResults,
+            startFilterAt: this.startFilterAt,
+            fuzzyThreshold: this.fuzzyThreshold,
+        });
+    }
+    /**
+     * Adds a non-selectable list item showing truncation information.
+     * @param {HTMLElement} ul - The list element to which the truncation message will be appended.
+     * @param {number} shown - The number of items currently shown.
+     * @param {number} total - The total number of available items.
+     */
+    addTruncatedMessage(ul, shown, total) {
+        // Remove existing truncation message
+        ul.querySelector('[data-truncated]')?.remove();
+        // Get the text template: use provided text or auto-detect from locale
+        const textTemplate = this.truncatedResultsText || i18n_utilsIlwlcG9l.getTruncatedResultsText(this.locale);
+        const truncatedItem = document.createElement('li');
+        truncatedItem.setAttribute('data-truncated', 'true');
+        truncatedItem.className = 'truncated-message no-results-message';
+        truncatedItem.textContent = i18n_utilsIlwlcG9l.formatTruncatedResults(textTemplate, shown, total);
+        ul.appendChild(truncatedItem);
     }
     handleClickOutside(event) {
         if (this.el.contains(event.target) ||
@@ -1173,21 +1224,6 @@ const NvFieldmultiselect = class {
             console.warn('No visible first item found to focus');
         }
     }
-    addEmptyMessageOption(ul) {
-        const existingMessage = ul.querySelector('[data-empty]');
-        if (existingMessage)
-            return;
-        const emptyMessage = document.createElement('li');
-        emptyMessage.setAttribute('data-empty', 'true');
-        emptyMessage.textContent = this.emptyResult;
-        emptyMessage.classList.add('no-results-message');
-        ul.appendChild(emptyMessage);
-    }
-    removeEmptyMessageOption(ul) {
-        const existingMessage = ul.querySelector('[data-empty]');
-        if (existingMessage)
-            existingMessage.remove();
-    }
     manageDivider(ul, selectedItems, unselectedItems) {
         let divider = ul.querySelector('hr.multiselect-divider');
         if (!divider) {
@@ -1338,6 +1374,77 @@ const NvFieldmultiselect = class {
         // Combine with current this.value (set by code), ensuring uniqueness
         this.value = Array.from(new Set([...(this.value || []), ...checkedValues]));
     }
+    /**
+     * Calculates aria-required and native required values based on props and attributes
+     * @returns {object} Object with ariaRequiredValue and useNativeRequired
+     */
+    getRequiredAttributes() {
+        // Check aria-required from multiple sources:
+        // 1. JavaScript prop (most reliable)
+        // 2. HTML attribute 'aria-required' (direct HTML)
+        // 3. HTML attribute 'aria-required-attr' (from JSX kebab-case conversion)
+        // Check aria-required from multiple sources:
+        // 1. HTML attribute 'aria-required' (direct HTML) - check if explicitly set
+        // 2. JavaScript prop (when prop is explicitly set via JavaScript)
+        // We use hasAttribute to determine if the attribute was explicitly set by the user,
+        // since the prop now defaults to false (to maintain Blazor compatibility)
+        const hasAriaRequiredAttr = this.el.hasAttribute('aria-required') ||
+            this.el.hasAttribute('aria-required-attr');
+        const ariaRequiredFromAttr = hasAriaRequiredAttr
+            ? this.el.getAttribute('aria-required') ||
+                this.el.getAttribute('aria-required-attr')
+            : null;
+        // Use aria-required if the attribute was explicitly set
+        // With reflect: true, setting the prop will also set the attribute
+        const useAriaRequired = hasAriaRequiredAttr;
+        // Determine the value: use attribute if it exists (prop reflects to attribute via reflect: true)
+        // If attribute doesn't exist, the prop was never set and we don't use aria-required
+        const ariaRequiredAttrValue = hasAriaRequiredAttr
+            ? ariaRequiredFromAttr
+            : null;
+        // Determine which attributes to use
+        // If aria-required HTML attribute is present, use it (convert string to boolean)
+        // If required is set and aria-required is not "false", use native required
+        // If aria-required is "false", don't use native required even if required is set
+        const ariaRequiredValue = useAriaRequired
+            ? ariaRequiredAttrValue === 'true' || ariaRequiredAttrValue === ''
+            : undefined;
+        const useNativeRequired = this.required && (!useAriaRequired || ariaRequiredValue === true);
+        return {
+            ariaRequiredValue,
+            useNativeRequired,
+        };
+    }
+    /**
+     * Emitted when the input loses focus.
+     * @param {CustomEvent<boolean>} event - The event object containing the focus state.
+     */
+    handleOpenChanged(event) {
+        // Only update if open state differs to avoid redundant actions
+        if (this.open !== event.detail) {
+            this.open = event.detail;
+            if (this.open) {
+                // Filter items only if there is filter text
+                if (this.filterText) {
+                    this.filterItems();
+                }
+            }
+            else {
+                // Clear filter text on close if filterable
+                if (this.filterable) {
+                    this.clearFilterText();
+                }
+                this.handlePopoverClose();
+            }
+            // Reorder content as needed
+            if (this.options) {
+                this.reorderOptionsContent();
+            }
+            else {
+                this.reorderSlotContent();
+            }
+        }
+    }
     /**
      * Renders description and error description sections
      * @returns {any} The JSX for descriptions
@@ -1364,6 +1471,6 @@ const NvFieldmultiselect = class {
         "open": ["handleOpenChange"]
     }; }
 };
-NvFieldmultiselect.style = NvFieldmultiselectStyle0;
+NvFieldmultiselect.style = nvFieldmultiselectCss;
 
 exports.nv_fieldmultiselect = NvFieldmultiselect;