ngx-tethys 17.0.0 → 17.0.2

package/fesm2022/ngx-tethys-shared.mjs

@@ -1,9 +1,8 @@
 import * as i0 from '@angular/core';
-import { Directive, Input, EventEmitter, Output, ContentChildren, TemplateRef, ChangeDetectorRef, NgModule, HostBinding, Component, ChangeDetectionStrategy, ViewChild, InjectionToken, Optional, Inject, HostListener, ViewEncapsulation } from '@angular/core';
-import { __decorate, __metadata } from 'tslib';
+import { Directive, Input, booleanAttribute, EventEmitter, Output, ContentChildren, TemplateRef, ChangeDetectorRef, NgModule, HostBinding, numberAttribute, Component, ChangeDetectionStrategy, ViewChild, InjectionToken, Optional, Inject, HostListener, ViewEncapsulation } from '@angular/core';
 import * as i1 from 'ngx-tethys/core';
-import { reqAnimFrame, InputBoolean, mixinUnsubscribe, MixinBase, TabIndexDisabledControlValueAccessorMixin, InputNumber, mixinDisabled } from 'ngx-tethys/core';
-import { coerceBooleanProperty, keycodes, isTemplateRef, isUndefinedOrNull, ENTER, SPACE, hasModifierKey } from 'ngx-tethys/util';
+import { reqAnimFrame, mixinUnsubscribe, MixinBase, TabIndexDisabledControlValueAccessorMixin, mixinDisabled } from 'ngx-tethys/core';
+import { keycodes, isTemplateRef, isUndefinedOrNull, ENTER, SPACE, hasModifierKey } from 'ngx-tethys/util';
 import { useHostRenderer } from '@tethys/cdk/dom';
 import { Subject, Observable, fromEvent, merge, defer } from 'rxjs';
 import { startWith, switchMap, takeUntil, take, debounceTime, map } from 'rxjs/operators';
@@ -56,7 +55,7 @@ class ThyAutofocusDirective {
      * @default false
      */
     set thyAutofocus(value) {
-        if (coerceBooleanProperty(value) !== false) {
+        if (value) {
             // Note: this is being run outside of the Angular zone because `element.focus()` doesn't require
             // running change detection.
             this.ngZone.runOutsideAngular(() => 
@@ -77,7 +76,7 @@ class ThyAutofocusDirective {
      * @default false
      */
     set thyAutoSelect(value) {
-        this._autoSelect = coerceBooleanProperty(value);
+        this._autoSelect = value;
     }
     constructor(elementRef, ngZone) {
         this.elementRef = elementRef;
@@ -86,13 +85,8 @@ class ThyAutofocusDirective {
         this._autoSelect = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyAutofocusDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: ThyAutofocusDirective, isStandalone: true, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: { thyAutofocus: "thyAutofocus", thyAutoSelect: "thyAutoSelect" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.2.3", type: ThyAutofocusDirective, isStandalone: true, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: { thyAutofocus: ["thyAutofocus", "thyAutofocus", booleanAttribute], thyAutoSelect: ["thyAutoSelect", "thyAutoSelect", booleanAttribute] }, ngImport: i0 }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyAutofocusDirective.prototype, "thyAutoSelect", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyAutofocusDirective, decorators: [{
             type: Directive,
             args: [{
@@ -100,9 +94,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                     standalone: true
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { thyAutofocus: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyAutoSelect: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 /**
@@ -225,13 +221,8 @@ class ThyShowDirective {
         this.unListenDocument();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyShowDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: ThyShowDirective, isStandalone: true, selector: "[thyShow]", inputs: { thyShow: "thyShow" }, outputs: { thyShowChange: "thyShowChange" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.2.3", type: ThyShowDirective, isStandalone: true, selector: "[thyShow]", inputs: { thyShow: ["thyShow", "thyShow", booleanAttribute] }, outputs: { thyShowChange: "thyShowChange" }, ngImport: i0 }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyShowDirective.prototype, "thyShow", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyShowDirective, decorators: [{
             type: Directive,
             args: [{
@@ -241,7 +232,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }], propDecorators: { thyShowChange: [{
                 type: Output
             }], thyShow: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 /**
@@ -338,7 +330,7 @@ const passiveEventListenerOptions = normalizePassiveListenerOptions({ passive: t
  */
 class ThyScrollDirective {
     set thyEnable(value) {
-        this._enable = coerceBooleanProperty(value);
+        this._enable = value;
         if (this._initialled) {
             if (this._enable && this._subscription === null) {
                 this._subscription = this._elementScrolled.subscribe(() => this.thyOnScrolled.emit(this.elementRef));
@@ -395,13 +387,8 @@ class ThyScrollDirective {
         return this.elementRef;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyScrollDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: ThyScrollDirective, isStandalone: true, selector: "[thyScroll]", inputs: { thyEnable: "thyEnable" }, outputs: { thyOnScrolled: "thyOnScrolled" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.2.3", type: ThyScrollDirective, isStandalone: true, selector: "[thyScroll]", inputs: { thyEnable: ["thyEnable", "thyEnable", booleanAttribute] }, outputs: { thyOnScrolled: "thyOnScrolled" }, ngImport: i0 }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyScrollDirective.prototype, "thyEnable", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyScrollDirective, decorators: [{
             type: Directive,
             args: [{
@@ -409,7 +396,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                     standalone: true
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { thyEnable: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyOnScrolled: [{
                 type: Output
             }] } });
@@ -667,7 +655,7 @@ class ThyFormCheckBaseComponent extends TabIndexDisabledControlValueAccessorMixi
      * @default false
      */
     set thyInline(value) {
-        this._isFormCheckInline = coerceBooleanProperty(value);
+        this._isFormCheckInline = value;
     }
     /**
      * Label 展示文本
@@ -691,7 +679,7 @@ class ThyFormCheckBaseComponent extends TabIndexDisabledControlValueAccessorMixi
      * @default false
      */
     set thyDisabled(value) {
-        this.disabled = coerceBooleanProperty(value);
+        this.disabled = value;
         this.setDisabledState(this.disabled);
     }
     get thyDisabled() {
@@ -742,18 +730,8 @@ class ThyFormCheckBaseComponent extends TabIndexDisabledControlValueAccessorMixi
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyFormCheckBaseComponent, deps: [{ token: i1.ThyTranslate }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: ThyFormCheckBaseComponent, inputs: { thyInline: "thyInline", thyLabelText: "thyLabelText", thyLabelTextTranslateKey: "thyLabelTextTranslateKey", thyDisabled: "thyDisabled" }, host: { properties: { "class.form-check": "this._isFormCheck", "class.form-check-inline": "this._isFormCheckInline", "class.form-check-checked": "this._isChecked", "class.form-check-inline-no-label-text": "this._isNoText" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.2.3", type: ThyFormCheckBaseComponent, inputs: { thyInline: ["thyInline", "thyInline", booleanAttribute], thyLabelText: "thyLabelText", thyLabelTextTranslateKey: "thyLabelTextTranslateKey", thyDisabled: ["thyDisabled", "thyDisabled", booleanAttribute] }, host: { properties: { "class.form-check": "this._isFormCheck", "class.form-check-inline": "this._isFormCheckInline", "class.form-check-checked": "this._isChecked", "class.form-check-inline-no-label-text": "this._isNoText" } }, usesInheritance: true, ngImport: i0 }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyFormCheckBaseComponent.prototype, "thyInline", null);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyFormCheckBaseComponent.prototype, "thyDisabled", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyFormCheckBaseComponent, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i1.ThyTranslate }, { type: i0.ChangeDetectorRef }], propDecorators: { _isFormCheck: [{
@@ -769,13 +747,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                 type: HostBinding,
                 args: ['class.form-check-inline-no-label-text']
             }], thyInline: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyLabelText: [{
                 type: Input
             }], thyLabelTextTranslateKey: [{
                 type: Input
             }], thyDisabled: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 /**
@@ -996,67 +976,42 @@ class ThySelectControl {
         this.thyOnBlur.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThySelectControl, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ThySelectControl, isStandalone: true, selector: "thy-select-control,[thySelectControl]", inputs: { thyPanelOpened: "thyPanelOpened", thyIsMultiple: "thyIsMultiple", thyShowSearch: "thyShowSearch", thySelectedOptions: "thySelectedOptions", thyDisabled: "thyDisabled", customDisplayTemplate: "customDisplayTemplate", thyAllowClear: "thyAllowClear", thyPlaceholder: "thyPlaceholder", thySize: "thySize", thyMaxTagCount: "thyMaxTagCount", thyBorderless: "thyBorderless", thyPreset: "thyPreset" }, outputs: { thyOnSearch: "thyOnSearch", thyOnRemove: "thyOnRemove", thyOnClear: "thyOnClear", thyOnBlur: "thyOnBlur" }, host: { properties: { "class.select-control-borderless": "thyBorderless" } }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<ng-template #inputTemplate>\n  <input\n    #inputElement\n    [tabindex]=\"-1\"\n    (compositionstart)=\"isComposing = true\"\n    (compositionend)=\"isComposing = 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  <div class=\"text-placeholder text-truncate\" *ngIf=\"!isSelectedValue\" [ngStyle]=\"placeholderStyle\">\n    {{ thyPlaceholder }}\n  </div>\n  <ng-container *ngIf=\"isMultiple; else single\">\n    <div thyFlex thyWrap=\"wrap\" thyGap=\"4\" thyAlignItems=\"center\" class=\"w-100\">\n      <ng-container *ngIf=\"thyPreset === 'tag'; else default\">\n        <div thyFlexItem class=\"custom-choice-item text-truncate\" *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <ng-template\n            [ngTemplateOutlet]=\"customDisplayTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\">\n          </ng-template>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-container>\n\n      <ng-template #default>\n        <div\n          thyFlexItem\n          thyTag\n          class=\"choice-item\"\n          [ngClass]=\"{ disabled: disabled === true }\"\n          [thySize]=\"tagSize\"\n          *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <div class=\"text-truncate h-100\">\n            <ng-template\n              #customDisplay\n              [ngTemplateOutlet]=\"customDisplayTemplate\"\n              [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\"></ng-template>\n            <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n              {{ item.thyLabelText }}\n            </ng-container>\n          </div>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-template>\n\n      <div\n        thyFlexItem\n        class=\"choice-item max-tag-count-choice\"\n        *ngIf=\"thyMaxTagCount && multipleSelectedValue.length > thyMaxTagCount\"\n        thyTag\n        [thySize]=\"tagSize\"\n        [ngClass]=\"{ disabled: disabled === true }\">\n        <div class=\"text-truncate\">+{{ multipleSelectedValue.length - thyMaxTagCount + 1 }}...</div>\n      </div>\n      <div thyFlexItem class=\"select-control-search\">\n        <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n      </div>\n    </div>\n  </ng-container>\n  <ng-template #single>\n    <ng-container *ngIf=\"isSelectedValue\">\n      <div class=\"selected-value text-truncate\" [ngStyle]=\"selectedValueStyle\">\n        <ng-template\n          #customDisplay\n          [ngTemplateOutlet]=\"customDisplayTemplate\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedValue.thyRawValue || selectedValue.thyValue || selectedValue\n          }\"></ng-template>\n        <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n          <span class=\"text-truncate\">{{ selectedValue?.thyLabelText }}</span>\n        </ng-container>\n      </div>\n    </ng-container>\n    <div class=\"select-control-search\">\n      <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n    </div>\n  </ng-template>\n</div>\n<span class=\"select-control-arrow\">\n  <thy-icon thyIconName=\"angle-down\" class=\"font-size-base\"></thy-icon>\n</span>\n<span class=\"select-control-clear remove-link\" *ngIf=\"showClearIcon\" (click)=\"clearHandle($event)\">\n  <thy-icon class=\"remove-link-icon font-size-base\" thyIconName=\"close-circle-bold-fill\"></thy-icon>\n</span>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.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: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.3", type: ThySelectControl, isStandalone: true, selector: "thy-select-control,[thySelectControl]", inputs: { thyPanelOpened: ["thyPanelOpened", "thyPanelOpened", booleanAttribute], thyIsMultiple: ["thyIsMultiple", "thyIsMultiple", booleanAttribute], thyShowSearch: ["thyShowSearch", "thyShowSearch", booleanAttribute], thySelectedOptions: "thySelectedOptions", thyDisabled: ["thyDisabled", "thyDisabled", booleanAttribute], customDisplayTemplate: "customDisplayTemplate", thyAllowClear: ["thyAllowClear", "thyAllowClear", booleanAttribute], thyPlaceholder: "thyPlaceholder", thySize: "thySize", thyMaxTagCount: ["thyMaxTagCount", "thyMaxTagCount", numberAttribute], thyBorderless: ["thyBorderless", "thyBorderless", booleanAttribute], thyPreset: "thyPreset" }, outputs: { thyOnSearch: "thyOnSearch", thyOnRemove: "thyOnRemove", thyOnClear: "thyOnClear", thyOnBlur: "thyOnBlur" }, host: { properties: { "class.select-control-borderless": "thyBorderless" } }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<ng-template #inputTemplate>\n  <input\n    #inputElement\n    [tabindex]=\"-1\"\n    (compositionstart)=\"isComposing = true\"\n    (compositionend)=\"isComposing = 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  <div class=\"text-placeholder text-truncate\" *ngIf=\"!isSelectedValue\" [ngStyle]=\"placeholderStyle\">\n    {{ thyPlaceholder }}\n  </div>\n  <ng-container *ngIf=\"isMultiple; else single\">\n    <div thyFlex thyWrap=\"wrap\" thyGap=\"4\" thyAlignItems=\"center\" class=\"w-100\">\n      <ng-container *ngIf=\"thyPreset === 'tag'; else default\">\n        <div thyFlexItem class=\"custom-choice-item text-truncate\" *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <ng-template\n            [ngTemplateOutlet]=\"customDisplayTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\">\n          </ng-template>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-container>\n\n      <ng-template #default>\n        <div\n          thyFlexItem\n          thyTag\n          class=\"choice-item\"\n          [ngClass]=\"{ disabled: disabled === true }\"\n          [thySize]=\"tagSize\"\n          *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <div class=\"text-truncate h-100\">\n            <ng-template\n              #customDisplay\n              [ngTemplateOutlet]=\"customDisplayTemplate\"\n              [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\"></ng-template>\n            <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n              {{ item.thyLabelText }}\n            </ng-container>\n          </div>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-template>\n\n      <div\n        thyFlexItem\n        class=\"choice-item max-tag-count-choice\"\n        *ngIf=\"thyMaxTagCount && multipleSelectedValue.length > thyMaxTagCount\"\n        thyTag\n        [thySize]=\"tagSize\"\n        [ngClass]=\"{ disabled: disabled === true }\">\n        <div class=\"text-truncate\">+{{ multipleSelectedValue.length - thyMaxTagCount + 1 }}...</div>\n      </div>\n      <div thyFlexItem class=\"select-control-search\">\n        <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n      </div>\n    </div>\n  </ng-container>\n  <ng-template #single>\n    <ng-container *ngIf=\"isSelectedValue\">\n      <div class=\"selected-value text-truncate\" [ngStyle]=\"selectedValueStyle\">\n        <ng-template\n          #customDisplay\n          [ngTemplateOutlet]=\"customDisplayTemplate\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedValue.thyRawValue || selectedValue.thyValue || selectedValue\n          }\"></ng-template>\n        <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n          <span class=\"text-truncate\">{{ selectedValue?.thyLabelText }}</span>\n        </ng-container>\n      </div>\n    </ng-container>\n    <div class=\"select-control-search\">\n      <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n    </div>\n  </ng-template>\n</div>\n<span class=\"select-control-arrow\">\n  <thy-icon thyIconName=\"angle-down\" class=\"font-size-base\"></thy-icon>\n</span>\n<span class=\"select-control-clear remove-link\" *ngIf=\"showClearIcon\" (click)=\"clearHandle($event)\">\n  <thy-icon class=\"remove-link-icon font-size-base\" thyIconName=\"close-circle-bold-fill\"></thy-icon>\n</span>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.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: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThySelectControl.prototype, "thyPanelOpened", null);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThySelectControl.prototype, "thyIsMultiple", null);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThySelectControl.prototype, "thyShowSearch", null);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThySelectControl.prototype, "thyDisabled", null);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Object)
-], ThySelectControl.prototype, "thyAllowClear", void 0);
-__decorate([
-    InputNumber(),
-    __metadata("design:type", Object)
-], ThySelectControl.prototype, "thyMaxTagCount", void 0);
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Object)
-], ThySelectControl.prototype, "thyBorderless", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThySelectControl, decorators: [{
             type: Component,
             args: [{ selector: 'thy-select-control,[thySelectControl]', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FormsModule, NgClass, NgIf, NgStyle, NgFor, ThyTag, NgTemplateOutlet, ThyIcon, ThyGridModule], host: {
                         '[class.select-control-borderless]': 'thyBorderless'
                     }, template: "<ng-template #inputTemplate>\n  <input\n    #inputElement\n    [tabindex]=\"-1\"\n    (compositionstart)=\"isComposing = true\"\n    (compositionend)=\"isComposing = 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  <div class=\"text-placeholder text-truncate\" *ngIf=\"!isSelectedValue\" [ngStyle]=\"placeholderStyle\">\n    {{ thyPlaceholder }}\n  </div>\n  <ng-container *ngIf=\"isMultiple; else single\">\n    <div thyFlex thyWrap=\"wrap\" thyGap=\"4\" thyAlignItems=\"center\" class=\"w-100\">\n      <ng-container *ngIf=\"thyPreset === 'tag'; else default\">\n        <div thyFlexItem class=\"custom-choice-item text-truncate\" *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <ng-template\n            [ngTemplateOutlet]=\"customDisplayTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\">\n          </ng-template>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-container>\n\n      <ng-template #default>\n        <div\n          thyFlexItem\n          thyTag\n          class=\"choice-item\"\n          [ngClass]=\"{ disabled: disabled === true }\"\n          [thySize]=\"tagSize\"\n          *ngFor=\"let item of maxSelectedTags; trackBy: trackValue\">\n          <div class=\"text-truncate h-100\">\n            <ng-template\n              #customDisplay\n              [ngTemplateOutlet]=\"customDisplayTemplate\"\n              [ngTemplateOutletContext]=\"{ $implicit: item.thyRawValue || item.thyValue || item }\"></ng-template>\n            <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n              {{ item.thyLabelText }}\n            </ng-container>\n          </div>\n          <div *ngIf=\"!disabled\" 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        </div>\n      </ng-template>\n\n      <div\n        thyFlexItem\n        class=\"choice-item max-tag-count-choice\"\n        *ngIf=\"thyMaxTagCount && multipleSelectedValue.length > thyMaxTagCount\"\n        thyTag\n        [thySize]=\"tagSize\"\n        [ngClass]=\"{ disabled: disabled === true }\">\n        <div class=\"text-truncate\">+{{ multipleSelectedValue.length - thyMaxTagCount + 1 }}...</div>\n      </div>\n      <div thyFlexItem class=\"select-control-search\">\n        <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n      </div>\n    </div>\n  </ng-container>\n  <ng-template #single>\n    <ng-container *ngIf=\"isSelectedValue\">\n      <div class=\"selected-value text-truncate\" [ngStyle]=\"selectedValueStyle\">\n        <ng-template\n          #customDisplay\n          [ngTemplateOutlet]=\"customDisplayTemplate\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedValue.thyRawValue || selectedValue.thyValue || selectedValue\n          }\"></ng-template>\n        <ng-container *ngIf=\"!customDisplayTemplate; else customDisplay\">\n          <span class=\"text-truncate\">{{ selectedValue?.thyLabelText }}</span>\n        </ng-container>\n      </div>\n    </ng-container>\n    <div class=\"select-control-search\">\n      <ng-template [ngTemplateOutlet]=\"inputTemplate\"></ng-template>\n    </div>\n  </ng-template>\n</div>\n<span class=\"select-control-arrow\">\n  <thy-icon thyIconName=\"angle-down\" class=\"font-size-base\"></thy-icon>\n</span>\n<span class=\"select-control-clear remove-link\" *ngIf=\"showClearIcon\" (click)=\"clearHandle($event)\">\n  <thy-icon class=\"remove-link-icon font-size-base\" thyIconName=\"close-circle-bold-fill\"></thy-icon>\n</span>\n" }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { thyPanelOpened: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyIsMultiple: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyShowSearch: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thySelectedOptions: [{
                 type: Input
             }], thyDisabled: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], customDisplayTemplate: [{
                 type: Input
             }], thyAllowClear: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyPlaceholder: [{
                 type: Input
             }], thySize: [{
                 type: Input
             }], thyMaxTagCount: [{
-                type: Input
+                type: Input,
+                args: [{ transform: numberAttribute }]
             }], thyBorderless: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], thyPreset: [{
                 type: Input
             }], thyOnSearch: [{
@@ -1118,7 +1073,7 @@ class ThyListOption {
         return this.parentSelectionList.layout === 'grid';
     }
     set thyDisabled(value) {
-        this.disabled = coerceBooleanProperty(value);
+        this.disabled = value;
     }
     /** Whether the option is selected. */
     get selected() {
@@ -1163,13 +1118,8 @@ class ThyListOption {
         return '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyListOption, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: THY_LIST_OPTION_PARENT_COMPONENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ThyListOption, isStandalone: true, selector: "thy-list-option,[thy-list-option]", inputs: { id: "id", thyValue: "thyValue", thyDisabled: "thyDisabled" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.thy-list-option": "this._isListOption", "class.thy-grid-option": "this._parentLayout", "attr.role": "this._role", "attr.tabindex": "this._tabIndex", "class.disabled": "this.disabled", "class.active": "this.selected" } }, ngImport: i0, template: "<ng-content></ng-content>\n<span class=\"checked-icon\" *ngIf=\"parentSelectionList.multiple && parentSelectionList.layout === 'list'\">\n  <thy-icon thyIconName=\"check\"></thy-icon>\n</span>\n<span *ngIf=\"parentSelectionList.layout === 'grid'\" class=\"checked-icon\">\n  <thy-icon thyIconName=\"check-circle-fill\"></thy-icon>\n</span>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.3", type: ThyListOption, isStandalone: true, selector: "thy-list-option,[thy-list-option]", inputs: { id: "id", thyValue: "thyValue", thyDisabled: ["thyDisabled", "thyDisabled", booleanAttribute] }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.thy-list-option": "this._isListOption", "class.thy-grid-option": "this._parentLayout", "attr.role": "this._role", "attr.tabindex": "this._tabIndex", "class.disabled": "this.disabled", "class.active": "this.selected" } }, ngImport: i0, template: "<ng-content></ng-content>\n<span class=\"checked-icon\" *ngIf=\"parentSelectionList.multiple && parentSelectionList.layout === 'list'\">\n  <thy-icon thyIconName=\"check\"></thy-icon>\n</span>\n<span *ngIf=\"parentSelectionList.layout === 'grid'\" class=\"checked-icon\">\n  <thy-icon thyIconName=\"check-circle-fill\"></thy-icon>\n</span>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }] }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyListOption.prototype, "thyDisabled", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyListOption, decorators: [{
             type: Component,
             args: [{ selector: 'thy-list-option,[thy-list-option]', standalone: true, imports: [NgIf, ThyIcon], template: "<ng-content></ng-content>\n<span class=\"checked-icon\" *ngIf=\"parentSelectionList.multiple && parentSelectionList.layout === 'list'\">\n  <thy-icon thyIconName=\"check\"></thy-icon>\n</span>\n<span *ngIf=\"parentSelectionList.layout === 'grid'\" class=\"checked-icon\">\n  <thy-icon thyIconName=\"check-circle-fill\"></thy-icon>\n</span>\n" }]
@@ -1195,7 +1145,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
             }], thyValue: [{
                 type: Input
             }], thyDisabled: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], disabled: [{
                 type: HostBinding,
                 args: [`class.disabled`]
@@ -1359,13 +1310,8 @@ class ThyOption extends SelectOptionBase {
     }
     ngOnDestroy() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyOption, deps: [{ token: i0.ElementRef }, { token: THY_OPTION_PARENT_COMPONENT, optional: true }, { token: THY_OPTION_GROUP_COMPONENT, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ThyOption, isStandalone: true, selector: "thy-option", inputs: { thyValue: "thyValue", thyRawValue: "thyRawValue", thyLabelText: "thyLabelText", thyShowOptionCustom: "thyShowOptionCustom", thySearchKey: "thySearchKey", thyDisabled: "thyDisabled" }, outputs: { selectionChange: "selectionChange", visibleChange: "visibleChange" }, host: { listeners: { "click": "onClick($event)", "keydown": "handleKeydown($event)" }, properties: { "class.thy-option-item": "this._isOptionItem", "class.disabled": "this.thyDisabled", "class.hidden": "this.hidden", "attr.tabindex": "this.tabIndex", "class.active": "this.selected" } }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"thyShowOptionCustom; else defaultOption\">\n  <ng-content></ng-content>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-container>\n<ng-template #defaultOption>\n  <span class=\"text-truncate\">{{ thyLabelText }}</span>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.3", type: ThyOption, isStandalone: true, selector: "thy-option", inputs: { thyValue: "thyValue", thyRawValue: "thyRawValue", thyLabelText: "thyLabelText", thyShowOptionCustom: "thyShowOptionCustom", thySearchKey: "thySearchKey", thyDisabled: ["thyDisabled", "thyDisabled", booleanAttribute] }, outputs: { selectionChange: "selectionChange", visibleChange: "visibleChange" }, host: { listeners: { "click": "onClick($event)", "keydown": "handleKeydown($event)" }, properties: { "class.thy-option-item": "this._isOptionItem", "class.disabled": "this.thyDisabled", "class.hidden": "this.hidden", "attr.tabindex": "this.tabIndex", "class.active": "this.selected" } }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"thyShowOptionCustom; else defaultOption\">\n  <ng-content></ng-content>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-container>\n<ng-template #defaultOption>\n  <span class=\"text-truncate\">{{ thyLabelText }}</span>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [Boolean])
-], ThyOption.prototype, "thyDisabled", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThyOption, decorators: [{
             type: Component,
             args: [{ selector: 'thy-option', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, ThyIcon], template: "<ng-container *ngIf=\"thyShowOptionCustom; else defaultOption\">\n  <ng-content></ng-content>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-container>\n<ng-template #defaultOption>\n  <span class=\"text-truncate\">{{ thyLabelText }}</span>\n  <thy-icon class=\"checked-icon\" thyIconName=\"check\"></thy-icon>\n</ng-template>\n" }]
@@ -1396,7 +1342,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                 type: ViewChild,
                 args: [TemplateRef, { static: true }]
             }], thyDisabled: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }, {
                 type: HostBinding,
                 args: [`class.disabled`]
@@ -1472,17 +1419,13 @@ class ThySelectOptionGroup {
         this._destroy$.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThySelectOptionGroup, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ThySelectOptionGroup, isStandalone: true, selector: "thy-option-group", inputs: { thyDisabled: "thyDisabled", thyGroupLabel: "thyGroupLabel" }, host: { properties: { "class.disabled": "this.thyDisabled", "class.thy-option-item-group": "this._isOptionGroup", "class.thy-select-option-group-hidden": "this.hidden" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.3", type: ThySelectOptionGroup, isStandalone: true, selector: "thy-option-group", inputs: { thyDisabled: ["thyDisabled", "thyDisabled", booleanAttribute], thyGroupLabel: "thyGroupLabel" }, host: { properties: { "class.disabled": "this.thyDisabled", "class.thy-option-item-group": "this._isOptionGroup", "class.thy-select-option-group-hidden": "this.hidden" } }, providers: [
             {
                 provide: THY_OPTION_GROUP_COMPONENT,
                 useExisting: ThySelectOptionGroup
             }
         ], queries: [{ propertyName: "options", predicate: ThyOption }], ngImport: i0, template: "<span class=\"group-name text-truncate\">{{ thyGroupLabel }}</span>\n<ng-content></ng-content>\n" }); }
 }
-__decorate([
-    InputBoolean(),
-    __metadata("design:type", Boolean)
-], ThySelectOptionGroup.prototype, "thyDisabled", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ThySelectOptionGroup, decorators: [{
             type: Component,
             args: [{ selector: 'thy-option-group', providers: [
@@ -1492,7 +1435,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                         }
                     ], standalone: true, template: "<span class=\"group-name text-truncate\">{{ thyGroupLabel }}</span>\n<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }], propDecorators: { thyDisabled: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }, {
                 type: HostBinding,
                 args: [`class.disabled`]