ng-select2-component 16.0.0 → 17.1.0

package/fesm2022/ng-select2-component.mjs

@@ -1,15 +1,13 @@
-import * as i4 from '@angular/cdk/overlay';
-import { CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
 import * as i0 from '@angular/core';
-import { EventEmitter, signal, TemplateRef, numberAttribute, booleanAttribute, Component, Optional, Self, Attribute, Input, HostBinding, Output, ViewChild, ViewChildren, HostListener, Directive, NgModule } from '@angular/core';
-import { Subject } from 'rxjs';
+import { Directive, input, numberAttribute, booleanAttribute, computed, output, viewChild, viewChildren, signal, TemplateRef, Component, ChangeDetectionStrategy, Optional, Self, Attribute, HostBinding, HostListener } from '@angular/core';
+import { moveItemInArray, CdkDropList, CdkDrag } from '@angular/cdk/drag-drop';
+import { ConnectionPositionPair, CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
+import { NgTemplateOutlet } from '@angular/common';
+import { toObservable } from '@angular/core/rxjs-interop';
+import { InfiniteScrollDirective } from 'ngx-infinite-scroll';
+import { Subject, Subscription } from 'rxjs';
 import * as i1 from '@angular/cdk/scrolling';
 import * as i2 from '@angular/forms';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i3 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i5 from 'ngx-infinite-scroll';
-import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 
 const timeout = 200;
 const unicodePatterns = [
@@ -59,6 +57,24 @@ const unicodePatterns = [
 const defaultMinCountForSearch = 6;
 const protectRegexp = new RegExp('[\\-\\[\\]\\/\\{\\}\\(\\)\\*\\+\\?\\.\\\\\\^\\$\\|]', 'g');
 
+class Select2Hint {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2Hint, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: Select2Hint, isStandalone: true, selector: "select2-hint, ng-select2-hint", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2Hint, decorators: [{
+            type: Directive,
+            args: [{ selector: 'select2-hint, ng-select2-hint' }]
+        }] });
+
+class Select2Label {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2Label, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: Select2Label, isStandalone: true, selector: "select2-label, ng-select2-label", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2Label, decorators: [{
+            type: Directive,
+            args: [{ selector: 'select2-label, ng-select2-label' }]
+        }] });
+
 class Select2Utils {
     static getOptionByValue(data, value) {
         if (Array.isArray(data)) {
@@ -76,7 +92,7 @@ class Select2Utils {
                 }
             }
         }
-        return undefined;
+        return null;
     }
     static getOptionsByValue(data, value, multiple) {
         if (multiple) {
@@ -99,41 +115,37 @@ class Select2Utils {
                 if (options) {
                     for (const option of options) {
                         if (!option.disabled) {
-                            return option.value;
+                            return option;
                         }
                     }
                 }
                 else {
                     const option = groupOrOption;
                     if (!option.disabled) {
-                        return option.value;
+                        return option;
                     }
                 }
             }
         }
         return null;
     }
-    static valueIsNotInFilteredData(filteredData, value) {
-        if (Select2Utils.isNullOrUndefined(value)) {
+    static optionIsNotInFilteredData(filteredData, option) {
+        if (Select2Utils.isNullOrUndefined(option)) {
             return true;
         }
         for (const groupOrOption of filteredData) {
             const options = groupOrOption.options;
-            if (options) {
-                for (const option of options) {
-                    if (option.value === value) {
-                        return false;
-                    }
-                }
+            if (options && options.includes(option)) {
+                return false;
             }
-            else if (groupOrOption.value === value) {
+            else if (groupOrOption === option) {
                 return false;
             }
         }
         return true;
     }
-    static getPreviousOption(filteredData, hoveringValue) {
-        let findIt = Select2Utils.isNullOrUndefined(hoveringValue);
+    static getPreviousOption(filteredData, hoveringOption) {
+        let findIt = Select2Utils.isNullOrUndefined(hoveringOption);
         for (let i = filteredData.length - 1; i >= 0; i--) {
             const groupOrOption = filteredData[i];
             const options = groupOrOption.options;
@@ -144,7 +156,7 @@ class Select2Utils {
                         return option;
                     }
                     if (!findIt) {
-                        findIt = option.value === hoveringValue;
+                        findIt = option === hoveringOption;
                     }
                 }
             }
@@ -154,42 +166,71 @@ class Select2Utils {
                     return option;
                 }
                 if (!findIt) {
-                    findIt = option.value === hoveringValue;
+                    findIt = option === hoveringOption;
                 }
             }
         }
         return null;
     }
-    static getNextOption(filteredData, hoveringValue) {
-        let findIt = Select2Utils.isNullOrUndefined(hoveringValue);
-        for (const groupOrOption of filteredData) {
-            const options = groupOrOption.options;
-            if (options) {
-                for (const option of options) {
+    static getNextOption(filteredData, hoveringOption) {
+        let findIt = Select2Utils.isNullOrUndefined(hoveringOption);
+        if (filteredData) {
+            for (const groupOrOption of filteredData) {
+                const options = groupOrOption.options;
+                if (options) {
+                    for (const option of options) {
+                        if (findIt) {
+                            if (!option.disabled && !option.hide) {
+                                return option;
+                            }
+                        }
+                        else if (!findIt) {
+                            findIt = option === hoveringOption;
+                        }
+                    }
+                }
+                else {
+                    const option = groupOrOption;
                     if (findIt) {
                         if (!option.disabled && !option.hide) {
                             return option;
                         }
                     }
                     else if (!findIt) {
-                        findIt = option.value === hoveringValue;
+                        findIt = option === hoveringOption;
                     }
                 }
             }
-            else {
-                const option = groupOrOption;
-                if (findIt) {
-                    if (!option.disabled && !option.hide) {
-                        return option;
-                    }
-                }
-                else if (!findIt) {
-                    findIt = option.value === hoveringValue;
-                }
-            }
         }
         return null;
     }
+    static getFirstOption(filteredData) {
+        const firstElement = filteredData[0];
+        if (this.isOption(firstElement)) {
+            return firstElement ?? null;
+        }
+        else {
+            return firstElement.options[0] ?? null;
+        }
+    }
+    static getLastOption(filteredData) {
+        const lastElement = filteredData.at(-1);
+        if (!lastElement) {
+            return null;
+        }
+        if (this.isOption(lastElement)) {
+            return lastElement;
+        }
+        else {
+            return lastElement.options.at(-1) ?? null;
+        }
+    }
+    static isGroup(element) {
+        return !!element.options;
+    }
+    static isOption(element) {
+        return !this.isGroup(element);
+    }
     static getReduceData(data, maxResults = 0) {
         if (maxResults > 0) {
             let counter = 0;
@@ -268,11 +309,8 @@ class Select2Utils {
         }
         return result;
     }
-    static isSearchboxHiddex(data, minCountForSearch) {
-        if (minCountForSearch === '' ||
-            minCountForSearch === undefined ||
-            minCountForSearch === null ||
-            isNaN(+minCountForSearch)) {
+    static isSearchboxHidden(data, minCountForSearch) {
+        if (minCountForSearch === undefined || minCountForSearch === null || isNaN(+minCountForSearch)) {
             minCountForSearch = defaultMinCountForSearch;
         }
         const optionCount = Select2Utils.getOptionsCount(data);
@@ -332,68 +370,28 @@ class Select2Utils {
 }
 
 let nextUniqueId = 0;
-const displaySearchStatusList = ['default', 'hidden', 'always'];
+const OPEN_KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' ', 'Home', 'End', 'PageUp', 'PageDown'];
+const ON_OPEN_KEYS = ['Home', 'End', 'PageUp', 'PageDown'];
+const CLOSE_KEYS = ['Escape', 'Tab', { key: 'ArrowUp', altKey: true }];
 class Select2 {
-    /** data of options & optiongrps */
-    set data(data) {
-        this._data = data;
-        this.updateFilteredData(true);
-    }
-    get multiple() {
-        return this._multiple;
-    }
-    set multiple(value) {
-        this._multiple = value;
-        this.ngOnInit();
-    }
-    /** minimal data of show the search field */
-    get minCountForSearch() {
-        return this._minCountForSearch;
-    }
-    set minCountForSearch(value) {
-        this._minCountForSearch = value;
-        this.updateSearchBox();
-    }
-    /** Unique id of the element. */
-    get id() {
-        return this._id;
-    }
-    set id(value) {
-        this._id = value || this._uid;
-    }
-    /** Whether selected items should be hidden. */
-    get disabled() {
-        return this._control ? this._control.disabled : this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = value;
-    }
-    /** The input element's value. */
-    get value() {
-        return this._value;
+    // ----------------------- HostBinding
+    get classMaterial() {
+        return this.styleMode() === 'material';
     }
-    set value(value) {
-        if (this.testValueChange(this._value, value)) {
-            setTimeout(() => {
-                if (this._value === undefined) {
-                    this._value = value ?? null;
-                }
-                this.writeValue(value ?? null);
-            }, 10);
-        }
+    get classNostyle() {
+        return this.styleMode() === 'noStyle';
     }
-    /** Tab index for the select2 element. */
-    get tabIndex() {
-        return this.disabled ? -1 : this._tabIndex;
+    get classBorderless() {
+        return this.styleMode() === 'borderless';
     }
-    set tabIndex(value) {
-        this._tabIndex = value;
+    get select2above() {
+        return !this.overlay() ? this.listPosition() === 'above' : this._isAbobeOverlay();
     }
     get select2Options() {
-        return this.multiple ? this.option : null;
+        return this.multiple() ? (this.selectedOption ?? []) : [];
     }
     get select2Option() {
-        return this.multiple ? null : this.option;
+        return this.multiple() ? null : this.selectedOption;
     }
     get searchText() {
         return this.innerSearchText;
@@ -401,26 +399,32 @@ class Select2 {
     set searchText(text) {
         this.innerSearchText = text;
     }
-    get ariaInvalid() {
-        return this._isErrorState();
-    }
-    get classMaterial() {
-        return this.styleMode === 'material';
-    }
-    get classNostyle() {
-        return this.styleMode === 'noStyle';
-    }
-    get classBorderless() {
-        return this.styleMode === 'borderless';
-    }
-    get select2above() {
-        return !this.overlay ? this.listPosition === 'above' : this._isAbobeOverlay();
+    get disabledState() {
+        return this._control?.disabled ?? this._disabled;
     }
     get _positions() {
-        return this.listPosition === 'auto' ? undefined : null;
+        switch (this.listPosition()) {
+            case 'above':
+                return [
+                    new ConnectionPositionPair({ originX: 'start', originY: 'top' }, { overlayX: 'start', overlayY: 'bottom' }),
+                ];
+            case 'auto':
+                return [
+                    new ConnectionPositionPair({ originX: 'start', originY: 'bottom' }, { overlayX: 'start', overlayY: 'top' }),
+                    new ConnectionPositionPair({ originX: 'start', originY: 'top' }, { overlayX: 'start', overlayY: 'bottom' }),
+                ];
+            default:
+                return [
+                    new ConnectionPositionPair({ originX: 'start', originY: 'bottom' }, { overlayX: 'start', overlayY: 'top' }),
+                ];
+        }
     }
     get resultsElement() {
-        return this.resultContainer?.nativeElement;
+        return this.resultContainer()?.nativeElement;
+    }
+    /** Tab index for the element. */
+    get _tabIndex() {
+        return this.disabledState ? -1 : this.tabIndex();
     }
     constructor(_viewportRuler, _changeDetectorRef, _parentForm, _parentFormGroup, _control, tabIndex) {
         this._viewportRuler = _viewportRuler;
@@ -428,74 +432,146 @@ class Select2 {
         this._parentForm = _parentForm;
         this._parentFormGroup = _parentFormGroup;
         this._control = _control;
-        this.minCharForSearch = 0;
-        this.limitSelection = 0;
-        this.listPosition = 'below';
-        /** use the material style */
-        this.overlay = false;
+        this._uid = `select2-${nextUniqueId++}`;
+        // ----------------------- signal-input
+        /** data of options & option groups */
+        this.data = input.required();
+        /** minimum characters to start filter search */
+        this.minCharForSearch = input(0, { transform: numberAttribute });
+        /** text placeholder */
+        this.displaySearchStatus = input(undefined);
+        /** text placeholder */
+        this.placeholder = input(undefined);
+        /** in multiple: maximum selection element (0 = no limit) */
+        this.limitSelection = input(0, { transform: numberAttribute });
+        /** dropdown position */
+        this.listPosition = input('below');
+        /** overlay with CDK Angular position */
+        this.overlay = input(false, { transform: booleanAttribute });
+        /** select one or more item */
+        this.multiple = input(false, { transform: booleanAttribute });
+        /** drag'n drop list of items in multiple */
+        this.multipleDrag = input(false, { transform: booleanAttribute });
         /** use the material style */
-        this.styleMode = 'default';
+        this.styleMode = input('default');
+        /** message when no result */
+        this.noResultMessage = input();
         /** maximum results limit (0 = no limit) */
-        this.maxResults = 0;
+        this.maxResults = input(0, { transform: numberAttribute });
         /** message when maximum results */
-        this.maxResultsMessage = 'Too many results…';
+        this.maxResultsMessage = input('Too many results…');
         /** infinite scroll distance */
-        this.infiniteScrollDistance = 1.5;
+        this.infiniteScrollDistance = input(1.5, { transform: numberAttribute });
         /** infinite scroll distance */
-        this.infiniteScrollThrottle = 150;
+        this.infiniteScrollThrottle = input(150, { transform: numberAttribute });
         /** infinite scroll activated */
-        this.infiniteScroll = false;
+        this.infiniteScroll = input(false, { transform: booleanAttribute });
         /** auto create if not exist */
-        this.autoCreate = false;
+        this.autoCreate = input(false, { transform: booleanAttribute });
         /** no template for label selection */
-        this.noLabelTemplate = false;
+        this.noLabelTemplate = input(false, { transform: booleanAttribute });
+        /** use it for change the pattern of the filter search */
+        this.editPattern = input(undefined);
+        /** template(s) for formatting */
+        this.templates = input(undefined);
+        /** template for formatting selected option */
+        this.templateSelection = input(undefined);
         /** the max height of the results container when opening the select */
-        this.resultMaxHeight = '200px';
+        this.resultMaxHeight = input('200px');
         /** Active Search event */
-        this.customSearchEnabled = false;
+        this.customSearchEnabled = input(false, { transform: booleanAttribute });
+        /** minimal data of show the search field */
+        this.minCountForSearch = input(undefined, { transform: numberAttribute });
+        /** Unique id of the element. */
+        this.id = input(this._uid);
+        /** Unique id of label element. */
+        this.idLabel = computed(() => `${this.id()}-label`);
+        /** Unique id of combo element. */
+        this.idCombo = computed(() => `${this.id()}-combo`);
+        /** Unique id of options element. */
+        this.idOptions = computed(() => `${this.id()}-options`);
+        /** Unique id of overlay element. */
+        this.idOverlay = computed(() => `${this.id()}-overlay`);
         /** Whether the element is required. */
-        this.required = false;
+        this.required = input(false, { transform: booleanAttribute });
+        /** Whether selected items should be hidden. */
+        this.disabled = input(false, { transform: booleanAttribute });
         /** Whether items are hidden when has. */
-        this.hideSelectedItems = false;
+        this.hideSelectedItems = input(false, { transform: booleanAttribute });
         /** Whether the element is readonly. */
-        this.readonly = false;
+        this.readonly = input(false, { transform: booleanAttribute });
+        /** The input element's value. */
+        this.value = input();
+        /** Tab index for the select2 element. */
+        this.tabIndex = input(0, { transform: numberAttribute });
         /** reset with no selected value */
-        this.resettable = false;
+        this.resettable = input(false, { transform: booleanAttribute });
+        /** selected value when × is clicked */
+        this.resetSelectedValue = input(undefined);
         /** grid: item by line
          * * 0 = no grid
          * * number = item by line (4)
          * * string = minimal size item (100px)
          */
-        this.grid = '';
+        this.grid = input('');
+        /**
+         * Replace selection by a text
+         * * if string: `%size%` = total selected options
+         * * if function: juste show the string
+         */
+        this.selectionOverride = input(undefined);
         /** force selection on one line */
-        this.selectionNoWrap = false;
+        this.selectionNoWrap = input(false, { transform: booleanAttribute });
         /** Add an option to select or remove all (if all is selected) */
-        this.showSelectAll = false;
+        this.showSelectAll = input(false, { transform: booleanAttribute });
         /** Text for remove all options */
-        this.removeAllText = 'Remove all';
+        this.removeAllText = input('Remove all');
         /** Text for select all options */
-        this.selectAllText = 'Select all';
-        this.update = new EventEmitter();
-        this.autoCreateItem = new EventEmitter();
-        this.open = new EventEmitter();
-        this.close = new EventEmitter();
-        this.focus = new EventEmitter();
-        this.blur = new EventEmitter();
-        this.search = new EventEmitter();
-        this.scroll = new EventEmitter();
-        this.removeOption = new EventEmitter();
-        this.option = null;
+        this.selectAllText = input('Select all');
+        // -- WAI related inputs ---
+        /** title attribute applied to the input */
+        this.title = input();
+        /** aria-labelledby attribute applied to the input, to specify en external label */
+        this.ariaLabelledby = input();
+        /** aria-describedby attribute applied to the input */
+        this.ariaDescribedby = input();
+        /** aria-invalid attribute applied to the input, to force error state */
+        this.ariaInvalid = input(false, { transform: booleanAttribute });
+        /** description of the reset button when using 'resettable'. Default value : 'Reset' */
+        this.ariaResetButtonDescription = input('Reset');
+        // ----------------------- output
+        this.update = output();
+        this.autoCreateItem = output();
+        this.open = output();
+        this.close = output();
+        this.focus = output();
+        this.blur = output();
+        this.search = output();
+        this.scroll = output();
+        this.removeOption = output();
+        // ----------------------- signal viewChild
+        this.cdkConnectedOverlay = viewChild.required(CdkConnectedOverlay);
+        this.selection = viewChild.required('selection');
+        this.resultContainer = viewChild('results');
+        this.results = viewChildren('result');
+        this.searchInput = viewChild('searchInput');
+        this.dropdown = viewChild('dropdown');
+        // ----------------------- internal var
+        this.selectedOption = null;
         this.isOpen = false;
         /** Whether the element is focused or not. */
         this.focused = false;
         this.filteredData = signal(undefined);
-        this.hoveringValue = null;
+        this.overlayWidth = '';
+        this.overlayHeight = '';
+        this.hoveringOption = signal(null);
+        this.hoveringOptionId = computed(() => this.getElementId(this.hoveringOption()));
         this.innerSearchText = '';
         this._stateChanges = new Subject();
+        this._data = [];
         this._disabled = false;
-        this._multiple = false;
-        this._uid = `select2-${nextUniqueId++}`;
         this._value = null;
+        this.toObservable = new Subscription();
         /** View -> model callback called when select has been touched */
         this._onTouched = () => {
             // do nothing
@@ -504,25 +580,43 @@ class Select2 {
         this._onChange = () => {
             // do nothing
         };
-        // eslint-disable-next-line no-self-assign
-        this.id = this.id;
-        this._tabIndex = parseInt(tabIndex, 10) || 0;
         if (this._control) {
             this._control.valueAccessor = this;
         }
+        this.toObservable.add(toObservable(this.multiple).subscribe(_multiple => {
+            this.ngOnInit();
+        }));
+        this.toObservable.add(toObservable(this.data).subscribe(_data => {
+            this._data = _data;
+            this.updateFilteredData();
+        }));
+        this.toObservable.add(toObservable(this.minCountForSearch).subscribe(minCountForSearch => {
+            this.updateSearchBox();
+        }));
+        this.toObservable.add(toObservable(this.disabled).subscribe(disabled => {
+            this._disabled = disabled;
+        }));
+        this.toObservable.add(toObservable(this.value).subscribe(value => {
+            if (this.testValueChange(this._value, value)) {
+                if (this._value === undefined) {
+                    this._value = value;
+                }
+                this.writeValue(value);
+            }
+        }));
     }
     clickDetection(e) {
-        if (this.isOpen && focus) {
+        if (this.isOpen) {
             const target = e.target;
             if (!this.ifParentContainsClass(target, 'selection')) {
                 if (!this.ifParentContainsClass(target, 'select2-dropdown')) {
                     this.toggleOpenAndClose();
                 }
-                if (!this.overlay && !this.ifParentContainsId(target, this._id)) {
+                if (!this.overlay() && !this.ifParentContainsId(target, this.id())) {
                     this.clickExit();
                 }
             }
-            else if (!this.ifParentContainsId(target, this._id)) {
+            else if (!this.ifParentContainsId(target, this.id())) {
                 this.toggleOpenAndClose();
                 this.clickExit();
             }
@@ -538,18 +632,18 @@ class Select2 {
                 this.triggerRect();
             }
         });
-        const option = Select2Utils.getOptionsByValue(this._data, this._control ? this._control.value : this.value, this.multiple);
+        const option = Select2Utils.getOptionsByValue(this._data, this._control ? this._control.value : this.value(), this.multiple());
         if (option !== null) {
-            this.option = option;
+            this.selectedOption = option ?? null;
         }
         if (!Array.isArray(option)) {
-            this.hoveringValue = this.value;
+            this.hoveringOption.set(Select2Utils.getOptionByValue(this._data, this.value));
         }
         this.updateSearchBox();
     }
     ngAfterViewInit() {
-        this.cdkConnectedOverlay.positionChange.subscribe((posChange) => {
-            if (this.listPosition === 'auto' &&
+        this.cdkConnectedOverlay().positionChange.subscribe((posChange) => {
+            if (this.listPosition() === 'auto' &&
                 posChange.connectionPair?.originY &&
                 this._overlayPosition !== posChange.connectionPair.originY) {
                 this.triggerRect();
@@ -557,7 +651,7 @@ class Select2 {
                 this._changeDetectorRef.detectChanges();
             }
         });
-        this.selectionElement = this.selection.nativeElement;
+        this.selectionElement = this.selection().nativeElement;
         this.triggerRect();
     }
     ngDoCheck() {
@@ -566,33 +660,42 @@ class Select2 {
         if (this._triggerRect) {
             if (this.overlayWidth !== this._triggerRect.width) {
                 this.overlayWidth = this._triggerRect.width;
+                this._changeDetectorRef.detectChanges();
             }
-            if (this._dropdownRect?.height > 0 && this.overlayHeight !== this._dropdownRect.height) {
-                this.overlayHeight = this.listPosition === 'auto' ? this._dropdownRect.height : 0;
+            if (this._dropdownRect &&
+                this._dropdownRect.height > 0 &&
+                this.overlayHeight !== this._dropdownRect.height) {
+                this.overlayHeight = this.listPosition() === 'auto' ? this._dropdownRect.height : 0;
+                this._changeDetectorRef.detectChanges();
             }
         }
     }
+    ngOnDestroy() {
+        this.toObservable.unsubscribe();
+    }
     updateSearchBox() {
-        const hidden = this.customSearchEnabled
-            ? false
-            : Select2Utils.isSearchboxHiddex(this._data, this._minCountForSearch);
-        if (this.isSearchboxHidden !== hidden) {
-            this.isSearchboxHidden = hidden;
+        if (this.autoCreate() && !this.multiple()) {
+            this.isSearchboxHidden = false;
+        }
+        else {
+            const hidden = this.displaySearchStatus() === 'hidden' ||
+                (this.displaySearchStatus() !== 'always' &&
+                    !this.customSearchEnabled() &&
+                    Select2Utils.isSearchboxHidden(this._data, this.minCountForSearch()));
+            if (this.isSearchboxHidden !== hidden) {
+                this.isSearchboxHidden = hidden;
+            }
         }
-    }
-    hideSearch() {
-        const displaySearchStatus = displaySearchStatusList.indexOf(this.displaySearchStatus) > -1 ? this.displaySearchStatus : 'default';
-        return (displaySearchStatus === 'default' && this.isSearchboxHidden) || displaySearchStatus === 'hidden';
     }
     getOptionStyle(option) {
         return ('select2-results__option ' +
             (option.hide ? 'select2-results__option--hide ' : '') +
-            (option.value === this.hoveringValue ? 'select2-results__option--highlighted ' : '') +
+            (option === this.hoveringOption() ? 'select2-results__option--highlighted ' : '') +
             (option.classes || ''));
     }
     mouseenter(option) {
         if (!option.disabled) {
-            this.hoveringValue = option.value;
+            this.hoveringOption.set(option);
         }
     }
     click(option) {
@@ -601,14 +704,14 @@ class Select2 {
         }
     }
     reset(event) {
-        // const test = Select2Utils.getOptionByValue(this._data, this.resetSelectedValue);
-        // debugger;
-        this.select(this.resetSelectedValue !== undefined
-            ? (Select2Utils.getOptionByValue(this._data, this.resetSelectedValue) ?? null)
+        const resetSelectedValue = this.resetSelectedValue();
+        this.select(resetSelectedValue !== undefined
+            ? (Select2Utils.getOptionByValue(this._data, resetSelectedValue) ?? null)
             : null);
         if (event) {
             this.stopEvent(event);
         }
+        this._focus(true);
     }
     prevChange(event) {
         event.stopPropagation();
@@ -618,35 +721,36 @@ class Select2 {
         event.stopPropagation();
     }
     toggleOpenAndClose(focus = true, open, event) {
-        if (this.disabled) {
+        if (this.disabledState || this.readonly()) {
             return;
         }
         this._focus(focus);
+        const onOpenAction = event && this._testKey(event, ON_OPEN_KEYS);
         const changeEmit = this.isOpen !== (open ?? !this.isOpen);
         this.isOpen = open ?? !this.isOpen;
         if (this.isOpen) {
             if (!this.isSearchboxHidden) {
                 this.innerSearchText = '';
                 this.updateFilteredData();
-                this._focusSearchboxOrResultsElement(focus);
+                this._focusSearchbox(focus);
             }
             if (this.isSearchboxHidden && !changeEmit && event) {
                 this.keyDown(event);
             }
             else {
-                setTimeout(() => {
-                    if (this.option) {
-                        const option = Array.isArray(this.option) ? this.option[0] : this.option;
-                        this.updateScrollFromOption(option);
-                    }
-                    else if (this.resultsElement) {
-                        this.resultsElement.scrollTop = 0;
-                    }
-                    setTimeout(() => {
-                        this.triggerRect();
-                        this.cdkConnectedOverlay?.overlayRef?.updatePosition();
-                    }, 100);
-                });
+                if (this.selectedOption) {
+                    const option = Array.isArray(this.selectedOption) ? this.selectedOption[0] : this.selectedOption;
+                    this.updateScrollFromOption(option);
+                }
+                else if (this.resultsElement) {
+                    this.resultsElement.scrollTop = 0;
+                }
+                if (onOpenAction) {
+                    this.keyDown(event);
+                }
+                this._changeDetectorRef.detectChanges();
+                this.triggerRect();
+                this.cdkConnectedOverlay().overlayRef?.updatePosition();
             }
             if (changeEmit) {
                 this.open.emit(this);
@@ -658,47 +762,50 @@ class Select2 {
         this._changeDetectorRef.markForCheck();
     }
     hasTemplate(option, defaultValue, select = false) {
+        const templates = this.templates();
+        const templatesValue = this.templates();
         return ((select
-            ? this.templates?.[option.templateSelectionId] instanceof TemplateRef ||
-                this.templates?.[`${defaultValue}Selection`] instanceof TemplateRef ||
-                this.templates?.[`templateSelection`] instanceof TemplateRef ||
-                this.templateSelection instanceof TemplateRef
+            ? templates?.[option.templateSelectionId ?? ''] instanceof TemplateRef ||
+                templates?.[`${defaultValue}Selection`] instanceof TemplateRef ||
+                templates?.[`templateSelection`] instanceof TemplateRef ||
+                this.templateSelection() instanceof TemplateRef
             : false) ||
-            this.templates?.[option.templateId] instanceof TemplateRef ||
-            this.templates?.[defaultValue] instanceof TemplateRef ||
-            this.templates?.['template'] instanceof TemplateRef ||
-            this.templates instanceof TemplateRef ||
+            templatesValue?.[option.templateId ?? ''] instanceof TemplateRef ||
+            templatesValue?.[defaultValue] instanceof TemplateRef ||
+            templatesValue?.['template'] instanceof TemplateRef ||
+            templatesValue instanceof TemplateRef ||
             false);
     }
     getTemplate(option, defaultValue, select = false) {
+        const templates = this.templates();
+        const templatesValue = this.templates();
         return this.hasTemplate(option, defaultValue, select)
             ? (select
-                ? this.templates?.[option.templateSelectionId] ||
-                    this.templates?.[`${defaultValue}Selection`] ||
-                    this.templates?.[`templateSelection`] ||
-                    this.templateSelection
+                ? templates?.[option.templateSelectionId ?? ''] ||
+                    templates?.[`${defaultValue}Selection`] ||
+                    templates?.[`templateSelection`] ||
+                    this.templateSelection()
                 : undefined) ||
-                this.templates?.[option.templateId] ||
-                this.templates?.[defaultValue] ||
-                this.templates?.['template'] ||
-                this.templates
+                templatesValue?.[option.templateId ?? ''] ||
+                templatesValue?.[defaultValue] ||
+                templatesValue?.['template'] ||
+                templatesValue
             : undefined;
     }
     triggerRect() {
-        this._triggerRect = this.selectionElement.getBoundingClientRect();
-        this._dropdownRect = this.dropdown?.nativeElement
-            ? this.dropdown.nativeElement.getBoundingClientRect()
-            : undefined;
+        this._triggerRect = this.selectionElement?.getBoundingClientRect();
+        const dropdown = this.dropdown();
+        this._dropdownRect = dropdown?.nativeElement ? dropdown.nativeElement.getBoundingClientRect() : undefined;
     }
     isNumber(o) {
         return !isNaN(o - 0) && o !== null && o !== '' && o !== false;
     }
     selectAll() {
-        if (this.multiple) {
+        if (this.multiple()) {
             if (!this.selectAllTest()) {
                 const options = [];
                 this._data.forEach(e => {
-                    if (e.options) {
+                    if (Select2Utils.isGroup(e)) {
                         e.options.forEach(f => {
                             if (!f.disabled && !f.hide) {
                                 options.push(f);
@@ -709,22 +816,22 @@ class Select2 {
                         options.push(e);
                     }
                 });
-                this.option = options;
-                this.value = options.map(e => e.value);
+                this.selectedOption = options;
+                this.writeValue(options.map(e => e.value));
             }
             else {
-                this.option = [];
-                this.value = [];
+                this.selectedOption = [];
+                this.writeValue([]);
             }
             this.isOpen = false;
             this.close.emit(this);
         }
     }
     selectAllTest() {
-        if (this.multiple && Array.isArray(this.option) && this.option.length) {
+        if (this.multiple() && Array.isArray(this.selectedOption) && this.selectedOption.length) {
             let options = 0;
             this._data.forEach(e => {
-                if (e.options) {
+                if (Select2Utils.isGroup(e)) {
                     e.options.forEach(f => {
                         if (!f.disabled && !f.hide) {
                             options++;
@@ -735,7 +842,7 @@ class Select2 {
                     options++;
                 }
             });
-            return this.option.length === options;
+            return this.selectedOption.length === options;
         }
         return false;
     }
@@ -743,16 +850,15 @@ class Select2 {
         if (option.disabled) {
             return false;
         }
-        return (!this.multiple ||
-            !this.limitSelection ||
-            (Array.isArray(this._value) && this._value.length < this.limitSelection));
+        const limitSelection = this.limitSelection();
+        return (!this.multiple() || !limitSelection || (Array.isArray(this._value) && this._value.length < limitSelection));
     }
     testValueChange(value1, value2) {
         if (((value1 === null || value1 === undefined) && (value2 === null || value2 === undefined)) ||
             value1 === value2) {
             return false;
         }
-        if (this.multiple &&
+        if (this.multiple() &&
             value1?.length &&
             value2?.length &&
             value1.length === value2.length) {
@@ -766,72 +872,69 @@ class Select2 {
         }
         return true;
     }
-    updateFilteredData(writeValue = false) {
-        setTimeout(() => {
-            let result = this._data;
-            if (this.multiple && this.hideSelectedItems) {
-                result = Select2Utils.getFilteredSelectedData(result, this.option);
-            }
-            if (!this.customSearchEnabled && this.searchText && this.searchText.length >= +this.minCharForSearch) {
-                result = Select2Utils.getFilteredData(result, this.searchText, this.editPattern);
-            }
-            if (this.maxResults > 0) {
-                const data = Select2Utils.getReduceData(result, +this.maxResults);
-                result = data.result;
-                this.maxResultsExceeded = data.reduce;
-            }
-            else {
-                this.maxResultsExceeded = false;
-            }
-            if (Select2Utils.valueIsNotInFilteredData(result, this.hoveringValue)) {
-                this.hoveringValue = Select2Utils.getFirstAvailableOption(result);
-            }
-            if (writeValue && this._previousNativeValue !== this._value) {
-                // refresh current selected value
-                this.writeValue(this._control ? this._control.value : this._value);
-            }
-            this.filteredData.set(result);
-            // replace selected options when data change
-            if (this.multiple && Array.isArray(this.option) && this.option.length) {
-                const options = [];
-                const value = this.option.map(e => e.value);
-                this._data.forEach(e => {
-                    if (e.options) {
-                        e.options.forEach(f => {
-                            if (value.includes(f.value)) {
-                                options.push(f);
-                            }
-                        });
-                    }
-                    else if (value.includes(e.value)) {
-                        options.push(e);
-                    }
-                });
-                // preserve selection order
-                this.option = this.option.map(e => options.find(f => f.value === e.value));
-            }
-            else if (!Array.isArray(this.option) && this.option) {
-                let option = undefined;
-                this._data.forEach(e => {
-                    if (e.options) {
-                        e.options.forEach(f => {
-                            if (this.option.value === f.value) {
-                                option = f;
-                            }
-                        });
-                    }
-                    else if (this.option.value === e.value) {
-                        option = e;
-                    }
-                });
-                this.option = option;
-            }
-            this._changeDetectorRef.detectChanges();
-        });
+    updateFilteredData() {
+        let result = this._data;
+        if (this.multiple() && this.hideSelectedItems()) {
+            result = Select2Utils.getFilteredSelectedData(result, this.selectedOption);
+        }
+        if (!this.customSearchEnabled() && this.searchText && this.searchText.length >= +this.minCharForSearch()) {
+            result = Select2Utils.getFilteredData(result, this.searchText, this.editPattern());
+        }
+        if (this.maxResults() > 0) {
+            const data = Select2Utils.getReduceData(result, +this.maxResults());
+            result = data.result;
+            this.maxResultsExceeded = data.reduce;
+        }
+        else {
+            this.maxResultsExceeded = false;
+        }
+        if (Select2Utils.optionIsNotInFilteredData(result, this.hoveringOption())) {
+            this.hoveringOption.set(Select2Utils.getFirstAvailableOption(result));
+        }
+        this.filteredData.set(result);
+        // replace selected options when data change
+        if (this.multiple() && Array.isArray(this.selectedOption) && this.selectedOption.length) {
+            const options = [];
+            const value = this.selectedOption.map(e => e.value);
+            this._data.forEach(e => {
+                if (Select2Utils.isGroup(e)) {
+                    e.options.forEach(f => {
+                        if (value.includes(f.value)) {
+                            options.push(f);
+                        }
+                    });
+                }
+                else if (value.includes(e.value)) {
+                    options.push(e);
+                }
+            });
+            // preserve selection order
+            this.selectedOption = this.selectedOption.map(e => options.find(f => f.value === e.value));
+        }
+        else if (!Array.isArray(this.selectedOption) && this.selectedOption) {
+            let option = null;
+            this._data.forEach(e => {
+                if (Select2Utils.isGroup(e)) {
+                    e.options.forEach(f => {
+                        if (this.selectedOption.value === f.value) {
+                            option = f;
+                        }
+                    });
+                }
+                else if (this.selectedOption.value === e.value) {
+                    option = e;
+                }
+            });
+            this.selectedOption = option;
+        }
+        this._changeDetectorRef.detectChanges();
     }
     clickExit() {
         this._focus(false);
     }
+    isInSelect(elt) {
+        return this.ifParentContainsId(elt, this.id()) || this.ifParentContainsId(elt, this.idOverlay());
+    }
     ifParentContainsClass(element, cssClass) {
         return this.getParentElementByClass(element, cssClass) !== null;
     }
@@ -883,13 +986,13 @@ class Select2 {
             'select2-results__option',
         ]);
     }
-    focusin() {
-        if (!this.disabled) {
-            this._focus(true);
+    focusin(options) {
+        if (!this.disabledState) {
+            this._focus(true, options);
         }
     }
-    focusout() {
-        if (this.selectionElement && !this.selectionElement.classList.contains('select2-focused')) {
+    focusout(event) {
+        if (!event.relatedTarget || !this.isInSelect(event.relatedTarget)) {
             this._focus(false);
             this._onTouched();
         }
@@ -897,8 +1000,9 @@ class Select2 {
     select(option, emit = true) {
         let value;
         if (option !== null && option !== undefined) {
-            if (this.multiple) {
-                const options = this.option;
+            if (this.multiple()) {
+                this.selectedOption ??= [];
+                const options = this.selectedOption;
                 const index = options.findIndex(op => op.value === option.value);
                 if (index === -1) {
                     options.push(option);
@@ -906,29 +1010,29 @@ class Select2 {
                 else {
                     options.splice(index, 1);
                 }
-                value = this.option.map(op => op.value);
+                value = this.selectedOption.map(op => op.value);
             }
             else {
-                this.option = option;
+                this.selectedOption = option;
                 if (this.isOpen) {
                     this.isOpen = false;
                     this.close.emit(this);
                     this.selectionElement?.focus();
                 }
-                value = this.option.value;
+                value = this.selectedOption.value;
                 if (!option && this._value === null) {
-                    this._value = value ?? null;
+                    this._value = value;
                 }
             }
         }
         else {
             // when remove value
-            if (Array.isArray(this.option) ? this.option?.length : this.option) {
+            if (Array.isArray(this.selectedOption) ? this.selectedOption?.length : this.selectedOption) {
                 value = '';
             }
-            this.option = null;
+            this.selectedOption = null;
         }
-        if (this.multiple && this.hideSelectedItems) {
+        if (this.multiple() && this.hideSelectedItems()) {
             this.updateFilteredData();
         }
         emit &&= value !== undefined && this.testDiffValue(this._value, value);
@@ -936,13 +1040,9 @@ class Select2 {
             this._onChange(value);
         }
         if (emit) {
-            this._value = value ?? null;
+            this.writeValue(value);
             setTimeout(() => {
-                this.update.emit({
-                    component: this,
-                    value: this._value,
-                    options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
-                });
+                this.updateEvent(value);
             });
         }
     }
@@ -950,48 +1050,60 @@ class Select2 {
         return Array.isArray(val1) ? val1?.length !== val2?.length : val1 !== val2;
     }
     keyDown(event, create = false) {
-        if (create && this._testKey(event, ['Enter', 13])) {
+        if (create && this._testKey(event, ['Enter'])) {
             this.createAndAdd(event);
         }
-        else if (this._testKey(event, ['ArrowDown', 40])) {
+        else if (this._testKey(event, [{ key: 'ArrowDown', altKey: false }])) {
             this.moveDown();
             event.preventDefault();
         }
-        else if (this._testKey(event, ['ArrowUp', 38])) {
+        else if (this._testKey(event, [{ key: 'ArrowUp', altKey: false }])) {
             this.moveUp();
             event.preventDefault();
         }
-        else if (this._testKey(event, ['Enter', 13])) {
+        else if (this._testKey(event, ['Home'])) {
+            this.moveStart();
+            event.preventDefault();
+        }
+        else if (this._testKey(event, ['End'])) {
+            this.moveEnd();
+            event.preventDefault();
+        }
+        else if (this._testKey(event, ['PageUp'])) {
+            this.moveUp(10);
+            event.preventDefault();
+        }
+        else if (this._testKey(event, ['PageDown'])) {
+            this.moveDown(10);
+            event.preventDefault();
+        }
+        else if (this._testKey(event, ['Enter']) || (this.isSearchboxHidden && this._testKey(event, [' ']))) {
             this.selectByEnter();
             event.preventDefault();
         }
-        else if (this._testKey(event, ['Escape', 'Tab', 9, 27]) && this.isOpen) {
+        else if (this._testKey(event, CLOSE_KEYS) && this.isOpen) {
             this.toggleOpenAndClose();
-            this._focus(false);
+            this._focus(true);
         }
     }
     openKey(event, create = false) {
-        if (create && this._testKey(event, ['Enter', 13])) {
+        if (create && this._testKey(event, ['Enter'])) {
             this.createAndAdd(event);
         }
-        else if (this._testKey(event, ['ArrowDown', 'ArrowUp', 'Enter', 40, 38, 13])) {
+        else if (this._testKey(event, OPEN_KEYS)) {
             this.toggleOpenAndClose(true, true, event);
             event.preventDefault();
         }
-        else if (this._testKey(event, ['Escape', 'Tab', 9, 27])) {
+        else if (this._testKey(event, CLOSE_KEYS)) {
             if (this.isOpen) {
-                this.toggleOpenAndClose(false);
+                this.toggleOpenAndClose();
                 this._onTouched();
-                event.preventDefault();
-            }
-            else {
-                this._focus(false);
             }
         }
     }
     searchUpdate(e) {
         this.searchText = e.target.value;
-        if (!this.customSearchEnabled) {
+        if (!this.customSearchEnabled()) {
             this.updateFilteredData();
         }
         else {
@@ -1007,32 +1119,28 @@ class Select2 {
             });
         }
     }
-    trackBy(_index, item) {
-        return item.value;
-    }
     isSelected(option) {
-        return Select2Utils.isSelected(this.option, option, this.multiple);
+        return Select2Utils.isSelected(this.selectedOption, option, this.multiple());
     }
     isDisabled(option) {
         return option.disabled ? 'true' : 'false';
     }
     removeSelection(e, option) {
-        Select2Utils.removeSelection(this.option, option);
-        if (this.multiple && this.hideSelectedItems) {
+        if (this.readonly() || this.disabledState) {
+            return;
+        }
+        Select2Utils.removeSelection(this.selectedOption, option);
+        if (this.multiple() && this.hideSelectedItems()) {
             this.updateFilteredData();
         }
-        const value = this.option.map(op => op.value);
+        const value = this.selectedOption.map(op => op.value);
         if (this._control) {
             this._onChange(value);
         }
         else {
             this._value = value ?? null;
         }
-        this.update.emit({
-            component: this,
-            value: value,
-            options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
-        });
+        this.updateEvent(value);
         this.removeOption.emit({
             component: this,
             value: value,
@@ -1041,7 +1149,10 @@ class Select2 {
         e.preventDefault();
         e.stopPropagation();
         if (this.isOpen) {
-            this._focusSearchboxOrResultsElement();
+            this._focusSearchbox();
+        }
+        else {
+            this._focus(true);
         }
     }
     /**
@@ -1049,7 +1160,11 @@ class Select2 {
      * @param value
      */
     writeValue(value) {
+        this.selectedOption = null;
         this._setSelectionByValue(value);
+        if (this.testValueChange(this._value, value)) {
+            this._value = value;
+        }
     }
     /**
      * Saves a callback function to be invoked when the select's value
@@ -1077,7 +1192,7 @@ class Select2 {
      * @param isDisabled
      */
     setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
+        this._disabled = isDisabled;
     }
     onScroll(way) {
         this.scroll.emit({
@@ -1087,6 +1202,15 @@ class Select2 {
             data: this._data,
         });
     }
+    drop(event) {
+        if (Array.isArray(this.selectedOption)) {
+            moveItemInArray(this.selectedOption, event.previousIndex, event.currentIndex);
+            const value = this.selectedOption.map(e => e.value);
+            this.writeValue(value);
+            this._value = value;
+            this.updateEvent(value);
+        }
+    }
     _isErrorState() {
         const isInvalid = this._control?.invalid;
         const isTouched = this._control?.touched;
@@ -1094,18 +1218,64 @@ class Select2 {
         return !!(isInvalid && (isTouched || isSubmitted));
     }
     _selectionOverrideLabel() {
-        if (typeof this.selectionOverride === 'function') {
-            return this.selectionOverride({
+        const selectionOverride = this.selectionOverride();
+        if (typeof selectionOverride === 'function') {
+            return selectionOverride({
                 size: this.optionsSize(),
-                options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
+                options: Array.isArray(this.selectedOption)
+                    ? this.selectedOption
+                    : this.selectedOption
+                        ? [this.selectedOption]
+                        : null,
             });
         }
-        else if (typeof this.selectionOverride === 'string') {
-            return this.selectionOverride.replaceAll('%size%', `${this.optionsSize()}`);
+        else if (typeof selectionOverride === 'string') {
+            return selectionOverride.replaceAll('%size%', `${this.optionsSize()}`);
         }
+        return undefined;
+    }
+    getElementId(elt) {
+        if (!elt) {
+            return null;
+        }
+        const [i, j] = this._getElementPath(elt);
+        const toSuffix = (index) => (index !== undefined ? `-${index}` : '');
+        return elt.id ?? `${this.id()}-option${toSuffix(i)}${toSuffix(j)}`;
+    }
+    _getElementPath(elt) {
+        for (let i = 0; i < this._data.length; i++) {
+            const optionOrGroup = this._data[i];
+            if (optionOrGroup === elt) {
+                return [i];
+            }
+            else if (Select2Utils.isGroup(optionOrGroup)) {
+                const j = optionOrGroup.options.findIndex(o => o === elt);
+                if (j >= 0) {
+                    return [i, j];
+                }
+            }
+        }
+        return [];
+    }
+    _toGroup(group) {
+        return group;
+    }
+    _toOption(option) {
+        return option;
+    }
+    updateEvent(value) {
+        this.update.emit({
+            component: this,
+            value: value,
+            options: Array.isArray(this.selectedOption)
+                ? this.selectedOption
+                : this.selectedOption
+                    ? [this.selectedOption]
+                    : null,
+        });
     }
     optionsSize() {
-        return Array.isArray(this.option) ? this.option.length : this.option ? 1 : 0;
+        return Array.isArray(this.selectedOption) ? this.selectedOption.length : this.selectedOption ? 1 : 0;
     }
     addItem(value) {
         let item = Select2Utils.getOptionByValue(this._data, value);
@@ -1121,27 +1291,43 @@ class Select2 {
     createAndAdd(e) {
         const value = e.target.value;
         if (value.trim()) {
+            e.target.value = '';
+            this.searchText = '';
             const item = this.addItem(value.trim());
             this.click(item);
-            e.target.value = '';
+            this.updateFilteredData();
             this.autoCreateItem.emit({
                 value: item,
                 component: this,
-                options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
+                options: Array.isArray(this.selectedOption)
+                    ? this.selectedOption
+                    : this.selectedOption
+                        ? [this.selectedOption]
+                        : null,
             });
         }
         this.stopEvent(e);
     }
-    moveUp() {
-        this.updateScrollFromOption(Select2Utils.getPreviousOption(this.filteredData(), this.hoveringValue));
+    moveUp(times = 1) {
+        for (let i = 0; i < times; i++) {
+            this.updateScrollFromOption(Select2Utils.getPreviousOption(this.filteredData(), this.hoveringOption()));
+        }
+    }
+    moveDown(times = 1) {
+        for (let i = 0; i < times; i++) {
+            this.updateScrollFromOption(Select2Utils.getNextOption(this.filteredData(), this.hoveringOption()));
+        }
+    }
+    moveStart() {
+        this.updateScrollFromOption(Select2Utils.getFirstOption(this.filteredData()));
     }
-    moveDown() {
-        this.updateScrollFromOption(Select2Utils.getNextOption(this.filteredData(), this.hoveringValue));
+    moveEnd() {
+        this.updateScrollFromOption(Select2Utils.getLastOption(this.filteredData()));
     }
     updateScrollFromOption(option) {
         if (option) {
-            this.hoveringValue = option.value;
-            const domElement = this.results.find(r => r.nativeElement.innerText.trim() === option.label);
+            this.hoveringOption.set(option);
+            const domElement = this.results().find(r => r.nativeElement.innerText.trim() === option.label);
             if (domElement && this.resultsElement) {
                 this.resultsElement.scrollTop = 0;
                 const listClientRect = this.resultsElement.getBoundingClientRect();
@@ -1151,77 +1337,58 @@ class Select2 {
         }
     }
     selectByEnter() {
-        if (this.hoveringValue) {
-            const option = Select2Utils.getOptionByValue(this._data, this.hoveringValue);
-            this.select(option);
+        if (this.hoveringOption()) {
+            this.select(this.hoveringOption());
         }
     }
     _testKey(event, refs = []) {
-        return this._isKey(this._getKey(event), refs);
-    }
-    _getKey(event) {
-        let code;
-        if (event.key !== undefined) {
-            code = event.key;
-        }
-        else if (event['keyIdentifier'] !== undefined) {
-            code = event['keyIdentifier'];
-        }
-        else if (event['keyCode'] !== undefined) {
-            code = event['keyCode'];
-        }
-        else {
-            event.preventDefault();
-        }
-        return code;
-    }
-    _isKey(code, refs = []) {
-        return refs && refs.length > 0 ? refs.indexOf(code) !== -1 : false;
+        const { key, altKey } = event;
+        return refs.some(ref => {
+            if (typeof ref === 'string') {
+                return ref === key;
+            }
+            else {
+                return key === ref.key && altKey === ref.altKey;
+            }
+        });
     }
     /**
      * Sets the selected option based on a value. If no option can be
      * found with the designated value, the select trigger is cleared.
      */
     _setSelectionByValue(value) {
-        if (this.option || (value !== undefined && value !== null)) {
+        if (this.selectedOption || (value !== undefined && value !== null)) {
             const isArray = Array.isArray(value);
-            if (this.multiple && value && !isArray) {
+            if (this.multiple() && value && !isArray) {
                 throw new Error('Non array value.');
             }
             else if (this._data) {
-                if (this.multiple) {
-                    this.option = []; // if value is null, then empty option and return
+                if (this.multiple()) {
+                    if (!Array.isArray(this.selectedOption)) {
+                        this.selectedOption = []; // if value is null, then empty option and return
+                    }
                     if (isArray) {
                         // value is not null. Preselect value
-                        const selectedValues = Select2Utils.getOptionsByValue(this._data, value, this.multiple);
-                        selectedValues.map(item => this.select(item, false));
+                        Select2Utils.getOptionsByValue(this._data, value, this.multiple()).forEach(item => this.select(item, false));
                         this._value ??= value;
                         if (this.testDiffValue(this._value, value)) {
-                            this.update.emit({
-                                component: this,
-                                value: value,
-                                options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
-                            });
+                            this.updateEvent(value);
                         }
                     }
                     else if (value === null) {
                         // fix if value is null
-                        this.value = [];
+                        this._value = [];
                         this.reset();
                         this.select(null, false);
                         if (this.testDiffValue(this._value, value)) {
                             this._value = [];
-                            this.update.emit({
-                                component: this,
-                                value: this._value,
-                                options: Array.isArray(this.option) ? this.option : this.option ? [this.option] : null,
-                            });
+                            this.updateEvent(this._value);
                         }
                     }
                 }
                 else {
-                    this._value ??= value;
-                    this.select(Select2Utils.getOptionByValue(this._data, value));
+                    this._value = value;
+                    this.select(Select2Utils.getOptionByValue(this._data, this._value));
                 }
             }
             else if (this._control) {
@@ -1232,25 +1399,44 @@ class Select2 {
     }
     /** Does some manual dirty checking on the native input `value` property. */
     _dirtyCheckNativeValue() {
-        const newValue = this.value;
+        const newValue = this.value();
         if (this._previousNativeValue !== newValue) {
             this._previousNativeValue = newValue;
             this._stateChanges.next();
         }
     }
-    _focusSearchboxOrResultsElement(focus = true) {
+    _focusSearchbox(focus = true) {
         if (!this.isSearchboxHidden) {
             setTimeout(() => {
-                if (this.searchInput && this.searchInput.nativeElement && focus) {
-                    this.searchInput.nativeElement.focus();
+                const searchInput = this.searchInput();
+                if (searchInput && searchInput.nativeElement && focus) {
+                    searchInput.nativeElement.focus();
                 }
             });
-            if (this.resultsElement && focus) {
-                this.resultsElement.focus();
+        }
+    }
+    _focus(state, options) {
+        if (state) {
+            const eltToFocus = !this.isSearchboxHidden && this.isOpen
+                ? this.searchInput().nativeElement
+                : this.selection().nativeElement;
+            if (document.activeElement !== eltToFocus) {
+                eltToFocus.focus(options);
             }
         }
+        else if (document.activeElement === this.selection()?.nativeElement ||
+            document.activeElement === this.searchInput()?.nativeElement) {
+            document.activeElement.blur();
+        }
+        this._updateFocusState(state);
     }
-    _focus(state) {
+    _isAbobeOverlay() {
+        const listPosition = this.listPosition();
+        return this.overlay() && this._overlayPosition && listPosition === 'auto'
+            ? this._overlayPosition === 'top'
+            : listPosition === 'above';
+    }
+    _updateFocusState(state) {
         if (!state && this.focused) {
             this.focused = state;
             this.blur.emit(this);
@@ -1260,17 +1446,15 @@ class Select2 {
             this.focus.emit(this);
         }
     }
-    _isAbobeOverlay() {
-        return this.overlay && this._overlayPosition && this.listPosition === 'auto'
-            ? this._overlayPosition === 'top'
-            : this.listPosition === 'above';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2, deps: [{ token: i1.ViewportRuler }, { token: i0.ChangeDetectorRef }, { token: i2.NgForm, optional: true }, { token: i2.FormGroupDirective, optional: true }, { token: i2.NgControl, optional: true, self: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: Select2, isStandalone: false, selector: "select2", inputs: { data: "data", minCharForSearch: ["minCharForSearch", "minCharForSearch", numberAttribute], displaySearchStatus: "displaySearchStatus", placeholder: "placeholder", limitSelection: ["limitSelection", "limitSelection", numberAttribute], listPosition: "listPosition", multiple: ["multiple", "multiple", booleanAttribute], overlay: ["overlay", "overlay", booleanAttribute], styleMode: "styleMode", noResultMessage: "noResultMessage", maxResults: ["maxResults", "maxResults", numberAttribute], maxResultsMessage: "maxResultsMessage", infiniteScrollDistance: ["infiniteScrollDistance", "infiniteScrollDistance", numberAttribute], infiniteScrollThrottle: ["infiniteScrollThrottle", "infiniteScrollThrottle", numberAttribute], infiniteScroll: ["infiniteScroll", "infiniteScroll", booleanAttribute], autoCreate: ["autoCreate", "autoCreate", booleanAttribute], noLabelTemplate: ["noLabelTemplate", "noLabelTemplate", booleanAttribute], editPattern: "editPattern", templates: "templates", templateSelection: "templateSelection", resultMaxHeight: "resultMaxHeight", customSearchEnabled: ["customSearchEnabled", "customSearchEnabled", booleanAttribute], minCountForSearch: ["minCountForSearch", "minCountForSearch", numberAttribute], id: "id", required: ["required", "required", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], hideSelectedItems: ["hideSelectedItems", "hideSelectedItems", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], value: "value", tabIndex: ["tabIndex", "tabIndex", numberAttribute], resettable: ["resettable", "resettable", booleanAttribute], resetSelectedValue: "resetSelectedValue", grid: "grid", selectionOverride: "selectionOverride", selectionNoWrap: ["selectionNoWrap", "selectionNoWrap", booleanAttribute], showSelectAll: ["showSelectAll", "showSelectAll", booleanAttribute], removeAllText: "removeAllText", selectAllText: "selectAllText" }, outputs: { update: "update", autoCreateItem: "autoCreateItem", open: "open", close: "close", focus: "focus", blur: "blur", search: "search", scroll: "scroll", removeOption: "removeOption" }, host: { listeners: { "document:click": "clickDetection($event)" }, properties: { "id": "this.id", "class.select2-selection-nowrap": "this.selectionNoWrap", "attr.aria-invalid": "this.ariaInvalid", "class.material": "this.classMaterial", "class.nostyle": "this.classNostyle", "class.borderless": "this.classBorderless", "class.select2-above": "this.select2above" } }, viewQueries: [{ propertyName: "cdkConnectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "selection", first: true, predicate: ["selection"], descendants: true, static: true }, { propertyName: "resultContainer", first: true, predicate: ["results"], descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "results", predicate: ["result"], descendants: true }], ngImport: i0, template: "<div class=\"select2-label\" (click)=\"toggleOpenAndClose()\">\n    <ng-content select=\"select2-label\"></ng-content>\n    @if (required) {\n        <span class=\"select2-required\"></span>\n    }\n</div>\n\n<div\n    class=\"select2 select2-container select2-container--default\"\n    [class.select2-container--focus]=\"focused\"\n    [class.select2-container--below]=\"!select2above\"\n    [class.select2-container--above]=\"select2above\"\n    [class.select2-container--open]=\"isOpen\"\n    [class.select2-container--disabled]=\"disabled\"\n>\n    <div\n        class=\"selection\"\n        #selection\n        #trigger=\"cdkOverlayOrigin\"\n        [tabindex]=\"!this.isOpen ? tabIndex : '-1'\"\n        (click)=\"toggleOpenAndClose()\"\n        (focus)=\"focusin()\"\n        (blur)=\"focusout()\"\n        (keydown)=\"openKey($event)\"\n        cdkOverlayOrigin\n        [class.select2-focused]=\"focused\"\n    >\n        <div\n            class=\"select2-selection\"\n            [class.select2-selection--multiple]=\"multiple\"\n            [class.select2-selection--single]=\"!multiple\"\n            role=\"combobox\"\n        >\n            @if (selectionOverride) {\n                <span class=\"select2-selection__override\" [innerHTML]=\"_selectionOverrideLabel()\"></span>\n                @if (\n                    !multiple && resettable && resetSelectedValue !== value && select2Option && !(disabled || readonly)\n                ) {\n                    <span (click)=\"reset($event)\" class=\"select2-selection__reset\" role=\"presentation\">\u00D7</span>\n                }\n            } @else if (!multiple) {\n                <span class=\"select2-selection__rendered\" [title]=\"select2Option?.label || ''\">\n                    @if (!select2Option) {\n                        <span>&nbsp;</span>\n                    }\n                    @if (select2Option) {\n                        @if (!hasTemplate(select2Option, 'option', true) || noLabelTemplate) {\n                            <span [innerHTML]=\"select2Option.label\"></span>\n                        } @else {\n                            <ng-container\n                                *ngTemplateOutlet=\"getTemplate(select2Option, 'option', true); context: select2Option\"\n                            ></ng-container>\n                        }\n                    }\n                    <span\n                        [class.select2-selection__placeholder__option]=\"option\"\n                        class=\"select2-selection__placeholder\"\n                        >{{ placeholder }}</span\n                    >\n                </span>\n                @if (resettable && resetSelectedValue !== value && select2Option && !(disabled || readonly)) {\n                    <span (click)=\"reset($event)\" class=\"select2-selection__reset\" role=\"presentation\">\u00D7</span>\n                }\n                <span class=\"select2-selection__arrow\" role=\"presentation\"> </span>\n            } @else {\n                <ul class=\"select2-selection__rendered\">\n                    @if (!autoCreate) {\n                        <span\n                            [class.select2-selection__placeholder__option]=\"select2Options?.length > 0\"\n                            class=\"select2-selection__placeholder\"\n                            >{{ placeholder }}</span\n                        >\n                    }\n                    @for (op of option || []; track trackBy($index, op)) {\n                        <li\n                            class=\"select2-selection__choice\"\n                            [title]=\"op.label\"\n                            tabindex=\"0\"\n                            (keydown.enter)=\"removeSelection($event, op)\"\n                        >\n                            @if (!(disabled || readonly)) {\n                                <span\n                                    (click)=\"removeSelection($event, op)\"\n                                    class=\"select2-selection__choice__remove\"\n                                    role=\"presentation\"\n                                    >\u00D7</span\n                                >\n                            }\n                            @if (!hasTemplate(op, 'option', true) || noLabelTemplate) {\n                                <span [innerHTML]=\"op.label\"></span>\n                            } @else {\n                                <ng-container\n                                    *ngTemplateOutlet=\"getTemplate(op, 'option', true); context: op\"\n                                ></ng-container>\n                            }\n                        </li>\n                    }\n                    @if (autoCreate) {\n                        <li\n                            class=\"select2-selection__auto-create\"\n                            (focus)=\"stopEvent($event)\"\n                            (blur)=\"stopEvent($event)\"\n                        >\n                            <input\n                                [id]=\"id + '-create-field'\"\n                                (click)=\"toggleOpenAndClose(false, true); stopEvent($event)\"\n                                (keydown)=\"keyDown($event, true)\"\n                                (keyup)=\"searchUpdate($event)\"\n                                (change)=\"prevChange($event)\"\n                                class=\"select2-create__field\"\n                                type=\"search\"\n                                role=\"textbox\"\n                                autocomplete=\"off\"\n                                autocorrect=\"off\"\n                                autocapitalize=\"off\"\n                                spellcheck=\"false\"\n                            />\n                        </li>\n                    }\n                </ul>\n            }\n        </div>\n    </div>\n    @if (!overlay) {\n        <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n    }\n\n    <div class=\"select2-subscript-wrapper\">\n        <ng-content select=\"select2-hint\"></ng-content>\n    </div>\n</div>\n\n<ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"select2-overlay-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"this.isOpen && overlay\"\n    [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n    [cdkConnectedOverlayHeight]=\"overlayHeight\"\n    [cdkConnectedOverlayPositions]=\"_positions\"\n    (backdropClick)=\"toggleOpenAndClose()\"\n>\n    <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #containerTemplate>\n    <div\n        class=\"select2-container select2-container--default select2-container-dropdown\"\n        [class.select2-container--open]=\"isOpen\"\n        [class.select2-overlay]=\"overlay\"\n        [class.select2-position-auto]=\"listPosition === 'auto'\"\n        [class.select2-style-borderless]=\"styleMode === 'borderless'\"\n    >\n        <div\n            #dropdown\n            class=\"select2-dropdown\"\n            [class.select2-dropdown--below]=\"!select2above\"\n            [class.select2-dropdown--above]=\"select2above\"\n        >\n            <div class=\"select2-search select2-search--dropdown\" [class.select2-search--hide]=\"hideSearch()\">\n                <input\n                    #searchInput\n                    [id]=\"id + '-search-field'\"\n                    [value]=\"searchText\"\n                    (keydown)=\"keyDown($event, autoCreate)\"\n                    (keyup)=\"searchUpdate($event)\"\n                    (change)=\"prevChange($event)\"\n                    class=\"select2-search__field\"\n                    type=\"search\"\n                    role=\"textbox\"\n                    autocomplete=\"off\"\n                    autocorrect=\"off\"\n                    autocapitalize=\"off\"\n                    spellcheck=\"false\"\n                    [attr.tabindex]=\"this.isOpen ? tabIndex : '-1'\"\n                />\n            </div>\n\n            <div class=\"select2-results\">\n                <ul\n                    #results\n                    class=\"select2-results__options\"\n                    [class.select2-grid]=\"grid && isNumber(grid)\"\n                    [class.select2-grid-auto]=\"grid && !isNumber(grid)\"\n                    [style.max-height]=\"resultMaxHeight\"\n                    [style.--grid-size]=\"grid || null\"\n                    role=\"tree\"\n                    tabindex=\"-1\"\n                    infiniteScroll\n                    [infiniteScrollDisabled]=\"!infiniteScroll && !isOpen\"\n                    [infiniteScrollDistance]=\"infiniteScrollDistance\"\n                    [infiniteScrollThrottle]=\"infiniteScrollThrottle\"\n                    [infiniteScrollContainer]=\"results\"\n                    (scrolled)=\"onScroll('down')\"\n                    (scrolledUp)=\"onScroll('up')\"\n                    (keydown)=\"keyDown($event)\"\n                >\n                    @if (showSelectAll && multiple) {\n                        <li\n                            class=\"select2-results__option select2-selectall\"\n                            (click)=\"selectAll()\"\n                            tabindex=\"1\"\n                            aria-selected\n                        >\n                            <div class=\"select2-label-content\">\n                                {{ selectAllTest() ? removeAllText : selectAllText }}\n                            </div>\n                        </li>\n                    }\n\n                    @for (groupOrOption of filteredData(); track trackBy(i, groupOrOption); let i = $index) {\n                        @if (groupOrOption.options !== undefined) {\n                            <li class=\"select2-results__option\" role=\"group\">\n                                @if (!hasTemplate(groupOrOption, 'group')) {\n                                    <strong\n                                        [attr.class]=\"\n                                            'select2-results__group' +\n                                            (groupOrOption.classes ? ' ' + groupOrOption.classes : '')\n                                        \"\n                                        [innerHTML]=\"groupOrOption.label\"\n                                    ></strong>\n                                } @else {\n                                    <ng-container\n                                        *ngTemplateOutlet=\"getTemplate(groupOrOption, 'group'); context: groupOrOption\"\n                                    >\n                                    </ng-container>\n                                }\n                                <ul class=\"select2-results__options select2-results__options--nested\">\n                                    @for (option of groupOrOption.options; track trackBy(j, option); let j = $index) {\n                                        <li\n                                            #result\n                                            [id]=\"option.id || id + '-option-' + i + '-' + j\"\n                                            [class]=\"getOptionStyle(option)\"\n                                            role=\"treeitem\"\n                                            [attr.aria-selected]=\"isSelected(option)\"\n                                            [attr.aria-disabled]=\"isDisabled(option)\"\n                                            (mouseenter)=\"mouseenter(option)\"\n                                            (click)=\"click(option)\"\n                                        >\n                                            @if (!hasTemplate(option, 'option')) {\n                                                <div class=\"select2-label-content\" [innerHTML]=\"option.label\"></div>\n                                            } @else {\n                                                <ng-container\n                                                    *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"\n                                                >\n                                                </ng-container>\n                                            }\n                                        </li>\n                                    }\n                                </ul>\n                            </li>\n                        } @else {\n                            <li\n                                #result\n                                [id]=\"groupOrOption.id || id + '-option-' + i\"\n                                [class]=\"getOptionStyle(groupOrOption)\"\n                                role=\"treeitem\"\n                                [attr.aria-selected]=\"isSelected(groupOrOption)\"\n                                [attr.aria-disabled]=\"isDisabled(groupOrOption)\"\n                                (mouseenter)=\"mouseenter(groupOrOption)\"\n                                (click)=\"click(groupOrOption)\"\n                            >\n                                @if (!hasTemplate(groupOrOption, 'option')) {\n                                    <div [innerHTML]=\"groupOrOption.label\" class=\"select2-label-content\"></div>\n                                } @else {\n                                    <ng-container\n                                        *ngTemplateOutlet=\"getTemplate(groupOrOption, 'option'); context: groupOrOption\"\n                                    >\n                                    </ng-container>\n                                }\n                            </li>\n\n                            <ng-template #li>\n                                <ng-container\n                                    *ngTemplateOutlet=\"getTemplate(groupOrOption, 'option'); context: groupOrOption\"\n                                >\n                                </ng-container>\n                            </ng-template>\n                        }\n                    }\n                    @if (!filteredData()?.length && noResultMessage) {\n                        <li class=\"select2-no-result select2-results__option\" [innerHTML]=\"noResultMessage\"></li>\n                    }\n                    @if (maxResultsExceeded) {\n                        <li\n                            class=\"select2-too-much-result select2-results__option\"\n                            [innerHTML]=\"maxResultsMessage\"\n                        ></li>\n                    }\n                </ul>\n            </div>\n        </div>\n    </div>\n</ng-template>\n", styles: [".select2-label{color:var(--select2-label-text-color, #000)}.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle;width:100%}.select2-container .select2-container-dropdown{position:absolute;width:0px;opacity:0}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:var(--select2-single-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding:var(--select2-selection-padding, 0 0 0 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:var(--select2-multiple-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-flex;overflow:hidden;padding-left:8px;padding-bottom:2px;text-overflow:ellipsis;white-space:nowrap;flex-wrap:wrap;gap:var(--select2-selection-multiple-gap, 2px 5px)}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__auto-create{flex:1 1 150px;min-width:150px;display:flex}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field{width:100%;border:0}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field:focus{border:0;outline:0}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;padding:0}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{background:var(--select2-dropdown-background, white);border:1px solid var(--select2-dropdown-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);box-sizing:border-box;display:block;position:absolute;width:100%;z-index:1051;height:0;overflow:hidden}.select2-dropdown .select2-label-content{display:contents}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:var(--select2-option-padding, 6px);-webkit-user-select:none;user-select:none;color:var(--select2-option-text-color, #000)}.select2-results__option[aria-selected]{cursor:pointer}.select2-container.select2-container-dropdown.select2-container--open{width:100%;opacity:1}.select2-container--open .select2-dropdown{overflow:auto;height:auto}.select2-container--open .select2-dropdown--above{border-bottom:var(--select2-dropdown-above-border-bottom, none);border-bottom-left-radius:var(--select2-dropdown-above-border-bottom-left-radius, 0);border-bottom-right-radius:var(--select2-dropdown-above-border-bottom-right-radius, 0);bottom:27px;display:flex;flex-direction:column-reverse}.select2-container--open .select2-dropdown--below{border-top:var(--select2-dropdown-below-border-top, none);border-top-left-radius:var(--select2-dropdown-below-border-top-left-radius, 0);border-top-right-radius:var(--select2-dropdown-below-border-top-right-radius, 0)}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99}.select2-required:before{content:\"*\";color:var(--select2-required-color, red)}.select2-hidden-accessible{border:0!important;clip:rect(0 0 0 0)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.select2-container--default .select2-selection--single{background:var(--select2-selection-background, #fff);border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);display:flex}.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--select2-selection-text-color, #111);line-height:var(--select2-selection-line-height, 28px)}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:700}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--select2-placeholder-color, #999)}.select2-container--default .select2-selection--single .select2-selection__placeholder span{overflow:hidden;white-space:nowrap;text-overflow:var(--select2-placeholder-overflow, ellipsis)}.select2-container--default .select2-selection--single .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--single .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--single .select2-selection__reset,.select2-container--default .select2-selection--single .select2-selection__arrow{display:flex;width:20px;align-items:center;justify-content:center}.select2-container--default .select2-selection--single .select2-selection__arrow:before{content:\" \";border-color:var(--select2-arrow-color, #888) transparent;border-style:solid;border-width:5px 4px 0;height:0;width:0}.select2-container--default .select2-selection--single .select2-selection__reset{color:var(--select2-reset-color, #999)}.select2-container--default.select2-container--disabled .select2-selection--single{background:var(--select2-selection-disabled-background, #eee);cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow:before{border-color:transparent transparent var(--select2-arrow-color, #888);border-width:0 4px 5px}.select2-container--default .select2-selection--multiple{background:var(--select2-selection-background, #fff);border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);cursor:text;display:flex}.select2-container--default .select2-selection--multiple .select2-selection__rendered{flex:1 1 auto;box-sizing:border-box;list-style:none;margin:0;padding:var(--select2-selection-multiple-padding, 2px 5px);width:100%;min-height:1em;align-items:center}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{list-style:none;line-height:var(--select2-selection-choice-line-height, 20px)}.select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;width:100%;color:var(--select2-placeholder-color, #999);margin-top:5px;float:left;overflow:hidden;white-space:nowrap;text-overflow:var(--select2-placeholder-overflow, ellipsis)}.select2-container--default .select2-selection--multiple .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--multiple .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;float:right;font-weight:700;margin-top:5px;margin-right:10px}.select2-container--default .select2-selection--multiple .select2-selection__choice{color:var(--select2-selection-choice-text-color, #000);background:var(--select2-selection-choice-background, #e4e4e4);border:1px solid var(--select2-selection-choice-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);cursor:default;padding:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:var(--select2-selection-choice-close-color, #999);cursor:pointer;display:inline-block;font-weight:700;margin-right:2px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:var(--select2-selection-choice-hover-close-color, #333)}.select2-container--default.select2-container--focused .select2-selection--multiple{border:solid var(--select2-selection-focus-border-color, #000) 1px;outline:none}.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:solid var(--select2-selection-focus-border-color, #000) 1px;outline:none}.select2-container--default.select2-container--disabled .select2-selection--multiple{background:var(--select2-selection-disabled-background, #eee);cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--select2-search-border-color, #aaa);background:1px solid var(--select2-search-background, #fff);border-radius:var(--select2-search-border-radius, 0px)}.select2-container--default .select2-search--inline .select2-search__field{background:transparent;border:none;outline:none;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{overflow-y:auto}.select2-container--default .select2-results__option[role=group]{padding:0;grid-column:col-start/col-end}.select2-container--default .select2-results__option[aria-disabled=true]{color:var(--select2-option-disabled-text-color, #999);background:var(--select2-option-disabled-background, transparent)}.select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-option-selected-text-color, #000);background:var(--select2-option-selected-background, #ddd)}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-option-highlighted-background, #5897fb);color:var(--select2-option-highlighted-text-color, #fff)}.select2-container--default .select2-results__option--hide{display:none}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px;color:var(--select2-option-group-text-color, gray);background:var(--select2-option-group-background, transparent)}.select2-no-result{color:var(--select2-no-result-color, #888);font-style:var(--select2-no-result-font-style, italic)}.select2-too-much-result{color:var(--select2-too-much-result-color, #888);font-style:var(--select2-too-much-font-style, italic)}.select2-grid,.select2-grid ul{display:grid;grid-template-columns:[col-start] repeat(var(--grid-size),1fr) [col-end]}.select2-grid-auto,.select2-grid-auto ul{display:grid;grid-template-columns:[col-start] repeat(auto-fill,minmax(var(--grid-size, 100px),1fr)) [col-end]}.select2-container--default .select2-grid ul,.select2-container--default .select2-grid-auto ul{padding-left:var(--select2-option-padding, 6px)}.select2-container--default .select2-grid ul .select2-results__group,.select2-container--default .select2-grid-auto ul .select2-results__group{padding-left:0}.select2-container--default .select2-grid ul .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{padding-left:var(--select2-option-padding, 6px)}:host.nostyle .select2-dropdown{border-color:transparent}:host.nostyle .select2-selection--single,:host.nostyle .select2-selection--multiple{background:transparent;border-color:transparent}:host.nostyle .select2-container--default .select2-focused .select2-selection--single,:host.nostyle .select2-container--default .select2-focused .select2-selection--multiple,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{background:transparent;border-color:transparent}:host.borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}:host.borderless .select2-selection--single,:host.borderless .select2-selection--multiple{background:transparent;border-color:transparent}:host.borderless .select2-container--default .select2-focused .select2-selection--single,:host.borderless .select2-container--default .select2-focused .select2-selection--multiple,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{background:transparent;border-color:transparent}:host.select2-selection-nowrap .select2-selection--single.select2-selection,:host.select2-selection-nowrap .select2-selection--single.select2-selection span,:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection span,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{display:flex;flex-wrap:nowrap}:host.material{display:inline-block;width:300px}:host.material>.select2-container{padding-bottom:1.29688em;vertical-align:inherit}:host.material>.select2-container .selection{padding:.4375em 0;border-top:.84375em solid transparent;display:inline-flex;align-items:baseline;width:100%;height:auto}:host.material .select2-container--default .select2-selection--single,:host.material .select2-container--default .select2-selection--multiple{width:100%;border:0;border-radius:0;height:24px;box-sizing:border-box}:host.material .select2-container--default .select2-selection--single:before,:host.material .select2-container--default .select2-selection--multiple:before{content:\" \";display:block;position:absolute;bottom:1.65em;background:var(--select2-material-underline, #ddd);height:1px;width:100%}:host.material .select2-container--default .select2-selection--single:after,:host.material .select2-container--default .select2-selection--multiple:after{content:\" \";display:block;position:absolute;bottom:1.63em;background:var(--select2-material-underline-active, #5a419e);height:2px;width:0%;left:50%;transition:none}:host.material .select2-container--default .select2-selection--single .select2-selection__rendered,:host.material .select2-container--default .select2-selection--multiple .select2-selection__rendered{padding-left:1px;line-height:inherit}:host.material .select2-container--default .select2-selection--single .select2-selection__placeholder,:host.material .select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;color:var(--select2-material-placeholder-color, rgba(0, 0, 0, .38));transition:transform .3s;position:absolute;transform-origin:0 21px;left:0;top:20px}:host.material .select2-container--default .select2-container--open{left:0;bottom:1.6em}:host.material .select2-container--default .select2-selection__placeholder__option{transform:translateY(-1.5em) scale(.75) perspective(100px) translateZ(.001px);width:133.33333%}:host.material .select2-container--default .select2-selection__arrow{top:20px}:host.material .select2-container--default.select2-container--open .select2-selection--single:after,:host.material .select2-container--default.select2-container--open .select2-selection--multiple:after,:host.material .select2-container--default .select2-focused .select2-selection--single:after,:host.material .select2-container--default .select2-focused .select2-selection--multiple:after{transition:width .3s cubic-bezier(.12,1,.77,1),left .3s cubic-bezier(.12,1,.77,1);width:100%;left:0%}:host.material .select2-container--default .select2-dropdown{border-radius:0;border:0;box-shadow:0 5px 5px #00000080}:host.material .select2-container--default .select2-results__option[aria-selected=true],:host.material .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-material-option-selected-background, rgba(0, 0, 0, .04));color:var(--select2-material-option-highlighted-text-color, #000)}:host.material .select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-material-option-selected-text-color, #ff5722)}:host.material .select2-container--default.select2-container--disabled .select2-selection--single,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple{background:transparent}:host.material .select2-container--default.select2-container--disabled .select2-selection--single:before,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple:before{background:var(--select2-material-underline-disabled, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-size:4px 1px;background-repeat:repeat-x;background-position:0 bottom}:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:after,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:after{background:var(--select2-material-underline-invalid, red)}:host.material:not(.select2-container--open) .select2-focused .select2-selection--single,:host.material:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:0}:host.material .select2-subscript-wrapper{position:absolute;top:calc(100% - 1.72917em);font-size:75%;color:var(--select2-hint-text-color, #888)}::ng-deep .select2-overlay-backdrop{background:var(--select2-overlay-backdrop, transparent)}::ng-deep .cdk-overlay-container .select2-container .select2-dropdown.select2-dropdown--above{bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown{margin-bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown.select2-dropdown--above{bottom:0;margin-bottom:0;margin-top:28px}::ng-deep .cdk-overlay-container .select2-style-borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}@supports (-moz-appearance: none){select2.material .select2-container--default .select2-selection--single,select2.material .select2-container--default .select2-selection--multiple{height:26px}}\n"], dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i4.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i5.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2, deps: [{ token: i1.ViewportRuler }, { token: i0.ChangeDetectorRef }, { token: i2.NgForm, optional: true }, { token: i2.FormGroupDirective, optional: true }, { token: i2.NgControl, optional: true, self: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: Select2, isStandalone: true, selector: "select2, ng-select2", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, minCharForSearch: { classPropertyName: "minCharForSearch", publicName: "minCharForSearch", isSignal: true, isRequired: false, transformFunction: null }, displaySearchStatus: { classPropertyName: "displaySearchStatus", publicName: "displaySearchStatus", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, limitSelection: { classPropertyName: "limitSelection", publicName: "limitSelection", isSignal: true, isRequired: false, transformFunction: null }, listPosition: { classPropertyName: "listPosition", publicName: "listPosition", isSignal: true, isRequired: false, transformFunction: null }, overlay: { classPropertyName: "overlay", publicName: "overlay", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, multipleDrag: { classPropertyName: "multipleDrag", publicName: "multipleDrag", isSignal: true, isRequired: false, transformFunction: null }, styleMode: { classPropertyName: "styleMode", publicName: "styleMode", isSignal: true, isRequired: false, transformFunction: null }, noResultMessage: { classPropertyName: "noResultMessage", publicName: "noResultMessage", isSignal: true, isRequired: false, transformFunction: null }, maxResults: { classPropertyName: "maxResults", publicName: "maxResults", isSignal: true, isRequired: false, transformFunction: null }, maxResultsMessage: { classPropertyName: "maxResultsMessage", publicName: "maxResultsMessage", isSignal: true, isRequired: false, transformFunction: null }, infiniteScrollDistance: { classPropertyName: "infiniteScrollDistance", publicName: "infiniteScrollDistance", isSignal: true, isRequired: false, transformFunction: null }, infiniteScrollThrottle: { classPropertyName: "infiniteScrollThrottle", publicName: "infiniteScrollThrottle", isSignal: true, isRequired: false, transformFunction: null }, infiniteScroll: { classPropertyName: "infiniteScroll", publicName: "infiniteScroll", isSignal: true, isRequired: false, transformFunction: null }, autoCreate: { classPropertyName: "autoCreate", publicName: "autoCreate", isSignal: true, isRequired: false, transformFunction: null }, noLabelTemplate: { classPropertyName: "noLabelTemplate", publicName: "noLabelTemplate", isSignal: true, isRequired: false, transformFunction: null }, editPattern: { classPropertyName: "editPattern", publicName: "editPattern", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null }, templateSelection: { classPropertyName: "templateSelection", publicName: "templateSelection", isSignal: true, isRequired: false, transformFunction: null }, resultMaxHeight: { classPropertyName: "resultMaxHeight", publicName: "resultMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, customSearchEnabled: { classPropertyName: "customSearchEnabled", publicName: "customSearchEnabled", isSignal: true, isRequired: false, transformFunction: null }, minCountForSearch: { classPropertyName: "minCountForSearch", publicName: "minCountForSearch", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideSelectedItems: { classPropertyName: "hideSelectedItems", publicName: "hideSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null }, resettable: { classPropertyName: "resettable", publicName: "resettable", isSignal: true, isRequired: false, transformFunction: null }, resetSelectedValue: { classPropertyName: "resetSelectedValue", publicName: "resetSelectedValue", isSignal: true, isRequired: false, transformFunction: null }, grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: false, transformFunction: null }, selectionOverride: { classPropertyName: "selectionOverride", publicName: "selectionOverride", isSignal: true, isRequired: false, transformFunction: null }, selectionNoWrap: { classPropertyName: "selectionNoWrap", publicName: "selectionNoWrap", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, removeAllText: { classPropertyName: "removeAllText", publicName: "removeAllText", isSignal: true, isRequired: false, transformFunction: null }, selectAllText: { classPropertyName: "selectAllText", publicName: "selectAllText", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: true, isRequired: false, transformFunction: null }, ariaInvalid: { classPropertyName: "ariaInvalid", publicName: "ariaInvalid", isSignal: true, isRequired: false, transformFunction: null }, ariaResetButtonDescription: { classPropertyName: "ariaResetButtonDescription", publicName: "ariaResetButtonDescription", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { update: "update", autoCreateItem: "autoCreateItem", open: "open", close: "close", focus: "focus", blur: "blur", search: "search", scroll: "scroll", removeOption: "removeOption" }, host: { listeners: { "document:click": "clickDetection($event)" }, properties: { "id": "id()", "class.select2-selection-nowrap": "selectionNoWrap()", "class.material": "this.classMaterial", "class.nostyle": "this.classNostyle", "class.borderless": "this.classBorderless", "class.select2-above": "this.select2above" } }, viewQueries: [{ propertyName: "cdkConnectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "selection", first: true, predicate: ["selection"], descendants: true, isSignal: true }, { propertyName: "resultContainer", first: true, predicate: ["results"], descendants: true, isSignal: true }, { propertyName: "results", predicate: ["result"], descendants: true, isSignal: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, isSignal: true }], ngImport: i0, template: "<label class=\"select2-label\" (click)=\"toggleOpenAndClose()\" [id]=\"idLabel()\">\n  <ng-content select=\"select2-label, ng-select2-label\"></ng-content>\n  @if (required()) {\n    <span class=\"select2-required\" aria-hidden=\"true\"></span>\n  }\n</label>\n\n<div\n  class=\"select2 select2-container select2-container--default\"\n  [class.select2-container--focus]=\"focused\"\n  [class.select2-container--below]=\"!select2above\"\n  [class.select2-container--above]=\"select2above\"\n  [class.select2-container--open]=\"isOpen\"\n  [class.select2-container--disabled]=\"disabled()\"\n  [class.select2-container--readonly]=\"readonly()\"\n>\n  <div\n    [id]=\"idCombo()\"\n    role=\"combobox\"\n    class=\"selection\"\n    #selection\n    #trigger=\"cdkOverlayOrigin\"\n    [tabindex]=\"!this.isOpen ? _tabIndex : '-1'\"\n    [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n    [attr.aria-expanded]=\"isOpen\"\n    aria-haspopup=\"listbox\"\n    [attr.aria-controls]=\"idOptions()\"\n    [attr.aria-activedescendant]=\"isOpen ? hoveringOptionId() : null\"\n    [attr.aria-describedby]=\"ariaDescribedby()\"\n    [attr.title]=\"title()\"\n    [attr.aria-invalid]=\"_isErrorState() || ariaInvalid() ? 'true' : null\"\n    [attr.aria-required]=\"required() ? 'true' : null\"\n    [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\"\n    (click)=\"toggleOpenAndClose(); $event.stopPropagation()\"\n    (focus)=\"focusin()\"\n    (focusout)=\"focusout($event)\"\n    (keydown)=\"openKey($event)\"\n    cdkOverlayOrigin\n    [class.select2-focused]=\"focused\"\n  >\n    <div\n      class=\"select2-selection\"\n      [class.select2-selection--multiple]=\"multiple()\"\n      [class.select2-selection--single]=\"!multiple()\"\n    >\n      @if (selectionOverride()) {\n        <span class=\"select2-selection__override\" [innerHTML]=\"_selectionOverrideLabel()\"></span>\n\n        @if (\n          resettable() &&\n          !(disabled() || readonly()) &&\n          resetSelectedValue() !== _value &&\n          ((!multiple() && select2Option) || (multiple() && select2Options.length > 0))\n        ) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n      } @else if (!multiple()) {\n        <span class=\"select2-selection__rendered\" [title]=\"select2Option?.label || ''\">\n          @if (!select2Option) {\n            <span>&nbsp;</span>\n          }\n          @if (select2Option) {\n            @if (!hasTemplate(select2Option, 'option', true) || noLabelTemplate()) {\n              <span [innerHTML]=\"select2Option.label\"></span>\n            } @else {\n              <ng-container\n                *ngTemplateOutlet=\"getTemplate(select2Option, 'option', true); context: select2Option\"\n              ></ng-container>\n            }\n          }\n          <span\n            [class.select2-selection__placeholder__option]=\"selectedOption\"\n            class=\"select2-selection__placeholder\"\n            >{{ placeholder() }}</span\n          >\n        </span>\n\n        @if (resettable() && resetSelectedValue() !== _value && select2Option && !(disabled() || readonly())) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n        <span class=\"select2-selection__arrow\" role=\"presentation\"> </span>\n      } @else {\n        <ul\n          class=\"select2-selection__rendered\"\n          cdkDropList\n          cdkDropListOrientation=\"mixed\"\n          [cdkDropListDisabled]=\"!multipleDrag()\"\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @if (!autoCreate()) {\n            <span\n              [class.select2-selection__placeholder__option]=\"select2Options.length > 0\"\n              class=\"select2-selection__placeholder\"\n              >{{ placeholder() }}</span\n            >\n          }\n          @for (op of selectedOption || []; track op) {\n            <li\n              class=\"select2-selection__choice\"\n              [title]=\"op.label\"\n              tabindex=\"0\"\n              (focus)=\"_updateFocusState(true)\"\n              (keydown.enter)=\"removeSelection($event, op)\"\n              cdkDrag\n\n            >\n              @if (!(disabled() || readonly())) {\n                <span\n                  (click)=\"removeSelection($event, op)\"\n                  class=\"select2-selection__choice__remove\"\n                  role=\"presentation\"\n                  aria-hidden=\"true\"\n                  >\u00D7</span\n                >\n              }\n              @if (!hasTemplate(op, 'option', true) || noLabelTemplate()) {\n                <span [innerHTML]=\"op.label\"></span>\n              } @else {\n                <ng-container *ngTemplateOutlet=\"getTemplate(op, 'option', true); context: op\"></ng-container>\n              }\n            </li>\n          }\n          @if (autoCreate()) {\n            <li class=\"select2-selection__auto-create\" (focus)=\"stopEvent($event)\" (blur)=\"stopEvent($event)\">\n              <input\n                [id]=\"id() + '-create-field'\"\n                (click)=\"toggleOpenAndClose(false, true); stopEvent($event)\"\n                (keydown)=\"keyDown($event, true)\"\n                (keyup)=\"searchUpdate($event)\"\n                (change)=\"prevChange($event)\"\n                class=\"select2-create__field\"\n                type=\"search\"\n                role=\"textbox\"\n                autocomplete=\"off\"\n                autocorrect=\"off\"\n                autocapitalize=\"off\"\n                spellcheck=\"false\"\n              />\n            </li>\n          }\n        </ul>\n        @if (resettable() && $any(selectedOption)?.length > 0 && !(disabled() || readonly())) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n      }\n    </div>\n  </div>\n  @if (!overlay()) {\n    <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n  }\n\n  <div class=\"select2-subscript-wrapper\">\n    <ng-content select=\"select2-hint, ng-select2-hint\"></ng-content>\n  </div>\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"select2-overlay-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"this.isOpen && overlay()\"\n  [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n  [cdkConnectedOverlayHeight]=\"overlayHeight\"\n  [cdkConnectedOverlayPositions]=\"_positions\"\n  (backdropClick)=\"toggleOpenAndClose()\"\n>\n  <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #containerTemplate>\n  <div\n    [id]=\"idOverlay()\"\n    class=\"select2-container select2-container--default select2-container-dropdown\"\n    [class.select2-container--open]=\"isOpen\"\n    [class.select2-overlay]=\"overlay()\"\n    [class.select2-position-auto]=\"listPosition() === 'auto'\"\n    [class.select2-style-borderless]=\"styleMode() === 'borderless'\"\n  >\n    <div\n      #dropdown\n      class=\"select2-dropdown\"\n      [class.select2-dropdown--below]=\"!select2above\"\n      [class.select2-dropdown--above]=\"select2above\"\n    >\n      <div class=\"select2-search select2-search--dropdown\" [class.select2-search--hide]=\"isSearchboxHidden\">\n        <input\n          #searchInput\n          [id]=\"id() + '-search-field'\"\n          [value]=\"searchText\"\n          (keydown)=\"keyDown($event, autoCreate())\"\n          (keyup)=\"searchUpdate($event)\"\n          (change)=\"prevChange($event)\"\n          class=\"select2-search__field\"\n          type=\"search\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          autocorrect=\"off\"\n          autocapitalize=\"off\"\n          spellcheck=\"false\"\n          [attr.tabindex]=\"this.isOpen ? _tabIndex : '-1'\"\n          [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"idOptions()\"\n          aria-expanded=\"true\"\n          [attr.aria-activedescendant]=\"hoveringOptionId()\"\n        />\n      </div>\n\n      <div class=\"select2-results\">\n        <ul\n          [id]=\"idOptions()\"\n          #results\n          class=\"select2-results__options\"\n          [class.select2-grid]=\"grid() && isNumber(grid())\"\n          [class.select2-grid-auto]=\"grid() && !isNumber(grid())\"\n          [style.max-height]=\"resultMaxHeight()\"\n          [style.--grid-size]=\"grid() || null\"\n          role=\"listbox\"\n          tabindex=\"-1\"\n          infiniteScroll\n          [infiniteScrollDisabled]=\"!infiniteScroll() && !isOpen\"\n          [infiniteScrollDistance]=\"infiniteScrollDistance()\"\n          [infiniteScrollThrottle]=\"infiniteScrollThrottle()\"\n          [infiniteScrollContainer]=\"results\"\n          [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n          [attr.aria-multiselectable]=\"multiple()\"\n          [attr.aria-activedescendant]=\"hoveringOptionId()\"\n          (scrolled)=\"onScroll('down')\"\n          (scrolledUp)=\"onScroll('up')\"\n          (keydown)=\"keyDown($event)\"\n        >\n          @if (showSelectAll() && multiple()) {\n            <li class=\"select2-results__option select2-selectall\" (click)=\"selectAll()\" tabindex=\"1\" aria-selected>\n              <div class=\"select2-label-content\">\n                {{ selectAllTest() ? removeAllText() : selectAllText() }}\n              </div>\n            </li>\n          }\n\n          @for (groupOrOption of filteredData(); track groupOrOption; let i = $index) {\n            @let group = _toGroup(groupOrOption);\n            @if (group.options !== undefined) {\n              <li class=\"select2-results__option select2-results__group\">\n                <span [id]=\"getElementId(groupOrOption)\">\n                  @if (!hasTemplate(group, 'group')) {\n                    <strong\n                      [attr.class]=\"'select2-results__group' + (group.classes ? ' ' + group.classes : '')\"\n                      [innerHTML]=\"group.label\"\n                    ></strong>\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"getTemplate(group, 'group'); context: group\"> </ng-container>\n                  }\n                </span>\n                <ul\n                  class=\"select2-results__options select2-results__options--nested\"\n                  role=\"group\"\n                  [attr.aria-labelledby]=\"getElementId(groupOrOption)\"\n                >\n                  @for (option of group.options; track option; let j = $index) {\n                    <li\n                      #result\n                      [id]=\"getElementId(option)\"\n                      [class]=\"getOptionStyle(option)\"\n                      role=\"option\"\n                      [attr.aria-selected]=\"isSelected(option)\"\n                      [attr.aria-disabled]=\"isDisabled(option)\"\n                      (mouseenter)=\"mouseenter(option)\"\n                      (click)=\"click(option)\"\n                    >\n                      @if (!hasTemplate(option, 'option')) {\n                        <div class=\"select2-label-content\" [innerHTML]=\"option.label\"></div>\n                      } @else {\n                        <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\">\n                        </ng-container>\n                      }\n                    </li>\n                  }\n                </ul>\n              </li>\n            } @else {\n              @let option = _toOption(groupOrOption);\n              <li\n                #result\n                [id]=\"getElementId(groupOrOption)\"\n                [class]=\"getOptionStyle(option)\"\n                role=\"option\"\n                [attr.aria-selected]=\"isSelected(option)\"\n                [attr.aria-disabled]=\"isDisabled(option)\"\n                (mouseenter)=\"mouseenter(option)\"\n                (click)=\"click(option)\"\n              >\n                @if (!hasTemplate(option, 'option')) {\n                  <div [innerHTML]=\"option.label\" class=\"select2-label-content\"></div>\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"> </ng-container>\n                }\n              </li>\n\n              <ng-template #li>\n                <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"> </ng-container>\n              </ng-template>\n            }\n          }\n          @if (!filteredData()?.length && noResultMessage()) {\n            <li class=\"select2-no-result select2-results__option\" [innerHTML]=\"noResultMessage()\"></li>\n          }\n          @if (maxResultsExceeded) {\n            <li class=\"select2-too-much-result select2-results__option\" [innerHTML]=\"maxResultsMessage()\"></li>\n          }\n        </ul>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #resetButton>\n  <button\n    type=\"button\"\n    (focus)=\"_updateFocusState(true)\"\n    (click)=\"reset($event)\"\n    (keydown)=\"$event.stopPropagation()\"\n    class=\"select2-selection__reset\"\n    [attr.aria-description]=\"ariaResetButtonDescription()\"\n    [attr.aria-controls]=\"idCombo()\"\n  >\n    <span aria-hidden=\"true\">\u00D7</span>\n  </button>\n</ng-template>\n", styles: [".select2-label{color:var(--select2-label-text-color, #000)}.select2-container{display:inline-block;position:relative;vertical-align:middle;box-sizing:border-box;margin:0;width:100%}.select2-container .select2-container-dropdown{position:absolute;opacity:0;width:0px}.select2-container .select2-selection--single{display:block;cursor:pointer;box-sizing:border-box;height:var(--select2-single-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;flex:1 1 auto;padding:var(--select2-selection-padding, 0 0 0 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container .select2-selection--multiple{display:block;cursor:pointer;box-sizing:border-box;min-height:var(--select2-multiple-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-flex;flex-wrap:wrap;gap:var(--select2-selection-multiple-gap, 2px 5px);padding-bottom:2px;padding-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__auto-create{display:flex;flex:1 1 150px;min-width:150px}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field{border:0;width:100%}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field:focus{outline:0;border:0}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;margin-top:5px;border:none;padding:0;font-size:100%}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{display:block;position:absolute;z-index:1051;box-sizing:border-box;border:1px solid var(--select2-dropdown-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-dropdown-background, white);width:100%;height:0;overflow:hidden}.select2-dropdown .select2-label-content{display:contents}.select2-results{display:block}.select2-results__options{margin:0;padding:0;list-style:none}.select2-results__option{padding:var(--select2-option-padding, 6px);color:var(--select2-option-text-color, #000);-webkit-user-select:none;user-select:none}.select2-results__option[aria-selected]{cursor:pointer}.select2-container.select2-container-dropdown.select2-container--open{opacity:1;width:100%}.select2-container--open .select2-dropdown{height:auto;overflow:auto}.select2-container--open .select2-dropdown--above{display:flex;bottom:27px;flex-direction:column-reverse;border-bottom:var(--select2-dropdown-above-border-bottom, none);border-bottom-right-radius:var(--select2-dropdown-above-border-bottom-right-radius, 0);border-bottom-left-radius:var(--select2-dropdown-above-border-bottom-left-radius, 0)}.select2-container--open .select2-dropdown--below{border-top:var(--select2-dropdown-below-border-top, none);border-top-right-radius:var(--select2-dropdown-below-border-top-right-radius, 0);border-top-left-radius:var(--select2-dropdown-below-border-top-left-radius, 0)}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{box-sizing:border-box;padding:4px;width:100%}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{display:block;position:fixed;top:0;left:0;opacity:0;z-index:99;margin:0;border:0;padding:0;width:auto;min-width:100%;height:auto;min-height:100%}.select2-required:before{content:\"*\";color:var(--select2-required-color, red)}.select2-hidden-accessible{border:0!important;clip:rect(0 0 0 0)!important;position:absolute!important;margin:-1px!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important}.select2-container--default .select2-selection--single{display:flex;border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-background, #fff)}.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--select2-selection-text-color, #111);line-height:var(--select2-selection-line-height, 28px)}.select2-container--default .select2-selection--single .select2-selection__clear{float:right;cursor:pointer;font-weight:700}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--select2-placeholder-color, #999)}.select2-container--default .select2-selection--single .select2-selection__placeholder span{overflow:hidden;text-overflow:var(--select2-placeholder-overflow, ellipsis);white-space:nowrap}.select2-container--default .select2-selection--single .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--single .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--single .select2-selection__reset,.select2-container--default .select2-selection--single .select2-selection__arrow{display:flex;justify-content:center;align-items:center;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow:before{border-width:5px 4px 0;border-style:solid;border-color:var(--select2-arrow-color, #888) transparent;width:0;height:0;content:\" \"}.select2-container--default .select2-selection__reset{align-self:center;border:var(--select2-reset-border, none);border-radius:var(--select2-reset-border-radius, 4px);background:var(--select2-reset-background, transparent);height:fit-content;color:var(--select2-reset-color, #999)}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear,.select2-container--default.select2-container--disabled .select2-selection__choice__remove,.select2-container--default.select2-container--readonly .select2-selection--single .select2-selection__clear,.select2-container--default.select2-container--readonly .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--disabled .select2-selection--single,.select2-container--default.select2-container--disabled .select2-selection--multiple{cursor:default;background:var(--select2-selection-disabled-background, #eee)}.select2-container--default.select2-container--readonly .select2-selection--single,.select2-container--default.select2-container--readonly .select2-selection--multiple{background:var(--select2-selection-readonly-background, #eee)}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow:before{border-width:0 4px 5px;border-color:transparent transparent var(--select2-arrow-color, #888)}.select2-container--default .select2-selection--multiple{display:flex;cursor:text;border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-background, #fff)}.select2-container--default .select2-selection--multiple .select2-selection__rendered{flex:1 1 auto;align-items:center;box-sizing:border-box;margin:0;padding:var(--select2-selection-multiple-padding, 2px 5px);width:100%;min-height:1em;list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{line-height:var(--select2-selection-choice-line-height, 20px);list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;float:left;margin:-3px 0;width:100%;overflow:hidden;color:var(--select2-placeholder-color, #999);text-overflow:var(--select2-placeholder-overflow, ellipsis);white-space:nowrap}.select2-container--default .select2-selection--multiple .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--multiple .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__clear{float:right;cursor:pointer;margin-top:5px;margin-right:10px;font-weight:700}.select2-container--default .select2-selection--multiple .select2-selection__choice{cursor:default;border:1px solid var(--select2-selection-choice-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-choice-background, #e4e4e4);padding:0 5px;color:var(--select2-selection-choice-text-color, #000)}.select2-container--default .select2-selection--multiple .select2-selection__choice.cdk-drag:not(.cdk-drag-disabled){cursor:move}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{display:inline-block;cursor:pointer;margin-right:2px;color:var(--select2-selection-choice-close-color, #999);font-weight:700}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:var(--select2-selection-choice-hover-close-color, #333)}.select2-container--default.select2-container--focused .select2-selection--multiple{outline:none;border:solid var(--select2-selection-focus-border-color, #000) 1px}.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{outline:none;border:solid var(--select2-selection-focus-border-color, #000) 1px}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-right-radius:0;border-top-left-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-right-radius:0;border-bottom-left-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--select2-search-border-color, #aaa);border-radius:var(--select2-search-border-radius, 0px);background:1px solid var(--select2-search-background, #fff)}.select2-container--default .select2-search--inline .select2-search__field{-webkit-appearance:textfield;outline:none;box-shadow:none;border:none;background:transparent}.select2-container--default .select2-results>.select2-results__options{overflow-y:auto}.select2-container--default .select2-results__option.select2-results__group{grid-column:col-start/col-end;padding:0}.select2-container--default .select2-results__option[aria-disabled=true]{background:var(--select2-option-disabled-background, transparent);color:var(--select2-option-disabled-text-color, #999)}.select2-container--default .select2-results__option[aria-selected=true]{background:var(--select2-option-selected-background, #ddd);color:var(--select2-option-selected-text-color, #000)}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-option-highlighted-background, #5897fb);color:var(--select2-option-highlighted-text-color, #fff)}.select2-container--default .select2-results__option--hide{display:none}.select2-container--default .select2-results__group{display:block;cursor:default;background:var(--select2-option-group-background, transparent);padding:6px;color:var(--select2-option-group-text-color, gray)}.select2-no-result{color:var(--select2-no-result-color, #888);font-style:var(--select2-no-result-font-style, italic)}.select2-too-much-result{color:var(--select2-too-much-result-color, #888);font-style:var(--select2-too-much-font-style, italic)}.select2-grid,.select2-grid ul{display:grid;grid-template-columns:[col-start] repeat(var(--grid-size),1fr) [col-end]}.select2-grid-auto,.select2-grid-auto ul{display:grid;grid-template-columns:[col-start] repeat(auto-fill,minmax(var(--grid-size, 100px),1fr)) [col-end]}.select2-container--default .select2-grid ul,.select2-container--default .select2-grid-auto ul{padding-left:var(--select2-option-padding, 6px)}.select2-container--default .select2-grid ul .select2-results__group,.select2-container--default .select2-grid-auto ul .select2-results__group{padding-left:0}.select2-container--default .select2-grid ul .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{padding-left:var(--select2-option-padding, 6px)}:host.nostyle .select2-dropdown{border-color:transparent}:host.nostyle .select2-selection--single,:host.nostyle .select2-selection--multiple{border-color:transparent;background:transparent}:host.nostyle .select2-container--default .select2-focused .select2-selection--single,:host.nostyle .select2-container--default .select2-focused .select2-selection--multiple,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border-color:transparent;background:transparent}:host.borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}:host.borderless .select2-selection--single,:host.borderless .select2-selection--multiple{border-color:transparent;background:transparent}:host.borderless .select2-container--default .select2-focused .select2-selection--single,:host.borderless .select2-container--default .select2-focused .select2-selection--multiple,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border-color:transparent;background:transparent}:host.select2-selection-nowrap .select2-selection--single.select2-selection,:host.select2-selection-nowrap .select2-selection--single.select2-selection span,:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection span,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{display:flex;flex-wrap:nowrap}:host.select2-selection-nowrap .select2-selection--single.select2-selection li,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection li{display:flex}:host.material{display:inline-block;width:300px}:host.material>.select2-container{vertical-align:inherit;padding-bottom:1.29688em}:host.material>.select2-container .selection{display:inline-flex;align-items:baseline;border-top:.84375em solid transparent;padding:.4375em 0;width:100%;height:auto}:host.material .select2-container--default .select2-selection--single,:host.material .select2-container--default .select2-selection--multiple{box-sizing:border-box;border:0;border-radius:0;width:100%;height:24px}:host.material .select2-container--default .select2-selection--single:before,:host.material .select2-container--default .select2-selection--multiple:before{display:block;position:absolute;bottom:1.65em;background:var(--select2-material-underline, #ddd);width:100%;height:1px;content:\" \"}:host.material .select2-container--default .select2-selection--single:after,:host.material .select2-container--default .select2-selection--multiple:after{display:block;position:absolute;bottom:1.63em;left:50%;transition:none;background:var(--select2-material-underline-active, #5a419e);width:0%;height:2px;content:\" \"}:host.material .select2-container--default .select2-selection--single .select2-selection__rendered,:host.material .select2-container--default .select2-selection--multiple .select2-selection__rendered{padding-left:1px;line-height:inherit}:host.material .select2-container--default .select2-selection--single .select2-selection__placeholder,:host.material .select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;position:absolute;top:20px;left:0;transform-origin:0 21px;transition:transform .3s;color:var(--select2-material-placeholder-color, rgba(0, 0, 0, .38))}:host.material .select2-container--default .select2-container--open{bottom:1.6em;left:0}:host.material .select2-container--default .select2-selection__placeholder__option{transform:translateY(-1.5em) scale(.75) perspective(100px) translateZ(.001px);width:133.33333%}:host.material .select2-container--default .select2-selection__arrow{top:20px}:host.material .select2-container--default.select2-container--open .select2-selection--single:after,:host.material .select2-container--default.select2-container--open .select2-selection--multiple:after,:host.material .select2-container--default .select2-focused .select2-selection--single:after,:host.material .select2-container--default .select2-focused .select2-selection--multiple:after{left:0%;transition:width .3s cubic-bezier(.12,1,.77,1),left .3s cubic-bezier(.12,1,.77,1);width:100%}:host.material .select2-container--default .select2-dropdown{box-shadow:0 5px 5px #00000080;border:0;border-radius:0}:host.material .select2-container--default .select2-results__option[aria-selected=true],:host.material .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-material-option-selected-background, rgba(0, 0, 0, .04));color:var(--select2-material-option-highlighted-text-color, #000)}:host.material .select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-material-option-selected-text-color, #ff5722)}:host.material .select2-container--default.select2-container--disabled .select2-selection--single,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple,:host.material .select2-container--default.select2-container--readonly .select2-selection--single,:host.material .select2-container--default.select2-container--readonly .select2-selection--multiple{background:transparent}:host.material .select2-container--default.select2-container--disabled .select2-selection--single:before,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple:before{background:var(--select2-material-underline-disabled, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-position:0 bottom;background-size:4px 1px;background-repeat:repeat-x}:host.material .select2-container--default.select2-container--readonly .select2-selection--single:before,:host.material .select2-container--default.select2-container--readonly .select2-selection--multiple:before{background:var(--select2-material-underline-readonly, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-position:0 bottom;background-size:4px 1px;background-repeat:repeat-x}:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:after,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:after{background:var(--select2-material-underline-invalid, red)}:host.material:not(.select2-container--open) .select2-focused .select2-selection--single,:host.material:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:0}:host.material .select2-subscript-wrapper{position:absolute;top:calc(100% - 1.72917em);color:var(--select2-hint-text-color, #888);font-size:75%}::ng-deep .select2-overlay-backdrop{background:var(--select2-overlay-backdrop, transparent)}::ng-deep .cdk-overlay-container .select2-container .select2-dropdown.select2-dropdown--above{bottom:0}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown{margin-bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown.select2-dropdown--above{bottom:0;margin-top:28px;margin-bottom:0}::ng-deep .cdk-overlay-container .select2-style-borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}@supports (-moz-appearance: none){select2.material .select2-container--default .select2-selection--single,select2.material .select2-container--default .select2-selection--multiple{height:26px}}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: Select2, decorators: [{
             type: Component,
-            args: [{ selector: 'select2', standalone: false, template: "<div class=\"select2-label\" (click)=\"toggleOpenAndClose()\">\n    <ng-content select=\"select2-label\"></ng-content>\n    @if (required) {\n        <span class=\"select2-required\"></span>\n    }\n</div>\n\n<div\n    class=\"select2 select2-container select2-container--default\"\n    [class.select2-container--focus]=\"focused\"\n    [class.select2-container--below]=\"!select2above\"\n    [class.select2-container--above]=\"select2above\"\n    [class.select2-container--open]=\"isOpen\"\n    [class.select2-container--disabled]=\"disabled\"\n>\n    <div\n        class=\"selection\"\n        #selection\n        #trigger=\"cdkOverlayOrigin\"\n        [tabindex]=\"!this.isOpen ? tabIndex : '-1'\"\n        (click)=\"toggleOpenAndClose()\"\n        (focus)=\"focusin()\"\n        (blur)=\"focusout()\"\n        (keydown)=\"openKey($event)\"\n        cdkOverlayOrigin\n        [class.select2-focused]=\"focused\"\n    >\n        <div\n            class=\"select2-selection\"\n            [class.select2-selection--multiple]=\"multiple\"\n            [class.select2-selection--single]=\"!multiple\"\n            role=\"combobox\"\n        >\n            @if (selectionOverride) {\n                <span class=\"select2-selection__override\" [innerHTML]=\"_selectionOverrideLabel()\"></span>\n                @if (\n                    !multiple && resettable && resetSelectedValue !== value && select2Option && !(disabled || readonly)\n                ) {\n                    <span (click)=\"reset($event)\" class=\"select2-selection__reset\" role=\"presentation\">\u00D7</span>\n                }\n            } @else if (!multiple) {\n                <span class=\"select2-selection__rendered\" [title]=\"select2Option?.label || ''\">\n                    @if (!select2Option) {\n                        <span>&nbsp;</span>\n                    }\n                    @if (select2Option) {\n                        @if (!hasTemplate(select2Option, 'option', true) || noLabelTemplate) {\n                            <span [innerHTML]=\"select2Option.label\"></span>\n                        } @else {\n                            <ng-container\n                                *ngTemplateOutlet=\"getTemplate(select2Option, 'option', true); context: select2Option\"\n                            ></ng-container>\n                        }\n                    }\n                    <span\n                        [class.select2-selection__placeholder__option]=\"option\"\n                        class=\"select2-selection__placeholder\"\n                        >{{ placeholder }}</span\n                    >\n                </span>\n                @if (resettable && resetSelectedValue !== value && select2Option && !(disabled || readonly)) {\n                    <span (click)=\"reset($event)\" class=\"select2-selection__reset\" role=\"presentation\">\u00D7</span>\n                }\n                <span class=\"select2-selection__arrow\" role=\"presentation\"> </span>\n            } @else {\n                <ul class=\"select2-selection__rendered\">\n                    @if (!autoCreate) {\n                        <span\n                            [class.select2-selection__placeholder__option]=\"select2Options?.length > 0\"\n                            class=\"select2-selection__placeholder\"\n                            >{{ placeholder }}</span\n                        >\n                    }\n                    @for (op of option || []; track trackBy($index, op)) {\n                        <li\n                            class=\"select2-selection__choice\"\n                            [title]=\"op.label\"\n                            tabindex=\"0\"\n                            (keydown.enter)=\"removeSelection($event, op)\"\n                        >\n                            @if (!(disabled || readonly)) {\n                                <span\n                                    (click)=\"removeSelection($event, op)\"\n                                    class=\"select2-selection__choice__remove\"\n                                    role=\"presentation\"\n                                    >\u00D7</span\n                                >\n                            }\n                            @if (!hasTemplate(op, 'option', true) || noLabelTemplate) {\n                                <span [innerHTML]=\"op.label\"></span>\n                            } @else {\n                                <ng-container\n                                    *ngTemplateOutlet=\"getTemplate(op, 'option', true); context: op\"\n                                ></ng-container>\n                            }\n                        </li>\n                    }\n                    @if (autoCreate) {\n                        <li\n                            class=\"select2-selection__auto-create\"\n                            (focus)=\"stopEvent($event)\"\n                            (blur)=\"stopEvent($event)\"\n                        >\n                            <input\n                                [id]=\"id + '-create-field'\"\n                                (click)=\"toggleOpenAndClose(false, true); stopEvent($event)\"\n                                (keydown)=\"keyDown($event, true)\"\n                                (keyup)=\"searchUpdate($event)\"\n                                (change)=\"prevChange($event)\"\n                                class=\"select2-create__field\"\n                                type=\"search\"\n                                role=\"textbox\"\n                                autocomplete=\"off\"\n                                autocorrect=\"off\"\n                                autocapitalize=\"off\"\n                                spellcheck=\"false\"\n                            />\n                        </li>\n                    }\n                </ul>\n            }\n        </div>\n    </div>\n    @if (!overlay) {\n        <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n    }\n\n    <div class=\"select2-subscript-wrapper\">\n        <ng-content select=\"select2-hint\"></ng-content>\n    </div>\n</div>\n\n<ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"select2-overlay-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"this.isOpen && overlay\"\n    [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n    [cdkConnectedOverlayHeight]=\"overlayHeight\"\n    [cdkConnectedOverlayPositions]=\"_positions\"\n    (backdropClick)=\"toggleOpenAndClose()\"\n>\n    <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #containerTemplate>\n    <div\n        class=\"select2-container select2-container--default select2-container-dropdown\"\n        [class.select2-container--open]=\"isOpen\"\n        [class.select2-overlay]=\"overlay\"\n        [class.select2-position-auto]=\"listPosition === 'auto'\"\n        [class.select2-style-borderless]=\"styleMode === 'borderless'\"\n    >\n        <div\n            #dropdown\n            class=\"select2-dropdown\"\n            [class.select2-dropdown--below]=\"!select2above\"\n            [class.select2-dropdown--above]=\"select2above\"\n        >\n            <div class=\"select2-search select2-search--dropdown\" [class.select2-search--hide]=\"hideSearch()\">\n                <input\n                    #searchInput\n                    [id]=\"id + '-search-field'\"\n                    [value]=\"searchText\"\n                    (keydown)=\"keyDown($event, autoCreate)\"\n                    (keyup)=\"searchUpdate($event)\"\n                    (change)=\"prevChange($event)\"\n                    class=\"select2-search__field\"\n                    type=\"search\"\n                    role=\"textbox\"\n                    autocomplete=\"off\"\n                    autocorrect=\"off\"\n                    autocapitalize=\"off\"\n                    spellcheck=\"false\"\n                    [attr.tabindex]=\"this.isOpen ? tabIndex : '-1'\"\n                />\n            </div>\n\n            <div class=\"select2-results\">\n                <ul\n                    #results\n                    class=\"select2-results__options\"\n                    [class.select2-grid]=\"grid && isNumber(grid)\"\n                    [class.select2-grid-auto]=\"grid && !isNumber(grid)\"\n                    [style.max-height]=\"resultMaxHeight\"\n                    [style.--grid-size]=\"grid || null\"\n                    role=\"tree\"\n                    tabindex=\"-1\"\n                    infiniteScroll\n                    [infiniteScrollDisabled]=\"!infiniteScroll && !isOpen\"\n                    [infiniteScrollDistance]=\"infiniteScrollDistance\"\n                    [infiniteScrollThrottle]=\"infiniteScrollThrottle\"\n                    [infiniteScrollContainer]=\"results\"\n                    (scrolled)=\"onScroll('down')\"\n                    (scrolledUp)=\"onScroll('up')\"\n                    (keydown)=\"keyDown($event)\"\n                >\n                    @if (showSelectAll && multiple) {\n                        <li\n                            class=\"select2-results__option select2-selectall\"\n                            (click)=\"selectAll()\"\n                            tabindex=\"1\"\n                            aria-selected\n                        >\n                            <div class=\"select2-label-content\">\n                                {{ selectAllTest() ? removeAllText : selectAllText }}\n                            </div>\n                        </li>\n                    }\n\n                    @for (groupOrOption of filteredData(); track trackBy(i, groupOrOption); let i = $index) {\n                        @if (groupOrOption.options !== undefined) {\n                            <li class=\"select2-results__option\" role=\"group\">\n                                @if (!hasTemplate(groupOrOption, 'group')) {\n                                    <strong\n                                        [attr.class]=\"\n                                            'select2-results__group' +\n                                            (groupOrOption.classes ? ' ' + groupOrOption.classes : '')\n                                        \"\n                                        [innerHTML]=\"groupOrOption.label\"\n                                    ></strong>\n                                } @else {\n                                    <ng-container\n                                        *ngTemplateOutlet=\"getTemplate(groupOrOption, 'group'); context: groupOrOption\"\n                                    >\n                                    </ng-container>\n                                }\n                                <ul class=\"select2-results__options select2-results__options--nested\">\n                                    @for (option of groupOrOption.options; track trackBy(j, option); let j = $index) {\n                                        <li\n                                            #result\n                                            [id]=\"option.id || id + '-option-' + i + '-' + j\"\n                                            [class]=\"getOptionStyle(option)\"\n                                            role=\"treeitem\"\n                                            [attr.aria-selected]=\"isSelected(option)\"\n                                            [attr.aria-disabled]=\"isDisabled(option)\"\n                                            (mouseenter)=\"mouseenter(option)\"\n                                            (click)=\"click(option)\"\n                                        >\n                                            @if (!hasTemplate(option, 'option')) {\n                                                <div class=\"select2-label-content\" [innerHTML]=\"option.label\"></div>\n                                            } @else {\n                                                <ng-container\n                                                    *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"\n                                                >\n                                                </ng-container>\n                                            }\n                                        </li>\n                                    }\n                                </ul>\n                            </li>\n                        } @else {\n                            <li\n                                #result\n                                [id]=\"groupOrOption.id || id + '-option-' + i\"\n                                [class]=\"getOptionStyle(groupOrOption)\"\n                                role=\"treeitem\"\n                                [attr.aria-selected]=\"isSelected(groupOrOption)\"\n                                [attr.aria-disabled]=\"isDisabled(groupOrOption)\"\n                                (mouseenter)=\"mouseenter(groupOrOption)\"\n                                (click)=\"click(groupOrOption)\"\n                            >\n                                @if (!hasTemplate(groupOrOption, 'option')) {\n                                    <div [innerHTML]=\"groupOrOption.label\" class=\"select2-label-content\"></div>\n                                } @else {\n                                    <ng-container\n                                        *ngTemplateOutlet=\"getTemplate(groupOrOption, 'option'); context: groupOrOption\"\n                                    >\n                                    </ng-container>\n                                }\n                            </li>\n\n                            <ng-template #li>\n                                <ng-container\n                                    *ngTemplateOutlet=\"getTemplate(groupOrOption, 'option'); context: groupOrOption\"\n                                >\n                                </ng-container>\n                            </ng-template>\n                        }\n                    }\n                    @if (!filteredData()?.length && noResultMessage) {\n                        <li class=\"select2-no-result select2-results__option\" [innerHTML]=\"noResultMessage\"></li>\n                    }\n                    @if (maxResultsExceeded) {\n                        <li\n                            class=\"select2-too-much-result select2-results__option\"\n                            [innerHTML]=\"maxResultsMessage\"\n                        ></li>\n                    }\n                </ul>\n            </div>\n        </div>\n    </div>\n</ng-template>\n", styles: [".select2-label{color:var(--select2-label-text-color, #000)}.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle;width:100%}.select2-container .select2-container-dropdown{position:absolute;width:0px;opacity:0}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:var(--select2-single-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding:var(--select2-selection-padding, 0 0 0 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:var(--select2-multiple-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-flex;overflow:hidden;padding-left:8px;padding-bottom:2px;text-overflow:ellipsis;white-space:nowrap;flex-wrap:wrap;gap:var(--select2-selection-multiple-gap, 2px 5px)}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__auto-create{flex:1 1 150px;min-width:150px;display:flex}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field{width:100%;border:0}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field:focus{border:0;outline:0}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;padding:0}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{background:var(--select2-dropdown-background, white);border:1px solid var(--select2-dropdown-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);box-sizing:border-box;display:block;position:absolute;width:100%;z-index:1051;height:0;overflow:hidden}.select2-dropdown .select2-label-content{display:contents}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:var(--select2-option-padding, 6px);-webkit-user-select:none;user-select:none;color:var(--select2-option-text-color, #000)}.select2-results__option[aria-selected]{cursor:pointer}.select2-container.select2-container-dropdown.select2-container--open{width:100%;opacity:1}.select2-container--open .select2-dropdown{overflow:auto;height:auto}.select2-container--open .select2-dropdown--above{border-bottom:var(--select2-dropdown-above-border-bottom, none);border-bottom-left-radius:var(--select2-dropdown-above-border-bottom-left-radius, 0);border-bottom-right-radius:var(--select2-dropdown-above-border-bottom-right-radius, 0);bottom:27px;display:flex;flex-direction:column-reverse}.select2-container--open .select2-dropdown--below{border-top:var(--select2-dropdown-below-border-top, none);border-top-left-radius:var(--select2-dropdown-below-border-top-left-radius, 0);border-top-right-radius:var(--select2-dropdown-below-border-top-right-radius, 0)}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99}.select2-required:before{content:\"*\";color:var(--select2-required-color, red)}.select2-hidden-accessible{border:0!important;clip:rect(0 0 0 0)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.select2-container--default .select2-selection--single{background:var(--select2-selection-background, #fff);border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);display:flex}.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--select2-selection-text-color, #111);line-height:var(--select2-selection-line-height, 28px)}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:700}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--select2-placeholder-color, #999)}.select2-container--default .select2-selection--single .select2-selection__placeholder span{overflow:hidden;white-space:nowrap;text-overflow:var(--select2-placeholder-overflow, ellipsis)}.select2-container--default .select2-selection--single .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--single .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--single .select2-selection__reset,.select2-container--default .select2-selection--single .select2-selection__arrow{display:flex;width:20px;align-items:center;justify-content:center}.select2-container--default .select2-selection--single .select2-selection__arrow:before{content:\" \";border-color:var(--select2-arrow-color, #888) transparent;border-style:solid;border-width:5px 4px 0;height:0;width:0}.select2-container--default .select2-selection--single .select2-selection__reset{color:var(--select2-reset-color, #999)}.select2-container--default.select2-container--disabled .select2-selection--single{background:var(--select2-selection-disabled-background, #eee);cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow:before{border-color:transparent transparent var(--select2-arrow-color, #888);border-width:0 4px 5px}.select2-container--default .select2-selection--multiple{background:var(--select2-selection-background, #fff);border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);cursor:text;display:flex}.select2-container--default .select2-selection--multiple .select2-selection__rendered{flex:1 1 auto;box-sizing:border-box;list-style:none;margin:0;padding:var(--select2-selection-multiple-padding, 2px 5px);width:100%;min-height:1em;align-items:center}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{list-style:none;line-height:var(--select2-selection-choice-line-height, 20px)}.select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;width:100%;color:var(--select2-placeholder-color, #999);margin-top:5px;float:left;overflow:hidden;white-space:nowrap;text-overflow:var(--select2-placeholder-overflow, ellipsis)}.select2-container--default .select2-selection--multiple .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--multiple .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;float:right;font-weight:700;margin-top:5px;margin-right:10px}.select2-container--default .select2-selection--multiple .select2-selection__choice{color:var(--select2-selection-choice-text-color, #000);background:var(--select2-selection-choice-background, #e4e4e4);border:1px solid var(--select2-selection-choice-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);cursor:default;padding:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:var(--select2-selection-choice-close-color, #999);cursor:pointer;display:inline-block;font-weight:700;margin-right:2px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:var(--select2-selection-choice-hover-close-color, #333)}.select2-container--default.select2-container--focused .select2-selection--multiple{border:solid var(--select2-selection-focus-border-color, #000) 1px;outline:none}.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:solid var(--select2-selection-focus-border-color, #000) 1px;outline:none}.select2-container--default.select2-container--disabled .select2-selection--multiple{background:var(--select2-selection-disabled-background, #eee);cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--select2-search-border-color, #aaa);background:1px solid var(--select2-search-background, #fff);border-radius:var(--select2-search-border-radius, 0px)}.select2-container--default .select2-search--inline .select2-search__field{background:transparent;border:none;outline:none;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{overflow-y:auto}.select2-container--default .select2-results__option[role=group]{padding:0;grid-column:col-start/col-end}.select2-container--default .select2-results__option[aria-disabled=true]{color:var(--select2-option-disabled-text-color, #999);background:var(--select2-option-disabled-background, transparent)}.select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-option-selected-text-color, #000);background:var(--select2-option-selected-background, #ddd)}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-option-highlighted-background, #5897fb);color:var(--select2-option-highlighted-text-color, #fff)}.select2-container--default .select2-results__option--hide{display:none}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px;color:var(--select2-option-group-text-color, gray);background:var(--select2-option-group-background, transparent)}.select2-no-result{color:var(--select2-no-result-color, #888);font-style:var(--select2-no-result-font-style, italic)}.select2-too-much-result{color:var(--select2-too-much-result-color, #888);font-style:var(--select2-too-much-font-style, italic)}.select2-grid,.select2-grid ul{display:grid;grid-template-columns:[col-start] repeat(var(--grid-size),1fr) [col-end]}.select2-grid-auto,.select2-grid-auto ul{display:grid;grid-template-columns:[col-start] repeat(auto-fill,minmax(var(--grid-size, 100px),1fr)) [col-end]}.select2-container--default .select2-grid ul,.select2-container--default .select2-grid-auto ul{padding-left:var(--select2-option-padding, 6px)}.select2-container--default .select2-grid ul .select2-results__group,.select2-container--default .select2-grid-auto ul .select2-results__group{padding-left:0}.select2-container--default .select2-grid ul .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{padding-left:var(--select2-option-padding, 6px)}:host.nostyle .select2-dropdown{border-color:transparent}:host.nostyle .select2-selection--single,:host.nostyle .select2-selection--multiple{background:transparent;border-color:transparent}:host.nostyle .select2-container--default .select2-focused .select2-selection--single,:host.nostyle .select2-container--default .select2-focused .select2-selection--multiple,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{background:transparent;border-color:transparent}:host.borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}:host.borderless .select2-selection--single,:host.borderless .select2-selection--multiple{background:transparent;border-color:transparent}:host.borderless .select2-container--default .select2-focused .select2-selection--single,:host.borderless .select2-container--default .select2-focused .select2-selection--multiple,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{background:transparent;border-color:transparent}:host.select2-selection-nowrap .select2-selection--single.select2-selection,:host.select2-selection-nowrap .select2-selection--single.select2-selection span,:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection span,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{display:flex;flex-wrap:nowrap}:host.material{display:inline-block;width:300px}:host.material>.select2-container{padding-bottom:1.29688em;vertical-align:inherit}:host.material>.select2-container .selection{padding:.4375em 0;border-top:.84375em solid transparent;display:inline-flex;align-items:baseline;width:100%;height:auto}:host.material .select2-container--default .select2-selection--single,:host.material .select2-container--default .select2-selection--multiple{width:100%;border:0;border-radius:0;height:24px;box-sizing:border-box}:host.material .select2-container--default .select2-selection--single:before,:host.material .select2-container--default .select2-selection--multiple:before{content:\" \";display:block;position:absolute;bottom:1.65em;background:var(--select2-material-underline, #ddd);height:1px;width:100%}:host.material .select2-container--default .select2-selection--single:after,:host.material .select2-container--default .select2-selection--multiple:after{content:\" \";display:block;position:absolute;bottom:1.63em;background:var(--select2-material-underline-active, #5a419e);height:2px;width:0%;left:50%;transition:none}:host.material .select2-container--default .select2-selection--single .select2-selection__rendered,:host.material .select2-container--default .select2-selection--multiple .select2-selection__rendered{padding-left:1px;line-height:inherit}:host.material .select2-container--default .select2-selection--single .select2-selection__placeholder,:host.material .select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;color:var(--select2-material-placeholder-color, rgba(0, 0, 0, .38));transition:transform .3s;position:absolute;transform-origin:0 21px;left:0;top:20px}:host.material .select2-container--default .select2-container--open{left:0;bottom:1.6em}:host.material .select2-container--default .select2-selection__placeholder__option{transform:translateY(-1.5em) scale(.75) perspective(100px) translateZ(.001px);width:133.33333%}:host.material .select2-container--default .select2-selection__arrow{top:20px}:host.material .select2-container--default.select2-container--open .select2-selection--single:after,:host.material .select2-container--default.select2-container--open .select2-selection--multiple:after,:host.material .select2-container--default .select2-focused .select2-selection--single:after,:host.material .select2-container--default .select2-focused .select2-selection--multiple:after{transition:width .3s cubic-bezier(.12,1,.77,1),left .3s cubic-bezier(.12,1,.77,1);width:100%;left:0%}:host.material .select2-container--default .select2-dropdown{border-radius:0;border:0;box-shadow:0 5px 5px #00000080}:host.material .select2-container--default .select2-results__option[aria-selected=true],:host.material .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-material-option-selected-background, rgba(0, 0, 0, .04));color:var(--select2-material-option-highlighted-text-color, #000)}:host.material .select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-material-option-selected-text-color, #ff5722)}:host.material .select2-container--default.select2-container--disabled .select2-selection--single,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple{background:transparent}:host.material .select2-container--default.select2-container--disabled .select2-selection--single:before,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple:before{background:var(--select2-material-underline-disabled, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-size:4px 1px;background-repeat:repeat-x;background-position:0 bottom}:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:after,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:after{background:var(--select2-material-underline-invalid, red)}:host.material:not(.select2-container--open) .select2-focused .select2-selection--single,:host.material:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:0}:host.material .select2-subscript-wrapper{position:absolute;top:calc(100% - 1.72917em);font-size:75%;color:var(--select2-hint-text-color, #888)}::ng-deep .select2-overlay-backdrop{background:var(--select2-overlay-backdrop, transparent)}::ng-deep .cdk-overlay-container .select2-container .select2-dropdown.select2-dropdown--above{bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown{margin-bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown.select2-dropdown--above{bottom:0;margin-bottom:0;margin-top:28px}::ng-deep .cdk-overlay-container .select2-style-borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}@supports (-moz-appearance: none){select2.material .select2-container--default .select2-selection--single,select2.material .select2-container--default .select2-selection--multiple{height:26px}}\n"] }]
+            args: [{ selector: 'select2, ng-select2', imports: [CdkOverlayOrigin, NgTemplateOutlet, CdkConnectedOverlay, InfiniteScrollDirective, CdkDropList, CdkDrag], host: {
+                        '[id]': 'id()',
+                        '[class.select2-selection-nowrap]': 'selectionNoWrap()',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"select2-label\" (click)=\"toggleOpenAndClose()\" [id]=\"idLabel()\">\n  <ng-content select=\"select2-label, ng-select2-label\"></ng-content>\n  @if (required()) {\n    <span class=\"select2-required\" aria-hidden=\"true\"></span>\n  }\n</label>\n\n<div\n  class=\"select2 select2-container select2-container--default\"\n  [class.select2-container--focus]=\"focused\"\n  [class.select2-container--below]=\"!select2above\"\n  [class.select2-container--above]=\"select2above\"\n  [class.select2-container--open]=\"isOpen\"\n  [class.select2-container--disabled]=\"disabled()\"\n  [class.select2-container--readonly]=\"readonly()\"\n>\n  <div\n    [id]=\"idCombo()\"\n    role=\"combobox\"\n    class=\"selection\"\n    #selection\n    #trigger=\"cdkOverlayOrigin\"\n    [tabindex]=\"!this.isOpen ? _tabIndex : '-1'\"\n    [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n    [attr.aria-expanded]=\"isOpen\"\n    aria-haspopup=\"listbox\"\n    [attr.aria-controls]=\"idOptions()\"\n    [attr.aria-activedescendant]=\"isOpen ? hoveringOptionId() : null\"\n    [attr.aria-describedby]=\"ariaDescribedby()\"\n    [attr.title]=\"title()\"\n    [attr.aria-invalid]=\"_isErrorState() || ariaInvalid() ? 'true' : null\"\n    [attr.aria-required]=\"required() ? 'true' : null\"\n    [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\"\n    (click)=\"toggleOpenAndClose(); $event.stopPropagation()\"\n    (focus)=\"focusin()\"\n    (focusout)=\"focusout($event)\"\n    (keydown)=\"openKey($event)\"\n    cdkOverlayOrigin\n    [class.select2-focused]=\"focused\"\n  >\n    <div\n      class=\"select2-selection\"\n      [class.select2-selection--multiple]=\"multiple()\"\n      [class.select2-selection--single]=\"!multiple()\"\n    >\n      @if (selectionOverride()) {\n        <span class=\"select2-selection__override\" [innerHTML]=\"_selectionOverrideLabel()\"></span>\n\n        @if (\n          resettable() &&\n          !(disabled() || readonly()) &&\n          resetSelectedValue() !== _value &&\n          ((!multiple() && select2Option) || (multiple() && select2Options.length > 0))\n        ) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n      } @else if (!multiple()) {\n        <span class=\"select2-selection__rendered\" [title]=\"select2Option?.label || ''\">\n          @if (!select2Option) {\n            <span>&nbsp;</span>\n          }\n          @if (select2Option) {\n            @if (!hasTemplate(select2Option, 'option', true) || noLabelTemplate()) {\n              <span [innerHTML]=\"select2Option.label\"></span>\n            } @else {\n              <ng-container\n                *ngTemplateOutlet=\"getTemplate(select2Option, 'option', true); context: select2Option\"\n              ></ng-container>\n            }\n          }\n          <span\n            [class.select2-selection__placeholder__option]=\"selectedOption\"\n            class=\"select2-selection__placeholder\"\n            >{{ placeholder() }}</span\n          >\n        </span>\n\n        @if (resettable() && resetSelectedValue() !== _value && select2Option && !(disabled() || readonly())) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n        <span class=\"select2-selection__arrow\" role=\"presentation\"> </span>\n      } @else {\n        <ul\n          class=\"select2-selection__rendered\"\n          cdkDropList\n          cdkDropListOrientation=\"mixed\"\n          [cdkDropListDisabled]=\"!multipleDrag()\"\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @if (!autoCreate()) {\n            <span\n              [class.select2-selection__placeholder__option]=\"select2Options.length > 0\"\n              class=\"select2-selection__placeholder\"\n              >{{ placeholder() }}</span\n            >\n          }\n          @for (op of selectedOption || []; track op) {\n            <li\n              class=\"select2-selection__choice\"\n              [title]=\"op.label\"\n              tabindex=\"0\"\n              (focus)=\"_updateFocusState(true)\"\n              (keydown.enter)=\"removeSelection($event, op)\"\n              cdkDrag\n\n            >\n              @if (!(disabled() || readonly())) {\n                <span\n                  (click)=\"removeSelection($event, op)\"\n                  class=\"select2-selection__choice__remove\"\n                  role=\"presentation\"\n                  aria-hidden=\"true\"\n                  >\u00D7</span\n                >\n              }\n              @if (!hasTemplate(op, 'option', true) || noLabelTemplate()) {\n                <span [innerHTML]=\"op.label\"></span>\n              } @else {\n                <ng-container *ngTemplateOutlet=\"getTemplate(op, 'option', true); context: op\"></ng-container>\n              }\n            </li>\n          }\n          @if (autoCreate()) {\n            <li class=\"select2-selection__auto-create\" (focus)=\"stopEvent($event)\" (blur)=\"stopEvent($event)\">\n              <input\n                [id]=\"id() + '-create-field'\"\n                (click)=\"toggleOpenAndClose(false, true); stopEvent($event)\"\n                (keydown)=\"keyDown($event, true)\"\n                (keyup)=\"searchUpdate($event)\"\n                (change)=\"prevChange($event)\"\n                class=\"select2-create__field\"\n                type=\"search\"\n                role=\"textbox\"\n                autocomplete=\"off\"\n                autocorrect=\"off\"\n                autocapitalize=\"off\"\n                spellcheck=\"false\"\n              />\n            </li>\n          }\n        </ul>\n        @if (resettable() && $any(selectedOption)?.length > 0 && !(disabled() || readonly())) {\n          <ng-container *ngTemplateOutlet=\"resetButton\"></ng-container>\n        }\n      }\n    </div>\n  </div>\n  @if (!overlay()) {\n    <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n  }\n\n  <div class=\"select2-subscript-wrapper\">\n    <ng-content select=\"select2-hint, ng-select2-hint\"></ng-content>\n  </div>\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"select2-overlay-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"this.isOpen && overlay()\"\n  [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n  [cdkConnectedOverlayHeight]=\"overlayHeight\"\n  [cdkConnectedOverlayPositions]=\"_positions\"\n  (backdropClick)=\"toggleOpenAndClose()\"\n>\n  <ng-container *ngTemplateOutlet=\"containerTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #containerTemplate>\n  <div\n    [id]=\"idOverlay()\"\n    class=\"select2-container select2-container--default select2-container-dropdown\"\n    [class.select2-container--open]=\"isOpen\"\n    [class.select2-overlay]=\"overlay()\"\n    [class.select2-position-auto]=\"listPosition() === 'auto'\"\n    [class.select2-style-borderless]=\"styleMode() === 'borderless'\"\n  >\n    <div\n      #dropdown\n      class=\"select2-dropdown\"\n      [class.select2-dropdown--below]=\"!select2above\"\n      [class.select2-dropdown--above]=\"select2above\"\n    >\n      <div class=\"select2-search select2-search--dropdown\" [class.select2-search--hide]=\"isSearchboxHidden\">\n        <input\n          #searchInput\n          [id]=\"id() + '-search-field'\"\n          [value]=\"searchText\"\n          (keydown)=\"keyDown($event, autoCreate())\"\n          (keyup)=\"searchUpdate($event)\"\n          (change)=\"prevChange($event)\"\n          class=\"select2-search__field\"\n          type=\"search\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          autocorrect=\"off\"\n          autocapitalize=\"off\"\n          spellcheck=\"false\"\n          [attr.tabindex]=\"this.isOpen ? _tabIndex : '-1'\"\n          [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"idOptions()\"\n          aria-expanded=\"true\"\n          [attr.aria-activedescendant]=\"hoveringOptionId()\"\n        />\n      </div>\n\n      <div class=\"select2-results\">\n        <ul\n          [id]=\"idOptions()\"\n          #results\n          class=\"select2-results__options\"\n          [class.select2-grid]=\"grid() && isNumber(grid())\"\n          [class.select2-grid-auto]=\"grid() && !isNumber(grid())\"\n          [style.max-height]=\"resultMaxHeight()\"\n          [style.--grid-size]=\"grid() || null\"\n          role=\"listbox\"\n          tabindex=\"-1\"\n          infiniteScroll\n          [infiniteScrollDisabled]=\"!infiniteScroll() && !isOpen\"\n          [infiniteScrollDistance]=\"infiniteScrollDistance()\"\n          [infiniteScrollThrottle]=\"infiniteScrollThrottle()\"\n          [infiniteScrollContainer]=\"results\"\n          [attr.aria-labelledby]=\"ariaLabelledby() ?? idLabel()\"\n          [attr.aria-multiselectable]=\"multiple()\"\n          [attr.aria-activedescendant]=\"hoveringOptionId()\"\n          (scrolled)=\"onScroll('down')\"\n          (scrolledUp)=\"onScroll('up')\"\n          (keydown)=\"keyDown($event)\"\n        >\n          @if (showSelectAll() && multiple()) {\n            <li class=\"select2-results__option select2-selectall\" (click)=\"selectAll()\" tabindex=\"1\" aria-selected>\n              <div class=\"select2-label-content\">\n                {{ selectAllTest() ? removeAllText() : selectAllText() }}\n              </div>\n            </li>\n          }\n\n          @for (groupOrOption of filteredData(); track groupOrOption; let i = $index) {\n            @let group = _toGroup(groupOrOption);\n            @if (group.options !== undefined) {\n              <li class=\"select2-results__option select2-results__group\">\n                <span [id]=\"getElementId(groupOrOption)\">\n                  @if (!hasTemplate(group, 'group')) {\n                    <strong\n                      [attr.class]=\"'select2-results__group' + (group.classes ? ' ' + group.classes : '')\"\n                      [innerHTML]=\"group.label\"\n                    ></strong>\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"getTemplate(group, 'group'); context: group\"> </ng-container>\n                  }\n                </span>\n                <ul\n                  class=\"select2-results__options select2-results__options--nested\"\n                  role=\"group\"\n                  [attr.aria-labelledby]=\"getElementId(groupOrOption)\"\n                >\n                  @for (option of group.options; track option; let j = $index) {\n                    <li\n                      #result\n                      [id]=\"getElementId(option)\"\n                      [class]=\"getOptionStyle(option)\"\n                      role=\"option\"\n                      [attr.aria-selected]=\"isSelected(option)\"\n                      [attr.aria-disabled]=\"isDisabled(option)\"\n                      (mouseenter)=\"mouseenter(option)\"\n                      (click)=\"click(option)\"\n                    >\n                      @if (!hasTemplate(option, 'option')) {\n                        <div class=\"select2-label-content\" [innerHTML]=\"option.label\"></div>\n                      } @else {\n                        <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\">\n                        </ng-container>\n                      }\n                    </li>\n                  }\n                </ul>\n              </li>\n            } @else {\n              @let option = _toOption(groupOrOption);\n              <li\n                #result\n                [id]=\"getElementId(groupOrOption)\"\n                [class]=\"getOptionStyle(option)\"\n                role=\"option\"\n                [attr.aria-selected]=\"isSelected(option)\"\n                [attr.aria-disabled]=\"isDisabled(option)\"\n                (mouseenter)=\"mouseenter(option)\"\n                (click)=\"click(option)\"\n              >\n                @if (!hasTemplate(option, 'option')) {\n                  <div [innerHTML]=\"option.label\" class=\"select2-label-content\"></div>\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"> </ng-container>\n                }\n              </li>\n\n              <ng-template #li>\n                <ng-container *ngTemplateOutlet=\"getTemplate(option, 'option'); context: option\"> </ng-container>\n              </ng-template>\n            }\n          }\n          @if (!filteredData()?.length && noResultMessage()) {\n            <li class=\"select2-no-result select2-results__option\" [innerHTML]=\"noResultMessage()\"></li>\n          }\n          @if (maxResultsExceeded) {\n            <li class=\"select2-too-much-result select2-results__option\" [innerHTML]=\"maxResultsMessage()\"></li>\n          }\n        </ul>\n      </div>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #resetButton>\n  <button\n    type=\"button\"\n    (focus)=\"_updateFocusState(true)\"\n    (click)=\"reset($event)\"\n    (keydown)=\"$event.stopPropagation()\"\n    class=\"select2-selection__reset\"\n    [attr.aria-description]=\"ariaResetButtonDescription()\"\n    [attr.aria-controls]=\"idCombo()\"\n  >\n    <span aria-hidden=\"true\">\u00D7</span>\n  </button>\n</ng-template>\n", styles: [".select2-label{color:var(--select2-label-text-color, #000)}.select2-container{display:inline-block;position:relative;vertical-align:middle;box-sizing:border-box;margin:0;width:100%}.select2-container .select2-container-dropdown{position:absolute;opacity:0;width:0px}.select2-container .select2-selection--single{display:block;cursor:pointer;box-sizing:border-box;height:var(--select2-single-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;flex:1 1 auto;padding:var(--select2-selection-padding, 0 0 0 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container .select2-selection--multiple{display:block;cursor:pointer;box-sizing:border-box;min-height:var(--select2-multiple-height, 28px);-webkit-user-select:none;user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-flex;flex-wrap:wrap;gap:var(--select2-selection-multiple-gap, 2px 5px);padding-bottom:2px;padding-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__auto-create{display:flex;flex:1 1 150px;min-width:150px}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field{border:0;width:100%}.select2-container .select2-selection--multiple .select2-selection__rendered .select2-create__field:focus{outline:0;border:0}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;margin-top:5px;border:none;padding:0;font-size:100%}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{display:block;position:absolute;z-index:1051;box-sizing:border-box;border:1px solid var(--select2-dropdown-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-dropdown-background, white);width:100%;height:0;overflow:hidden}.select2-dropdown .select2-label-content{display:contents}.select2-results{display:block}.select2-results__options{margin:0;padding:0;list-style:none}.select2-results__option{padding:var(--select2-option-padding, 6px);color:var(--select2-option-text-color, #000);-webkit-user-select:none;user-select:none}.select2-results__option[aria-selected]{cursor:pointer}.select2-container.select2-container-dropdown.select2-container--open{opacity:1;width:100%}.select2-container--open .select2-dropdown{height:auto;overflow:auto}.select2-container--open .select2-dropdown--above{display:flex;bottom:27px;flex-direction:column-reverse;border-bottom:var(--select2-dropdown-above-border-bottom, none);border-bottom-right-radius:var(--select2-dropdown-above-border-bottom-right-radius, 0);border-bottom-left-radius:var(--select2-dropdown-above-border-bottom-left-radius, 0)}.select2-container--open .select2-dropdown--below{border-top:var(--select2-dropdown-below-border-top, none);border-top-right-radius:var(--select2-dropdown-below-border-top-right-radius, 0);border-top-left-radius:var(--select2-dropdown-below-border-top-left-radius, 0)}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{box-sizing:border-box;padding:4px;width:100%}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{display:block;position:fixed;top:0;left:0;opacity:0;z-index:99;margin:0;border:0;padding:0;width:auto;min-width:100%;height:auto;min-height:100%}.select2-required:before{content:\"*\";color:var(--select2-required-color, red)}.select2-hidden-accessible{border:0!important;clip:rect(0 0 0 0)!important;position:absolute!important;margin:-1px!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important}.select2-container--default .select2-selection--single{display:flex;border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-background, #fff)}.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--select2-selection-text-color, #111);line-height:var(--select2-selection-line-height, 28px)}.select2-container--default .select2-selection--single .select2-selection__clear{float:right;cursor:pointer;font-weight:700}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--select2-placeholder-color, #999)}.select2-container--default .select2-selection--single .select2-selection__placeholder span{overflow:hidden;text-overflow:var(--select2-placeholder-overflow, ellipsis);white-space:nowrap}.select2-container--default .select2-selection--single .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--single .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--single .select2-selection__reset,.select2-container--default .select2-selection--single .select2-selection__arrow{display:flex;justify-content:center;align-items:center;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow:before{border-width:5px 4px 0;border-style:solid;border-color:var(--select2-arrow-color, #888) transparent;width:0;height:0;content:\" \"}.select2-container--default .select2-selection__reset{align-self:center;border:var(--select2-reset-border, none);border-radius:var(--select2-reset-border-radius, 4px);background:var(--select2-reset-background, transparent);height:fit-content;color:var(--select2-reset-color, #999)}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear,.select2-container--default.select2-container--disabled .select2-selection__choice__remove,.select2-container--default.select2-container--readonly .select2-selection--single .select2-selection__clear,.select2-container--default.select2-container--readonly .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--disabled .select2-selection--single,.select2-container--default.select2-container--disabled .select2-selection--multiple{cursor:default;background:var(--select2-selection-disabled-background, #eee)}.select2-container--default.select2-container--readonly .select2-selection--single,.select2-container--default.select2-container--readonly .select2-selection--multiple{background:var(--select2-selection-readonly-background, #eee)}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow:before{border-width:0 4px 5px;border-color:transparent transparent var(--select2-arrow-color, #888)}.select2-container--default .select2-selection--multiple{display:flex;cursor:text;border:1px solid var(--select2-selection-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-background, #fff)}.select2-container--default .select2-selection--multiple .select2-selection__rendered{flex:1 1 auto;align-items:center;box-sizing:border-box;margin:0;padding:var(--select2-selection-multiple-padding, 2px 5px);width:100%;min-height:1em;list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{line-height:var(--select2-selection-choice-line-height, 20px);list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;float:left;margin:-3px 0;width:100%;overflow:hidden;color:var(--select2-placeholder-color, #999);text-overflow:var(--select2-placeholder-overflow, ellipsis);white-space:nowrap}.select2-container--default .select2-selection--multiple .select2-selection__placeholder__option{display:none}.select2-container--default .select2-selection--multiple .select2-selection__override{flex:1;margin:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__clear{float:right;cursor:pointer;margin-top:5px;margin-right:10px;font-weight:700}.select2-container--default .select2-selection--multiple .select2-selection__choice{cursor:default;border:1px solid var(--select2-selection-choice-border-color, #aaa);border-radius:var(--select2-selection-border-radius, 4px);background:var(--select2-selection-choice-background, #e4e4e4);padding:0 5px;color:var(--select2-selection-choice-text-color, #000)}.select2-container--default .select2-selection--multiple .select2-selection__choice.cdk-drag:not(.cdk-drag-disabled){cursor:move}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{display:inline-block;cursor:pointer;margin-right:2px;color:var(--select2-selection-choice-close-color, #999);font-weight:700}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:var(--select2-selection-choice-hover-close-color, #333)}.select2-container--default.select2-container--focused .select2-selection--multiple{outline:none;border:solid var(--select2-selection-focus-border-color, #000) 1px}.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,.select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{outline:none;border:solid var(--select2-selection-focus-border-color, #000) 1px}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-right-radius:0;border-top-left-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-right-radius:0;border-bottom-left-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--select2-search-border-color, #aaa);border-radius:var(--select2-search-border-radius, 0px);background:1px solid var(--select2-search-background, #fff)}.select2-container--default .select2-search--inline .select2-search__field{-webkit-appearance:textfield;outline:none;box-shadow:none;border:none;background:transparent}.select2-container--default .select2-results>.select2-results__options{overflow-y:auto}.select2-container--default .select2-results__option.select2-results__group{grid-column:col-start/col-end;padding:0}.select2-container--default .select2-results__option[aria-disabled=true]{background:var(--select2-option-disabled-background, transparent);color:var(--select2-option-disabled-text-color, #999)}.select2-container--default .select2-results__option[aria-selected=true]{background:var(--select2-option-selected-background, #ddd);color:var(--select2-option-selected-text-color, #000)}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-option-highlighted-background, #5897fb);color:var(--select2-option-highlighted-text-color, #fff)}.select2-container--default .select2-results__option--hide{display:none}.select2-container--default .select2-results__group{display:block;cursor:default;background:var(--select2-option-group-background, transparent);padding:6px;color:var(--select2-option-group-text-color, gray)}.select2-no-result{color:var(--select2-no-result-color, #888);font-style:var(--select2-no-result-font-style, italic)}.select2-too-much-result{color:var(--select2-too-much-result-color, #888);font-style:var(--select2-too-much-font-style, italic)}.select2-grid,.select2-grid ul{display:grid;grid-template-columns:[col-start] repeat(var(--grid-size),1fr) [col-end]}.select2-grid-auto,.select2-grid-auto ul{display:grid;grid-template-columns:[col-start] repeat(auto-fill,minmax(var(--grid-size, 100px),1fr)) [col-end]}.select2-container--default .select2-grid ul,.select2-container--default .select2-grid-auto ul{padding-left:var(--select2-option-padding, 6px)}.select2-container--default .select2-grid ul .select2-results__group,.select2-container--default .select2-grid-auto ul .select2-results__group{padding-left:0}.select2-container--default .select2-grid ul .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option,.select2-container--default .select2-grid-auto ul .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{padding-left:var(--select2-option-padding, 6px)}:host.nostyle .select2-dropdown{border-color:transparent}:host.nostyle .select2-selection--single,:host.nostyle .select2-selection--multiple{border-color:transparent;background:transparent}:host.nostyle .select2-container--default .select2-focused .select2-selection--single,:host.nostyle .select2-container--default .select2-focused .select2-selection--multiple,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.nostyle .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border-color:transparent;background:transparent}:host.borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}:host.borderless .select2-selection--single,:host.borderless .select2-selection--multiple{border-color:transparent;background:transparent}:host.borderless .select2-container--default .select2-focused .select2-selection--single,:host.borderless .select2-container--default .select2-focused .select2-selection--multiple,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--single,:host.borderless .select2-container--default:not(.select2-container--open) .select2-focused .select2-selection--multiple{border-color:transparent;background:transparent}:host.select2-selection-nowrap .select2-selection--single.select2-selection,:host.select2-selection-nowrap .select2-selection--single.select2-selection span,:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection span,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.select2-selection-nowrap .select2-selection--single.select2-selection ul,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection ul{display:flex;flex-wrap:nowrap}:host.select2-selection-nowrap .select2-selection--single.select2-selection li,:host.select2-selection-nowrap .select2-selection--multiple.select2-selection li{display:flex}:host.material{display:inline-block;width:300px}:host.material>.select2-container{vertical-align:inherit;padding-bottom:1.29688em}:host.material>.select2-container .selection{display:inline-flex;align-items:baseline;border-top:.84375em solid transparent;padding:.4375em 0;width:100%;height:auto}:host.material .select2-container--default .select2-selection--single,:host.material .select2-container--default .select2-selection--multiple{box-sizing:border-box;border:0;border-radius:0;width:100%;height:24px}:host.material .select2-container--default .select2-selection--single:before,:host.material .select2-container--default .select2-selection--multiple:before{display:block;position:absolute;bottom:1.65em;background:var(--select2-material-underline, #ddd);width:100%;height:1px;content:\" \"}:host.material .select2-container--default .select2-selection--single:after,:host.material .select2-container--default .select2-selection--multiple:after{display:block;position:absolute;bottom:1.63em;left:50%;transition:none;background:var(--select2-material-underline-active, #5a419e);width:0%;height:2px;content:\" \"}:host.material .select2-container--default .select2-selection--single .select2-selection__rendered,:host.material .select2-container--default .select2-selection--multiple .select2-selection__rendered{padding-left:1px;line-height:inherit}:host.material .select2-container--default .select2-selection--single .select2-selection__placeholder,:host.material .select2-container--default .select2-selection--multiple .select2-selection__placeholder{display:block;position:absolute;top:20px;left:0;transform-origin:0 21px;transition:transform .3s;color:var(--select2-material-placeholder-color, rgba(0, 0, 0, .38))}:host.material .select2-container--default .select2-container--open{bottom:1.6em;left:0}:host.material .select2-container--default .select2-selection__placeholder__option{transform:translateY(-1.5em) scale(.75) perspective(100px) translateZ(.001px);width:133.33333%}:host.material .select2-container--default .select2-selection__arrow{top:20px}:host.material .select2-container--default.select2-container--open .select2-selection--single:after,:host.material .select2-container--default.select2-container--open .select2-selection--multiple:after,:host.material .select2-container--default .select2-focused .select2-selection--single:after,:host.material .select2-container--default .select2-focused .select2-selection--multiple:after{left:0%;transition:width .3s cubic-bezier(.12,1,.77,1),left .3s cubic-bezier(.12,1,.77,1);width:100%}:host.material .select2-container--default .select2-dropdown{box-shadow:0 5px 5px #00000080;border:0;border-radius:0}:host.material .select2-container--default .select2-results__option[aria-selected=true],:host.material .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--select2-material-option-selected-background, rgba(0, 0, 0, .04));color:var(--select2-material-option-highlighted-text-color, #000)}:host.material .select2-container--default .select2-results__option[aria-selected=true]{color:var(--select2-material-option-selected-text-color, #ff5722)}:host.material .select2-container--default.select2-container--disabled .select2-selection--single,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple,:host.material .select2-container--default.select2-container--readonly .select2-selection--single,:host.material .select2-container--default.select2-container--readonly .select2-selection--multiple{background:transparent}:host.material .select2-container--default.select2-container--disabled .select2-selection--single:before,:host.material .select2-container--default.select2-container--disabled .select2-selection--multiple:before{background:var(--select2-material-underline-disabled, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-position:0 bottom;background-size:4px 1px;background-repeat:repeat-x}:host.material .select2-container--default.select2-container--readonly .select2-selection--single:before,:host.material .select2-container--default.select2-container--readonly .select2-selection--multiple:before{background:var(--select2-material-underline-readonly, linear-gradient(to right, rgba(0, 0, 0, .26) 0, rgba(0, 0, 0, .26) 33%, transparent 0));background-position:0 bottom;background-size:4px 1px;background-repeat:repeat-x}:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--single:after,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:before,:host.material.ng-invalid.ng-touched .select2-container--default .select2-selection--multiple:after{background:var(--select2-material-underline-invalid, red)}:host.material:not(.select2-container--open) .select2-focused .select2-selection--single,:host.material:not(.select2-container--open) .select2-focused .select2-selection--multiple{border:0}:host.material .select2-subscript-wrapper{position:absolute;top:calc(100% - 1.72917em);color:var(--select2-hint-text-color, #888);font-size:75%}::ng-deep .select2-overlay-backdrop{background:var(--select2-overlay-backdrop, transparent)}::ng-deep .cdk-overlay-container .select2-container .select2-dropdown.select2-dropdown--above{bottom:0}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown{margin-bottom:28px}::ng-deep .cdk-overlay-container .select2-container--open.select2-position-auto .select2-dropdown.select2-dropdown--above{bottom:0;margin-top:28px;margin-bottom:0}::ng-deep .cdk-overlay-container .select2-style-borderless{--select2-dropdown-above-border-bottom: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-above-border-bottom-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-above-border-bottom-right-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top: 1px solid var(--select2-dropdown-border-color, #aaa);--select2-dropdown-below-border-top-left-radius: var(--select2-selection-border-radius, 4px);--select2-dropdown-below-border-top-right-radius: var(--select2-selection-border-radius, 4px)}@supports (-moz-appearance: none){select2.material .select2-container--default .select2-selection--single,select2.material .select2-container--default .select2-selection--multiple{height:26px}}\n"] }]
         }], ctorParameters: () => [{ type: i1.ViewportRuler }, { type: i0.ChangeDetectorRef }, { type: i2.NgForm, decorators: [{
                     type: Optional
                 }] }, { type: i2.FormGroupDirective, decorators: [{
@@ -1282,131 +1466,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }] }, { type: undefined, decorators: [{
                     type: Attribute,
                     args: ['tabindex']
-                }] }], propDecorators: { data: [{
-                type: Input,
-                args: [{ required: true }]
-            }], minCharForSearch: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], displaySearchStatus: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], limitSelection: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], listPosition: [{
-                type: Input
-            }], multiple: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], overlay: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], styleMode: [{
-                type: Input
-            }], noResultMessage: [{
-                type: Input
-            }], maxResults: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], maxResultsMessage: [{
-                type: Input
-            }], infiniteScrollDistance: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], infiniteScrollThrottle: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], infiniteScroll: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], autoCreate: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], noLabelTemplate: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], editPattern: [{
-                type: Input
-            }], templates: [{
-                type: Input
-            }], templateSelection: [{
-                type: Input
-            }], resultMaxHeight: [{
-                type: Input
-            }], customSearchEnabled: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], minCountForSearch: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], id: [{
-                type: Input
-            }, {
-                type: HostBinding,
-                args: ['id']
-            }], required: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], disabled: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], hideSelectedItems: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], readonly: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], value: [{
-                type: Input
-            }], tabIndex: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], resettable: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], resetSelectedValue: [{
-                type: Input
-            }], grid: [{
-                type: Input
-            }], selectionOverride: [{
-                type: Input
-            }], selectionNoWrap: [{
-                type: HostBinding,
-                args: ['class.select2-selection-nowrap']
-            }, {
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], showSelectAll: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], removeAllText: [{
-                type: Input
-            }], selectAllText: [{
-                type: Input
-            }], update: [{
-                type: Output
-            }], autoCreateItem: [{
-                type: Output
-            }], open: [{
-                type: Output
-            }], close: [{
-                type: Output
-            }], focus: [{
-                type: Output
-            }], blur: [{
-                type: Output
-            }], search: [{
-                type: Output
-            }], scroll: [{
-                type: Output
-            }], removeOption: [{
-                type: Output
-            }], ariaInvalid: [{
-                type: HostBinding,
-                args: ['attr.aria-invalid']
-            }], classMaterial: [{
+                }] }], propDecorators: { classMaterial: [{
                 type: HostBinding,
                 args: ['class.material']
             }], classNostyle: [{
@@ -1418,67 +1478,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
             }], select2above: [{
                 type: HostBinding,
                 args: ['class.select2-above']
-            }], cdkConnectedOverlay: [{
-                type: ViewChild,
-                args: [CdkConnectedOverlay]
-            }], selection: [{
-                type: ViewChild,
-                args: ['selection', { static: true }]
-            }], resultContainer: [{
-                type: ViewChild,
-                args: ['results']
-            }], results: [{
-                type: ViewChildren,
-                args: ['result']
-            }], searchInput: [{
-                type: ViewChild,
-                args: ['searchInput']
-            }], dropdown: [{
-                type: ViewChild,
-                args: ['dropdown']
             }], clickDetection: [{
                 type: HostListener,
                 args: ['document:click', ['$event']]
             }] } });
 
-class Select2Hint {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Hint, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: Select2Hint, isStandalone: false, selector: "select2-hint", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Hint, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'select2-hint',
-                    standalone: false
-                }]
-        }] });
-
-class Select2Label {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Label, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: Select2Label, isStandalone: false, selector: "select2-label", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Label, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'select2-label',
-                    standalone: false
-                }]
-        }] });
-
-class Select2Module {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Module, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.0", ngImport: i0, type: Select2Module, declarations: [Select2Hint, Select2Label, Select2], imports: [CommonModule, FormsModule, OverlayModule, ReactiveFormsModule, InfiniteScrollModule], exports: [FormsModule, ReactiveFormsModule, Select2Hint, Select2Label, Select2] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Module, imports: [CommonModule, FormsModule, OverlayModule, ReactiveFormsModule, InfiniteScrollModule, FormsModule, ReactiveFormsModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Select2Module, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [CommonModule, FormsModule, OverlayModule, ReactiveFormsModule, InfiniteScrollModule],
-                    declarations: [Select2Hint, Select2Label, Select2],
-                    exports: [FormsModule, ReactiveFormsModule, Select2Hint, Select2Label, Select2],
-                }]
-        }] });
-
 /*
  * Public API Surface of ng-select2-component
  */
@@ -1487,5 +1491,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { Select2, Select2Hint, Select2Label, Select2Module, Select2Utils, defaultMinCountForSearch, protectRegexp, timeout, unicodePatterns };
+export { Select2, Select2Hint, Select2Label, Select2Utils, defaultMinCountForSearch, protectRegexp, timeout, unicodePatterns };
 //# sourceMappingURL=ng-select2-component.mjs.map