ngx-tethys 20.0.1 → 20.0.3

package/fesm2022/ngx-tethys-shared.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, inject, ViewContainerRef, effect, Directive, ElementRef, NgZone, Renderer2, output, computed, ContentChildren, KeyValueDiffers, linkedSignal, TemplateRef, untracked, ChangeDetectorRef, NgModule, Input, DestroyRef, model, signal, numberAttribute, viewChild, ChangeDetectionStrategy, Component, InjectionToken, HostListener, ViewEncapsulation } from '@angular/core';
+import { input, inject, ViewContainerRef, effect, Directive, ElementRef, NgZone, Renderer2, output, computed, ContentChildren, KeyValueDiffers, linkedSignal, TemplateRef, untracked, ChangeDetectorRef, NgModule, Input, DestroyRef, model, signal, numberAttribute, viewChild, ChangeDetectionStrategy, Component, InjectionToken, HostListener, ViewEncapsulation, contentChild } from '@angular/core';
 import { reqAnimFrame, TabIndexDisabledControlValueAccessorMixin, ThyTranslate, mixinDisabled, MixinBase } from 'ngx-tethys/core';
 import { coerceBooleanProperty, keycodes, isTemplateRef, isUndefinedOrNull, coerceArray, ENTER, SPACE, hasModifierKey } from 'ngx-tethys/util';
 import { useHostRenderer } from '@tethys/cdk/dom';
@@ -34,10 +34,10 @@ class ThyTranscludeDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyTranscludeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyTranscludeDirective, isStandalone: true, selector: "[thyTransclude]", inputs: { thyTransclude: { classPropertyName: "thyTransclude", publicName: "thyTransclude", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyTranscludeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyTranscludeDirective, isStandalone: true, selector: "[thyTransclude]", inputs: { thyTransclude: { classPropertyName: "thyTransclude", publicName: "thyTransclude", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyTranscludeDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyTranscludeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyTransclude]'
@@ -82,10 +82,10 @@ class ThyAutofocusDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyAutofocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyAutofocusDirective, isStandalone: true, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: { thyAutofocus: { classPropertyName: "thyAutofocus", publicName: "thyAutofocus", isSignal: true, isRequired: false, transformFunction: null }, thyAutoSelect: { classPropertyName: "thyAutoSelect", publicName: "thyAutoSelect", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyAutofocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyAutofocusDirective, isStandalone: true, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: { thyAutofocus: { classPropertyName: "thyAutofocus", publicName: "thyAutofocus", isSignal: true, isRequired: false, transformFunction: null }, thyAutoSelect: { classPropertyName: "thyAutoSelect", publicName: "thyAutoSelect", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyAutofocusDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyAutofocusDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[thyAutofocus],textarea[thyAutofocus]'
@@ -119,10 +119,10 @@ class ThyEnterDirective {
     ngOnDestroy() {
         this.removeKeydownListenerFn();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.14", type: ThyEnterDirective, isStandalone: true, selector: "[thyEnter]", outputs: { thyEnter: "thyEnter" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: ThyEnterDirective, isStandalone: true, selector: "[thyEnter]", outputs: { thyEnter: "thyEnter" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyEnterDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyEnterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyEnter]'
@@ -156,10 +156,10 @@ class ThyCtrlEnterDirective {
     ngOnDestroy() {
         this.removeKeydownListenerFn();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyCtrlEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.14", type: ThyCtrlEnterDirective, isStandalone: true, selector: "[thyCtrlEnter]", outputs: { thyCtrlEnter: "thyCtrlEnter" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyCtrlEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: ThyCtrlEnterDirective, isStandalone: true, selector: "[thyCtrlEnter]", outputs: { thyCtrlEnter: "thyCtrlEnter" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyCtrlEnterDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyCtrlEnterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyCtrlEnter]'
@@ -182,6 +182,7 @@ class ThyShowDirective {
         this.ngZone = inject(NgZone);
         this.thyShowChange = output();
         this.hostRenderer = useHostRenderer();
+        this.unListenEvent = null;
         this.thyShow = input(false, ...(ngDevMode ? [{ debugName: "thyShow", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
         effect(() => {
             if (this.thyShow()) {
@@ -204,10 +205,10 @@ class ThyShowDirective {
     ngOnDestroy() {
         this.unListenDocument();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyShowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyShowDirective, isStandalone: true, selector: "[thyShow]", inputs: { thyShow: { classPropertyName: "thyShow", publicName: "thyShow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyShowChange: "thyShowChange" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyShowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyShowDirective, isStandalone: true, selector: "[thyShow]", inputs: { thyShow: { classPropertyName: "thyShow", publicName: "thyShow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyShowChange: "thyShowChange" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyShowDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyShowDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyShow]'
@@ -256,10 +257,10 @@ class ThyStopPropagationDirective {
     ngOnDestroy() {
         this._destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyStopPropagationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyStopPropagationDirective, isStandalone: true, selector: "[thyStopPropagation]", inputs: { thyStopPropagation: { classPropertyName: "thyStopPropagation", publicName: "thyStopPropagation", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyStopPropagationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyStopPropagationDirective, isStandalone: true, selector: "[thyStopPropagation]", inputs: { thyStopPropagation: { classPropertyName: "thyStopPropagation", publicName: "thyStopPropagation", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyStopPropagationDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyStopPropagationDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyStopPropagation]'
@@ -290,10 +291,10 @@ class ThyContextMenuDirective {
     ngOnDestroy() {
         this.removeContextListenerFn();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyContextMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.14", type: ThyContextMenuDirective, isStandalone: true, selector: "[thyContextMenu]", outputs: { thyContextMenu: "thyContextMenu" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyContextMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: ThyContextMenuDirective, isStandalone: true, selector: "[thyContextMenu]", outputs: { thyContextMenu: "thyContextMenu" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyContextMenuDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyContextMenuDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyContextMenu]'
@@ -309,6 +310,7 @@ class ThyScrollDirective {
         this.elementRef = inject(ElementRef);
         this.ngZone = inject(NgZone);
         this._destroyed = new Subject();
+        this._subscription = null;
         this._elementScrolled = new Observable((observer) => this.ngZone.runOutsideAngular(() => fromEvent(this.elementRef.nativeElement, 'scroll', passiveEventListenerOptions)
             .pipe(takeUntil(this._destroyed))
             .subscribe(observer)));
@@ -354,10 +356,10 @@ class ThyScrollDirective {
     getElementRef() {
         return this.elementRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyScrollDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyScrollDirective, isStandalone: true, selector: "[thyScroll]", inputs: { thyEnable: { classPropertyName: "thyEnable", publicName: "thyEnable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyOnScrolled: "thyOnScrolled" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyScrollDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyScrollDirective, isStandalone: true, selector: "[thyScroll]", inputs: { thyEnable: { classPropertyName: "thyEnable", publicName: "thyEnable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyOnScrolled: "thyOnScrolled" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyScrollDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyScrollDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyScroll]'
@@ -396,10 +398,10 @@ class ThyDragDropDirective {
         this.ngUnsubscribe$.next();
         this.ngUnsubscribe$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyDragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.14", type: ThyDragDropDirective, isStandalone: true, selector: "[thyDragDrop]", queries: [{ propertyName: "draggables", predicate: CdkDrag, descendants: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyDragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: ThyDragDropDirective, isStandalone: true, selector: "[thyDragDrop]", queries: [{ propertyName: "draggables", predicate: CdkDrag, descendants: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyDragDropDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyDragDropDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyDragDrop]'
@@ -416,6 +418,7 @@ class ThyStringOrTemplateOutletDirective {
     constructor() {
         this.viewContainerRef = inject(ViewContainerRef);
         this.renderer = inject(Renderer2);
+        this.viewRef = null;
         this.thyStringOrTemplateOutletContext = input(...(ngDevMode ? [undefined, { debugName: "thyStringOrTemplateOutletContext" }] : []));
         this.thyStringOrTemplateOutlet = input(...(ngDevMode ? [undefined, { debugName: "thyStringOrTemplateOutlet" }] : []));
         effect(() => {
@@ -435,7 +438,7 @@ class ThyStringOrTemplateOutletDirective {
                 this.viewRef = this.viewContainerRef.createEmbeddedView(thyStringOrTemplateOutlet, this.thyStringOrTemplateOutletContext());
             }
             else {
-                this.textNode = this.renderer.createText(thyStringOrTemplateOutlet + '');
+                this.textNode = this.renderer.createText(`${thyStringOrTemplateOutlet}`);
                 const element = this.viewContainerRef.element.nativeElement;
                 this.renderer.insertBefore(element.parentNode, this.textNode, element);
             }
@@ -450,10 +453,10 @@ class ThyStringOrTemplateOutletDirective {
             this.renderer.removeChild(this.textNode.parentNode, this.textNode);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyStringOrTemplateOutletDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyStringOrTemplateOutletDirective, isStandalone: true, selector: "[thyStringOrTemplateOutlet]", inputs: { thyStringOrTemplateOutletContext: { classPropertyName: "thyStringOrTemplateOutletContext", publicName: "thyStringOrTemplateOutletContext", isSignal: true, isRequired: false, transformFunction: null }, thyStringOrTemplateOutlet: { classPropertyName: "thyStringOrTemplateOutlet", publicName: "thyStringOrTemplateOutlet", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["thyStringOrTemplateOutlet"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyStringOrTemplateOutletDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyStringOrTemplateOutletDirective, isStandalone: true, selector: "[thyStringOrTemplateOutlet]", inputs: { thyStringOrTemplateOutletContext: { classPropertyName: "thyStringOrTemplateOutletContext", publicName: "thyStringOrTemplateOutletContext", isSignal: true, isRequired: false, transformFunction: null }, thyStringOrTemplateOutlet: { classPropertyName: "thyStringOrTemplateOutlet", publicName: "thyStringOrTemplateOutlet", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["thyStringOrTemplateOutlet"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyStringOrTemplateOutletDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyStringOrTemplateOutletDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyStringOrTemplateOutlet]',
@@ -462,6 +465,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
         }], ctorParameters: () => [], propDecorators: { thyStringOrTemplateOutletContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyStringOrTemplateOutletContext", required: false }] }], thyStringOrTemplateOutlet: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyStringOrTemplateOutlet", required: false }] }] } });
 
 function hasInput(componentRef, inputKey) {
+    // @ts-ignore
     return componentRef['_tNode'].inputs?.[inputKey];
 }
 /**
@@ -548,10 +552,10 @@ class ThyViewOutletDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyViewOutletDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyViewOutletDirective, isStandalone: true, selector: "[thyViewOutlet]", inputs: { thyViewOutlet: { classPropertyName: "thyViewOutlet", publicName: "thyViewOutlet", isSignal: true, isRequired: false, transformFunction: null }, thyViewOutletContext: { classPropertyName: "thyViewOutletContext", publicName: "thyViewOutletContext", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyViewOutletDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyViewOutletDirective, isStandalone: true, selector: "[thyViewOutlet]", inputs: { thyViewOutlet: { classPropertyName: "thyViewOutlet", publicName: "thyViewOutlet", isSignal: true, isRequired: false, transformFunction: null }, thyViewOutletContext: { classPropertyName: "thyViewOutletContext", publicName: "thyViewOutletContext", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyViewOutletDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyViewOutletDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[thyViewOutlet]'
@@ -559,8 +563,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
         }], ctorParameters: () => [], propDecorators: { thyViewOutlet: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyViewOutlet", required: false }] }], thyViewOutletContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyViewOutletContext", required: false }] }] } });
 
 class ThySharedModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: ThySharedModule, imports: [ThyViewOutletDirective,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: ThySharedModule, imports: [ThyViewOutletDirective,
             ThyTranscludeDirective,
             ThyAutofocusDirective,
             ThyEnterDirective,
@@ -581,9 +585,9 @@ class ThySharedModule {
             ThyDragDropDirective,
             ThyStringOrTemplateOutletDirective,
             ThyViewOutletDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySharedModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySharedModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySharedModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -696,10 +700,10 @@ class ThyFormCheckBaseComponent extends TabIndexDisabledControlValueAccessorMixi
             this.changeDetectorRef.markForCheck();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyFormCheckBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: ThyFormCheckBaseComponent, isStandalone: true, inputs: { thyInline: { classPropertyName: "thyInline", publicName: "thyInline", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thyLabelTextTranslateKey: { classPropertyName: "thyLabelTextTranslateKey", publicName: "thyLabelTextTranslateKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: false, isRequired: false, transformFunction: coerceBooleanProperty } }, host: { properties: { "class.form-check": "_isFormCheck", "class.form-check-inline": "thyInline()", "class.form-check-checked": "_isChecked", "class.form-check-inline-no-label-text": "_isNoText()" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyFormCheckBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.15", type: ThyFormCheckBaseComponent, isStandalone: true, inputs: { thyInline: { classPropertyName: "thyInline", publicName: "thyInline", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thyLabelTextTranslateKey: { classPropertyName: "thyLabelTextTranslateKey", publicName: "thyLabelTextTranslateKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: false, isRequired: false, transformFunction: coerceBooleanProperty } }, host: { properties: { "class.form-check": "_isFormCheck", "class.form-check-inline": "thyInline()", "class.form-check-checked": "_isChecked", "class.form-check-inline-no-label-text": "_isNoText()" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyFormCheckBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyFormCheckBaseComponent, decorators: [{
             type: Directive,
             args: [{
                     host: {
@@ -737,7 +741,7 @@ class ThySelectControl {
                 computation: (source, previous) => previous?.source
             }]));
         this.thyDisabled = input(false, ...(ngDevMode ? [{ debugName: "thyDisabled", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
-        this.customDisplayTemplate = input(undefined, ...(ngDevMode ? [{ debugName: "customDisplayTemplate" }] : []));
+        this.customDisplayTemplate = input(...(ngDevMode ? [undefined, { debugName: "customDisplayTemplate" }] : []));
         this.thyAllowClear = input(false, ...(ngDevMode ? [{ debugName: "thyAllowClear", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
         this.thyPlaceholder = input('', ...(ngDevMode ? [{ debugName: "thyPlaceholder" }] : []));
         this.thySize = input(...(ngDevMode ? [undefined, { debugName: "thySize" }] : []));
@@ -924,7 +928,7 @@ class ThySelectControl {
     calculateVisibleTags() {
         if (!this.tagsContainer()?.nativeElement)
             return;
-        const containerWidth = this.tagsContainer().nativeElement.offsetWidth;
+        const containerWidth = this.tagsContainer()?.nativeElement.offsetWidth;
         if (containerWidth <= 0)
             return;
         const selectedOptions = coerceArray(this.thySelectedOptions());
@@ -949,10 +953,9 @@ class ThySelectControl {
         let totalWidth = 0;
         let visibleCount = 0;
         Promise.resolve().then(() => {
-            const tagElements = this.tagsContainer().nativeElement.querySelectorAll('.choice-item.selected,.custom-choice-item');
+            const tagElements = this.tagsContainer()?.nativeElement.querySelectorAll('.choice-item.selected,.custom-choice-item');
             for (let i = 0; i < selectedOptions.length; i++) {
-                let tagWidth;
-                tagWidth = (tagElements[i]?.offsetWidth || 80) + TAG_GAP;
+                const tagWidth = (tagElements[i]?.offsetWidth || 80) + TAG_GAP;
                 if (totalWidth + tagWidth > availableWidth) {
                     break;
                 }
@@ -1028,10 +1031,10 @@ class ThySelectControl {
     onBlur(event) {
         this.thyOnBlur.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectControl, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: ThySelectControl, isStandalone: true, selector: "thy-select-control,[thySelectControl]", inputs: { inputValue: { classPropertyName: "inputValue", publicName: "inputValue", isSignal: true, isRequired: false, transformFunction: null }, thyPanelOpened: { classPropertyName: "thyPanelOpened", publicName: "thyPanelOpened", isSignal: true, isRequired: false, transformFunction: null }, thyIsMultiple: { classPropertyName: "thyIsMultiple", publicName: "thyIsMultiple", isSignal: true, isRequired: false, transformFunction: null }, thyShowSearch: { classPropertyName: "thyShowSearch", publicName: "thyShowSearch", isSignal: true, isRequired: false, transformFunction: null }, thySelectedOptions: { classPropertyName: "thySelectedOptions", publicName: "thySelectedOptions", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null }, customDisplayTemplate: { classPropertyName: "customDisplayTemplate", publicName: "customDisplayTemplate", isSignal: true, isRequired: false, transformFunction: null }, thyAllowClear: { classPropertyName: "thyAllowClear", publicName: "thyAllowClear", isSignal: true, isRequired: false, transformFunction: null }, thyPlaceholder: { classPropertyName: "thyPlaceholder", publicName: "thyPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null }, thyMaxTagCount: { classPropertyName: "thyMaxTagCount", publicName: "thyMaxTagCount", isSignal: true, isRequired: false, transformFunction: null }, thyBorderless: { classPropertyName: "thyBorderless", publicName: "thyBorderless", isSignal: true, isRequired: false, transformFunction: null }, thyPreset: { classPropertyName: "thyPreset", publicName: "thyPreset", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputValue: "inputValueChange", thyOnSearch: "thyOnSearch", thyOnRemove: "thyOnRemove", thyOnClear: "thyOnClear", thyOnBlur: "thyOnBlur" }, host: { properties: { "class.select-control-borderless": "thyBorderless()" } }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "tagsContainer", first: true, predicate: ["tagsContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #inputTemplate>\n  <input\n    #inputElement\n    [tabindex]=\"-1\"\n    (compositionstart)=\"compositionChange(true)\"\n    (compositionend)=\"compositionChange(false)\"\n    autocomplete=\"something-new\"\n    [ngClass]=\"searchInputControlClass\"\n    (input)=\"updateWidth()\"\n    [ngModel]=\"inputValue()\"\n    (ngModelChange)=\"setInputValue($event)\"\n    (keydown.backspace)=\"handleBackspace($event)\"\n    [disabled]=\"thyDisabled()\"\n    (blur)=\"onBlur($event)\" />\n</ng-template>\n\n<div class=\"select-control-rendered\">\n  @if (!isSelectedValue()) {\n    <div class=\"text-placeholder text-truncate\" [ngStyle]=\"placeholderStyle()\">\n      {{ thyPlaceholder() }}\n    </div>\n  }\n  @if (thyIsMultiple()) {\n    <div thyFlex thyWrap=\"wrap\" thyGap=\"4\" thyAlignItems=\"center\" class=\"w-100\" #tagsContainer>\n      @if (thyPreset() === 'tag') {\n        @for (item of selectedTags(); track trackValue($index, item)) {\n          <div thyFlexItem class=\"custom-choice-item text-truncate\" [ngClass]=\"{ hidden: $index > visibleTagCount() - 1 }\">\n            <ng-template\n              [ngTemplateOutlet]=\"customDisplayTemplate()\"\n              [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\">\n            </ng-template>\n            @if (!thyDisabled()) {\n              <div class=\"choice-remove-link ml-1\" (click)=\"removeHandle(item, $event)\">\n                <span>\n                  <thy-icon thyIconName=\"close\" class=\"font-size-sm\"></thy-icon>\n                </span>\n              </div>\n            }\n          </div>\n        }\n      } @else {\n        @for (item of selectedTags(); track trackValue($index, item)) {\n          <div\n            thyFlexItem\n            thyTag\n            class=\"choice-item selected\"\n            [ngClass]=\"{ disabled: thyDisabled() === true, hidden: $index > visibleTagCount() - 1 }\"\n            [thySize]=\"tagSize()\">\n            <div class=\"text-truncate h-100 d-flex align-items-center\">\n              @if (!customDisplayTemplate()) {\n                <thy-flexible-text [thyTooltipContent]=\"item?.thyLabelText\" class=\"text-truncate h-100\">\n                  {{ item?.thyLabelText }}\n                </thy-flexible-text>\n              } @else {\n                <ng-template\n                  [ngTemplateOutlet]=\"customDisplayTemplate()\"\n                  [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\"></ng-template>\n              }\n            </div>\n            @if (!thyDisabled()) {\n              <div class=\"choice-remove-link ml-1\" (click)=\"removeHandle(item, $event)\">\n                <span>\n                  <thy-icon thyIconName=\"close\" class=\"font-size-sm\"></thy-icon>\n                </span>\n              </div>\n            }\n          </div>\n        }\n      }\n      @if (collapsedSelectedTags()?.length > 0) {\n        <div\n          thyFlexItem\n          class=\"choice-item max-tag-count-choice\"\n          thyTag\n          [thySize]=\"tagSize()\"\n          [ngClass]=\"{ disabled: thyDisabled() === true }\"\n          [thyTooltip]=\"maxTagTooltip\">\n          <div class=\"text-truncate\">+{{ collapsedSelectedTags()?.length }}</div>\n        </div>\n      }\n      <div thyFlexItem class=\"select-control-search\">\n        <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n      </div>\n    </div>\n  } @else {\n    @if (isSelectedValue()) {\n      <div class=\"selected-value text-truncate\" [ngStyle]=\"selectedValueStyle()\">\n        @if (!customDisplayTemplate()) {\n          <span class=\"text-truncate\">{{ thySelectedOptions()?.thyLabelText }}</span>\n        } @else {\n          <ng-template\n            [ngTemplateOutlet]=\"customDisplayTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: thySelectedOptions()?.thyRawValue || thySelectedOptions()?.thyValue || thySelectedOptions()\n            }\"></ng-template>\n        }\n      </div>\n    }\n    <div class=\"select-control-search\">\n      <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n    </div>\n  }\n</div>\n<span class=\"select-control-arrow\">\n  <thy-icon thyIconName=\"angle-down\" class=\"font-size-base\"></thy-icon>\n</span>\n@if (showClearIcon()) {\n  <span class=\"select-control-clear remove-link\" (click)=\"clearHandle($event)\">\n    <thy-icon class=\"remove-link-icon font-size-base\" thyIconName=\"close-circle-bold-fill\"></thy-icon>\n  </span>\n}\n\n<ng-template #maxTagTooltip>\n  @let lastIndex = collapsedSelectedTags().length - 1;\n  @for (item of collapsedSelectedTags(); track trackValue($index, item)) {\n    {{ item.thyLabelText }}\n    @if ($index !== lastIndex) {\n      {{ locale().comma }}\n    }\n  }\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ThyTag, selector: "thy-tag,[thyTag]", inputs: ["thyTag", "thyShape", "thyColor", "thyTheme", "thySize", "thyHoverable"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "ngmodule", type: ThyGridModule }, { kind: "directive", type: i2.ThyFlex, selector: "[thyFlex]", inputs: ["thyDirection", "thyWrap", "thyJustifyContent", "thyAlignItems", "thyGap"] }, { kind: "directive", type: i2.ThyFlexItem, selector: "[thyFlexItem]", inputs: ["thyFlexItem", "thyGrow", "thyShrink", "thyBasis"] }, { kind: "directive", type: ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { kind: "component", type: ThyFlexibleText, selector: "thy-flexible-text,[thyFlexibleText]", inputs: ["thyTooltipTrigger", "thyContainerClass", "thyTooltipContent", "thyTooltipPlacement", "thyTooltipOffset"], exportAs: ["thyFlexibleText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectControl, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ThySelectControl, isStandalone: true, selector: "thy-select-control,[thySelectControl]", inputs: { inputValue: { classPropertyName: "inputValue", publicName: "inputValue", isSignal: true, isRequired: false, transformFunction: null }, thyPanelOpened: { classPropertyName: "thyPanelOpened", publicName: "thyPanelOpened", isSignal: true, isRequired: false, transformFunction: null }, thyIsMultiple: { classPropertyName: "thyIsMultiple", publicName: "thyIsMultiple", isSignal: true, isRequired: false, transformFunction: null }, thyShowSearch: { classPropertyName: "thyShowSearch", publicName: "thyShowSearch", isSignal: true, isRequired: false, transformFunction: null }, thySelectedOptions: { classPropertyName: "thySelectedOptions", publicName: "thySelectedOptions", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null }, customDisplayTemplate: { classPropertyName: "customDisplayTemplate", publicName: "customDisplayTemplate", isSignal: true, isRequired: false, transformFunction: null }, thyAllowClear: { classPropertyName: "thyAllowClear", publicName: "thyAllowClear", isSignal: true, isRequired: false, transformFunction: null }, thyPlaceholder: { classPropertyName: "thyPlaceholder", publicName: "thyPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null }, thyMaxTagCount: { classPropertyName: "thyMaxTagCount", publicName: "thyMaxTagCount", isSignal: true, isRequired: false, transformFunction: null }, thyBorderless: { classPropertyName: "thyBorderless", publicName: "thyBorderless", isSignal: true, isRequired: false, transformFunction: null }, thyPreset: { classPropertyName: "thyPreset", publicName: "thyPreset", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputValue: "inputValueChange", thyOnSearch: "thyOnSearch", thyOnRemove: "thyOnRemove", thyOnClear: "thyOnClear", thyOnBlur: "thyOnBlur" }, host: { properties: { "class.select-control-borderless": "thyBorderless()" } }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "tagsContainer", first: true, predicate: ["tagsContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #inputTemplate>\n  <input\n    #inputElement\n    [tabindex]=\"-1\"\n    (compositionstart)=\"compositionChange(true)\"\n    (compositionend)=\"compositionChange(false)\"\n    autocomplete=\"something-new\"\n    [ngClass]=\"searchInputControlClass\"\n    (input)=\"updateWidth()\"\n    [ngModel]=\"inputValue()\"\n    (ngModelChange)=\"setInputValue($event)\"\n    (keydown.backspace)=\"handleBackspace($event)\"\n    [disabled]=\"thyDisabled()\"\n    (blur)=\"onBlur($event)\" />\n</ng-template>\n\n<div class=\"select-control-rendered\">\n  @if (!isSelectedValue()) {\n    <div class=\"text-placeholder text-truncate\" [ngStyle]=\"placeholderStyle()\">\n      {{ thyPlaceholder() }}\n    </div>\n  }\n  @if (thyIsMultiple()) {\n    <div thyFlex thyWrap=\"wrap\" thyGap=\"4\" thyAlignItems=\"center\" class=\"w-100\" #tagsContainer>\n      @if (thyPreset() === 'tag') {\n        @for (item of selectedTags(); track trackValue($index, item)) {\n          <div thyFlexItem class=\"custom-choice-item text-truncate\" [ngClass]=\"{ hidden: $index > visibleTagCount() - 1 }\">\n            <ng-template\n              [ngTemplateOutlet]=\"customDisplayTemplate()\"\n              [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\">\n            </ng-template>\n            @if (!thyDisabled()) {\n              <div class=\"choice-remove-link ml-1\" (click)=\"removeHandle(item, $event)\">\n                <span>\n                  <thy-icon thyIconName=\"close\" class=\"font-size-sm\"></thy-icon>\n                </span>\n              </div>\n            }\n          </div>\n        }\n      } @else {\n        @for (item of selectedTags(); track trackValue($index, item)) {\n          <div\n            thyFlexItem\n            thyTag\n            class=\"choice-item selected\"\n            [ngClass]=\"{ disabled: thyDisabled() === true, hidden: $index > visibleTagCount() - 1 }\"\n            [thySize]=\"tagSize()\">\n            <div class=\"text-truncate h-100 d-flex align-items-center\">\n              @if (!customDisplayTemplate()) {\n                <thy-flexible-text [thyTooltipContent]=\"item?.thyLabelText\" class=\"text-truncate h-100\">\n                  {{ item?.thyLabelText }}\n                </thy-flexible-text>\n              } @else {\n                <ng-template\n                  [ngTemplateOutlet]=\"customDisplayTemplate()\"\n                  [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\"></ng-template>\n              }\n            </div>\n            @if (!thyDisabled()) {\n              <div class=\"choice-remove-link ml-1\" (click)=\"removeHandle(item, $event)\">\n                <span>\n                  <thy-icon thyIconName=\"close\" class=\"font-size-sm\"></thy-icon>\n                </span>\n              </div>\n            }\n          </div>\n        }\n      }\n      @if (collapsedSelectedTags()?.length > 0) {\n        <div\n          thyFlexItem\n          class=\"choice-item max-tag-count-choice\"\n          thyTag\n          [thySize]=\"tagSize()\"\n          [ngClass]=\"{ disabled: thyDisabled() === true }\"\n          [thyTooltip]=\"maxTagTooltip\">\n          <div class=\"text-truncate\">+{{ collapsedSelectedTags()?.length }}</div>\n        </div>\n      }\n      <div thyFlexItem class=\"select-control-search\">\n        <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n      </div>\n    </div>\n  } @else {\n    @if (isSelectedValue()) {\n      <div class=\"selected-value text-truncate\" [ngStyle]=\"selectedValueStyle()\">\n        @if (!customDisplayTemplate()) {\n          <span class=\"text-truncate\">{{ thySelectedOptions()?.thyLabelText }}</span>\n        } @else {\n          <ng-template\n            [ngTemplateOutlet]=\"customDisplayTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: thySelectedOptions()?.thyRawValue || thySelectedOptions()?.thyValue || thySelectedOptions()\n            }\"></ng-template>\n        }\n      </div>\n    }\n    <div class=\"select-control-search\">\n      <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n    </div>\n  }\n</div>\n<span class=\"select-control-arrow\">\n  <thy-icon thyIconName=\"angle-down\" class=\"font-size-base\"></thy-icon>\n</span>\n@if (showClearIcon()) {\n  <span class=\"select-control-clear remove-link\" (click)=\"clearHandle($event)\">\n    <thy-icon class=\"remove-link-icon font-size-base\" thyIconName=\"close-circle-bold-fill\"></thy-icon>\n  </span>\n}\n\n<ng-template #maxTagTooltip>\n  @let lastIndex = collapsedSelectedTags().length - 1;\n  @for (item of collapsedSelectedTags(); track trackValue($index, item)) {\n    {{ item.thyLabelText }}\n    @if ($index !== lastIndex) {\n      {{ locale().comma }}\n    }\n  }\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ThyTag, selector: "thy-tag,[thyTag]", inputs: ["thyTag", "thyShape", "thyColor", "thyTheme", "thySize", "thyHoverable"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "ngmodule", type: ThyGridModule }, { kind: "directive", type: i2.ThyFlex, selector: "[thyFlex]", inputs: ["thyDirection", "thyWrap", "thyJustifyContent", "thyAlignItems", "thyGap"] }, { kind: "directive", type: i2.ThyFlexItem, selector: "[thyFlexItem]", inputs: ["thyFlexItem", "thyGrow", "thyShrink", "thyBasis"] }, { kind: "directive", type: ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { kind: "component", type: ThyFlexibleText, selector: "thy-flexible-text,[thyFlexibleText]", inputs: ["thyTooltipTrigger", "thyContainerClass", "thyTooltipContent", "thyTooltipPlacement", "thyTooltipOffset"], exportAs: ["thyFlexibleText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectControl, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectControl, decorators: [{
             type: Component,
             args: [{ selector: 'thy-select-control,[thySelectControl]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgClass, NgStyle, ThyTag, NgTemplateOutlet, ThyIcon, ThyGridModule, ThyTooltipDirective, ThyFlexibleText], host: {
                         '[class.select-control-borderless]': 'thyBorderless()'
@@ -1046,11 +1049,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
  * found in the LICENSE file at https://angular.io/license
  */
 class ThySelectCommonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectCommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: ThySelectCommonModule, imports: [CommonModule, FormsModule, ThyIconModule, ThyTagModule, ThySelectControl], exports: [ThySelectControl] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectCommonModule, imports: [CommonModule, FormsModule, ThyIconModule, ThyTagModule, ThySelectControl] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectCommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: ThySelectCommonModule, imports: [CommonModule, FormsModule, ThyIconModule, ThyTagModule, ThySelectControl], exports: [ThySelectControl] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectCommonModule, imports: [CommonModule, FormsModule, ThyIconModule, ThyTagModule, ThySelectControl] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectCommonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectCommonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, FormsModule, ThyIconModule, ThyTagModule, ThySelectControl],
@@ -1074,9 +1077,9 @@ class ThyListOption {
         this.parentSelectionList = inject(THY_LIST_OPTION_PARENT_COMPONENT, { optional: true });
         this.role = 'option';
         this.tabIndex = -1;
-        this.isMultiple = computed(() => this.parentSelectionList.multiple(), ...(ngDevMode ? [{ debugName: "isMultiple" }] : []));
-        this.isListOption = computed(() => this.parentSelectionList.layout() === 'list', ...(ngDevMode ? [{ debugName: "isListOption" }] : []));
-        this.isGridOption = computed(() => this.parentSelectionList.layout() === 'grid', ...(ngDevMode ? [{ debugName: "isGridOption" }] : []));
+        this.isMultiple = computed(() => (this.parentSelectionList?.multiple && this.parentSelectionList.multiple()) ?? false, ...(ngDevMode ? [{ debugName: "isMultiple" }] : []));
+        this.isListOption = computed(() => this.parentSelectionList?.layout && this.parentSelectionList?.layout() === 'list', ...(ngDevMode ? [{ debugName: "isListOption" }] : []));
+        this.isGridOption = computed(() => this.parentSelectionList?.layout && this.parentSelectionList?.layout() === 'grid', ...(ngDevMode ? [{ debugName: "isGridOption" }] : []));
         this.id = input(`thy-list-option-${_uniqueIdCounter++}`, ...(ngDevMode ? [{ debugName: "id" }] : []));
         this.thyValue = input(undefined, ...(ngDevMode ? [{ debugName: "thyValue" }] : []));
         this.thyDisabled = input(false, ...(ngDevMode ? [{ debugName: "thyDisabled", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
@@ -1086,7 +1089,7 @@ class ThyListOption {
         return this.parentSelectionList.isSelected(this);
     }
     onClick(event) {
-        if (this.parentSelectionList.multiple() || !this.parentSelectionList.isSelected(this)) {
+        if ((this.parentSelectionList.multiple && this.parentSelectionList.multiple()) || !this.parentSelectionList.isSelected(this)) {
             this.parentSelectionList.toggleOption(this, event);
             this.parentSelectionList.setActiveOption(this);
         }
@@ -1105,10 +1108,10 @@ class ThyListOption {
     getLabel() {
         return '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyListOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: ThyListOption, isStandalone: true, selector: "thy-list-option,[thy-list-option]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.disabled": "thyDisabled()", "class.thy-list-option": "isListOption()", "class.thy-grid-option": "isGridOption()", "class.active": "selected", "attr.role": "role", "attr.tabindex": "tabIndex" } }, ngImport: i0, template: "<ng-content></ng-content>\n@if (isMultiple() && isListOption()) {\n  <span class=\"checked-icon\">\n    <thy-icon thyIconName=\"check\"></thy-icon>\n  </span>\n}\n@if (isGridOption()) {\n  <span class=\"checked-icon\">\n    <thy-icon thyIconName=\"check-circle-fill\"></thy-icon>\n  </span>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyListOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ThyListOption, isStandalone: true, selector: "thy-list-option,[thy-list-option]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.disabled": "thyDisabled()", "class.thy-list-option": "isListOption()", "class.thy-grid-option": "isGridOption()", "class.active": "selected", "attr.role": "role", "attr.tabindex": "tabIndex" } }, ngImport: i0, template: "<ng-content></ng-content>\n@if (isMultiple() && isListOption()) {\n  <span class=\"checked-icon\">\n    <thy-icon thyIconName=\"check\"></thy-icon>\n  </span>\n}\n@if (isGridOption()) {\n  <span class=\"checked-icon\">\n    <thy-icon thyIconName=\"check-circle-fill\"></thy-icon>\n  </span>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyListOption, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyListOption, decorators: [{
             type: Component,
             args: [{ selector: 'thy-list-option,[thy-list-option]', imports: [ThyIcon], host: {
                         '[class.disabled]': 'thyDisabled()',
@@ -1131,10 +1134,10 @@ class ThyOptionGroup extends _MixinBase {
     set thyDisabled(value) {
         this.thyDisabled = value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ThyOptionGroup, isStandalone: true, selector: "thy-list-option-group,[thy-list-option-group]", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: ThyOptionGroup, isStandalone: true, selector: "thy-list-option-group,[thy-list-option-group]", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'thy-list-option-group,[thy-list-option-group]',
@@ -1149,10 +1152,10 @@ class ThySelectOptionGroup {
         this.thyGroupLabel = input(...(ngDevMode ? [undefined, { debugName: "thyGroupLabel" }] : []));
         this.thyDisabled = input(false, ...(ngDevMode ? [{ debugName: "thyDisabled", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectOptionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.14", type: ThySelectOptionGroup, isStandalone: true, selector: "thy-option-group", inputs: { thyGroupLabel: { classPropertyName: "thyGroupLabel", publicName: "thyGroupLabel", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectOptionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.15", type: ThySelectOptionGroup, isStandalone: true, selector: "thy-option-group", inputs: { thyGroupLabel: { classPropertyName: "thyGroupLabel", publicName: "thyGroupLabel", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThySelectOptionGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThySelectOptionGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'thy-option-group',
@@ -1208,19 +1211,20 @@ class ThyOption {
          * 模板
          */
         this.template = viewChild(TemplateRef, ...(ngDevMode ? [{ debugName: "template" }] : []));
+        this.suffixTemplate = contentChild('suffixTemplate', ...(ngDevMode ? [{ debugName: "suffixTemplate" }] : []));
         this.optionGroupComponent = inject(ThySelectOptionGroup, { optional: true });
     }
     get groupLabel() {
         return this.optionGroupComponent?.thyGroupLabel() || '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.14", type: ThyOption, isStandalone: true, selector: "thy-option", inputs: { thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyRawValue: { classPropertyName: "thyRawValue", publicName: "thyRawValue", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thyShowOptionCustom: { classPropertyName: "thyShowOptionCustom", publicName: "thyShowOptionCustom", isSignal: true, isRequired: false, transformFunction: null }, thySearchKey: { classPropertyName: "thySearchKey", publicName: "thySearchKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.15", type: ThyOption, isStandalone: true, selector: "thy-option", inputs: { thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyRawValue: { classPropertyName: "thyRawValue", publicName: "thyRawValue", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thyShowOptionCustom: { classPropertyName: "thyShowOptionCustom", publicName: "thyShowOptionCustom", isSignal: true, isRequired: false, transformFunction: null }, thySearchKey: { classPropertyName: "thySearchKey", publicName: "thySearchKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "suffixTemplate", first: true, predicate: ["suffixTemplate"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
         <ng-template>
             <ng-content></ng-content>
         </ng-template>
     `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOption, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOption, decorators: [{
             type: Component,
             args: [{
                     selector: 'thy-option',
@@ -1231,7 +1235,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
     `,
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }], propDecorators: { thyValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyValue", required: false }] }], thyRawValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyRawValue", required: false }] }], thyLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyLabelText", required: false }] }], thyShowOptionCustom: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyShowOptionCustom", required: false }] }], thySearchKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "thySearchKey", required: false }] }], thyDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyDisabled", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], template: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }] } });
+        }], propDecorators: { thyValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyValue", required: false }] }], thyRawValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyRawValue", required: false }] }], thyLabelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyLabelText", required: false }] }], thyShowOptionCustom: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyShowOptionCustom", required: false }] }], thySearchKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "thySearchKey", required: false }] }], thyDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "thyDisabled", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], template: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], suffixTemplate: [{ type: i0.ContentChild, args: ['suffixTemplate', { isSignal: true }] }] } });
 
 /**
  * 选项渲染组件
@@ -1345,10 +1349,10 @@ class ThyOptionRender {
     setInactiveStyles() {
         this.hostRenderer.removeClass('hover');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionRender, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: ThyOptionRender, isStandalone: true, selector: "thy-option-render", inputs: { thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyRawValue: { classPropertyName: "thyRawValue", publicName: "thyRawValue", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thySearchKey: { classPropertyName: "thySearchKey", publicName: "thySearchKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null }, thyShowOptionCustom: { classPropertyName: "thyShowOptionCustom", publicName: "thyShowOptionCustom", isSignal: true, isRequired: false, transformFunction: null }, thyTemplate: { classPropertyName: "thyTemplate", publicName: "thyTemplate", isSignal: true, isRequired: false, transformFunction: null }, thyTemplateContext: { classPropertyName: "thyTemplateContext", publicName: "thyTemplateContext", isSignal: true, isRequired: false, transformFunction: null }, thyShowCheckedIcon: { classPropertyName: "thyShowCheckedIcon", publicName: "thyShowCheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, thySelectedValuesMap: { classPropertyName: "thySelectedValuesMap", publicName: "thySelectedValuesMap", isSignal: true, isRequired: false, transformFunction: null }, thyActivatedValue: { classPropertyName: "thyActivatedValue", publicName: "thyActivatedValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { optionClick: "optionClick", optionHover: "optionHover" }, host: { listeners: { "click": "selectViaInteraction()", "mouseenter": "mouseEnter()", "keydown": "handleKeydown($event)" }, properties: { "class.disabled": "thyDisabled()", "attr.tabindex": "tabIndex()", "class.active": "selected()" }, classAttribute: "thy-option-item" }, ngImport: i0, template: "@if (thyShowOptionCustom()) {\n  <ng-container *ngTemplateOutlet=\"thyTemplate(); context: thyTemplateContext()\"></ng-container>\n} @else {\n  <span class=\"text-truncate\">{{ thyLabelText() }}</span>\n}\n@if (thyShowCheckedIcon() && selected()) {\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionRender, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ThyOptionRender, isStandalone: true, selector: "thy-option-render", inputs: { thyValue: { classPropertyName: "thyValue", publicName: "thyValue", isSignal: true, isRequired: false, transformFunction: null }, thyRawValue: { classPropertyName: "thyRawValue", publicName: "thyRawValue", isSignal: true, isRequired: false, transformFunction: null }, thyLabelText: { classPropertyName: "thyLabelText", publicName: "thyLabelText", isSignal: true, isRequired: false, transformFunction: null }, thySearchKey: { classPropertyName: "thySearchKey", publicName: "thySearchKey", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null }, thyShowOptionCustom: { classPropertyName: "thyShowOptionCustom", publicName: "thyShowOptionCustom", isSignal: true, isRequired: false, transformFunction: null }, thyTemplate: { classPropertyName: "thyTemplate", publicName: "thyTemplate", isSignal: true, isRequired: false, transformFunction: null }, thyTemplateContext: { classPropertyName: "thyTemplateContext", publicName: "thyTemplateContext", isSignal: true, isRequired: false, transformFunction: null }, thyShowCheckedIcon: { classPropertyName: "thyShowCheckedIcon", publicName: "thyShowCheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, thySelectedValuesMap: { classPropertyName: "thySelectedValuesMap", publicName: "thySelectedValuesMap", isSignal: true, isRequired: false, transformFunction: null }, thyActivatedValue: { classPropertyName: "thyActivatedValue", publicName: "thyActivatedValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { optionClick: "optionClick", optionHover: "optionHover" }, host: { listeners: { "click": "selectViaInteraction()", "mouseenter": "mouseEnter()", "keydown": "handleKeydown($event)" }, properties: { "class.disabled": "thyDisabled()", "attr.tabindex": "tabIndex()", "class.active": "selected()" }, classAttribute: "thy-option-item" }, ngImport: i0, template: "@if (thyShowOptionCustom()) {\n  <ng-container *ngTemplateOutlet=\"thyTemplate(); context: thyTemplateContext()\"></ng-container>\n} @else {\n  <span class=\"text-truncate\">{{ thyLabelText() }}</span>\n}\n@if (thyShowCheckedIcon() && selected()) {\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionRender, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionRender, decorators: [{
             type: Component,
             args: [{ selector: 'thy-option-render', imports: [ThyIcon, NgTemplateOutlet], host: {
                         class: 'thy-option-item',
@@ -1369,10 +1373,10 @@ class ThyOptionGroupRender {
         this.thyGroupLabel = input(undefined, ...(ngDevMode ? [{ debugName: "thyGroupLabel" }] : []));
         this.thyDisabled = input(false, ...(ngDevMode ? [{ debugName: "thyDisabled", transform: coerceBooleanProperty }] : [{ transform: coerceBooleanProperty }]));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionGroupRender, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.14", type: ThyOptionGroupRender, isStandalone: true, selector: "thy-option-group-render", inputs: { thyGroupLabel: { classPropertyName: "thyGroupLabel", publicName: "thyGroupLabel", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.disabled": "thyDisabled()" }, classAttribute: "thy-option-group-render" }, ngImport: i0, template: `<span class="group-name text-truncate">{{ thyGroupLabel() }}</span>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionGroupRender, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.15", type: ThyOptionGroupRender, isStandalone: true, selector: "thy-option-group-render", inputs: { thyGroupLabel: { classPropertyName: "thyGroupLabel", publicName: "thyGroupLabel", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.disabled": "thyDisabled()" }, classAttribute: "thy-option-group-render" }, ngImport: i0, template: `<span class="group-name text-truncate">{{ thyGroupLabel() }}</span>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionGroupRender, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionGroupRender, decorators: [{
             type: Component,
             args: [{
                     selector: 'thy-option-group-render',
@@ -1392,8 +1396,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
  * found in the LICENSE file at https://angular.io/license
  */
 class ThyOptionModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionModule, imports: [CommonModule,
             ThyIconModule,
             ThyListOption,
             ThyOptionGroup,
@@ -1401,12 +1405,12 @@ class ThyOptionModule {
             ThyOptionRender,
             ThySelectOptionGroup,
             ThyOptionGroupRender], exports: [ThyListOption, ThyOptionGroup, ThyOption, ThyOptionRender, ThySelectOptionGroup, ThyOptionGroupRender] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionModule, imports: [CommonModule,
             ThyIconModule,
             ThyListOption,
             ThyOptionRender] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ThyOptionModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ThyOptionModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [