ngx-tethys 19.0.16 → 19.1.0-next.1

package/fesm2022/ngx-tethys-card.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { ContentChild, Input, ChangeDetectionStrategy, Component, HostBinding, NgModule } from '@angular/core';
+import { input, contentChild, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import { NgTemplateOutlet, CommonModule } from '@angular/common';
 import { coerceBooleanProperty } from 'ngx-tethys/util';
 
@@ -9,38 +9,49 @@ import { coerceBooleanProperty } from 'ngx-tethys/util';
  * @order 20
  */
 class ThyCardHeader {
-    constructor() { }
+    constructor() {
+        /**
+         * 头部，标题
+         */
+        this.thyTitle = input();
+        /**
+         * 头部，附加信息
+         */
+        this.thyDescription = input();
+        /**
+         * 已废弃，头部大小
+         * @deprecated
+         */
+        this.thySize = input('md');
+        /**
+         * 自定义头部标题
+         * @type TemplateRef
+         */
+        this.titleTemplateRef = contentChild('headerTitle');
+        /**
+         * 自定义头部描述
+         * @type TemplateRef
+         */
+        this.descriptionTemplateRef = contentChild('headerDescription');
+        /**
+         * 自定义头部操作区域
+         * @type TemplateRef
+         */
+        this.operationTemplateRef = contentChild('headerOperation');
+    }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyCardHeader, isStandalone: true, selector: "thy-card-header", inputs: { thyTitle: "thyTitle", thyDescription: "thyDescription", thySize: "thySize" }, host: { properties: { "class.thy-card-header--sm": "thySize === \"sm\"", "class.thy-card-header--lg": "thySize === \"lg\"", "class.thy-card-header--md": "thySize === \"md\"" }, classAttribute: "thy-card-header" }, queries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["headerTitle"], descendants: true }, { propertyName: "descriptionTemplateRef", first: true, predicate: ["headerDescription"], descendants: true }, { propertyName: "operationTemplateRef", first: true, predicate: ["headerOperation"], descendants: true }], ngImport: i0, template: "<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef\"></ng-template>\n  @if (!titleTemplateRef) {\n    <span>{{ thyTitle }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef\"></ng-template>\n  @if (!descriptionTemplateRef) {\n    <span>{{ thyDescription }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef\"></ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyCardHeader, isStandalone: true, selector: "thy-card-header", inputs: { thyTitle: { classPropertyName: "thyTitle", publicName: "thyTitle", isSignal: true, isRequired: false, transformFunction: null }, thyDescription: { classPropertyName: "thyDescription", publicName: "thyDescription", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.thy-card-header--sm": "thySize() === \"sm\"", "class.thy-card-header--lg": "thySize() === \"lg\"", "class.thy-card-header--md": "thySize() === \"md\"" }, classAttribute: "thy-card-header" }, queries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["headerTitle"], descendants: true, isSignal: true }, { propertyName: "descriptionTemplateRef", first: true, predicate: ["headerDescription"], descendants: true, isSignal: true }, { propertyName: "operationTemplateRef", first: true, predicate: ["headerOperation"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef()\"></ng-template>\n  @if (!titleTemplateRef()) {\n    <span>{{ thyTitle() }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef()\"></ng-template>\n  @if (!descriptionTemplateRef()) {\n    <span>{{ thyDescription() }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef()\"></ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCardHeader, decorators: [{
             type: Component,
             args: [{ selector: 'thy-card-header', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'thy-card-header',
-                        '[class.thy-card-header--sm]': 'thySize === "sm"',
-                        '[class.thy-card-header--lg]': 'thySize === "lg"',
-                        '[class.thy-card-header--md]': 'thySize === "md"'
-                    }, imports: [NgTemplateOutlet], template: "<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef\"></ng-template>\n  @if (!titleTemplateRef) {\n    <span>{{ thyTitle }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef\"></ng-template>\n  @if (!descriptionTemplateRef) {\n    <span>{{ thyDescription }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef\"></ng-template>\n</div>\n" }]
-        }], ctorParameters: () => [], propDecorators: { thyTitle: [{
-                type: Input,
-                args: ['thyTitle']
-            }], thyDescription: [{
-                type: Input,
-                args: ['thyDescription']
-            }], thySize: [{
-                type: Input,
-                args: ['thySize']
-            }], titleTemplateRef: [{
-                type: ContentChild,
-                args: ['headerTitle']
-            }], descriptionTemplateRef: [{
-                type: ContentChild,
-                args: ['headerDescription']
-            }], operationTemplateRef: [{
-                type: ContentChild,
-                args: ['headerOperation']
-            }] } });
+                        '[class.thy-card-header--sm]': 'thySize() === "sm"',
+                        '[class.thy-card-header--lg]': 'thySize() === "lg"',
+                        '[class.thy-card-header--md]': 'thySize() === "md"'
+                    }, imports: [NgTemplateOutlet], template: "<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef()\"></ng-template>\n  @if (!titleTemplateRef()) {\n    <span>{{ thyTitle() }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef()\"></ng-template>\n  @if (!descriptionTemplateRef()) {\n    <span>{{ thyDescription() }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef()\"></ng-template>\n</div>\n" }]
+        }], ctorParameters: () => [] });
 
 /**
  * 卡片组件
@@ -53,10 +64,23 @@ class ThyCard {
          * 左右是否有内边距，已废弃，如需配置间距使用 spacing 工具样式覆盖默认间距
          * @deprecated
          */
-        this.thyHasLeftRightPadding = true;
+        this.thyHasLeftRightPadding = input(true, { transform: coerceBooleanProperty });
+        /**
+         * 是否是分割模式，分割模式头部和内容区之间有一条分割线
+         */
+        this.thyDivided = input(false, { transform: coerceBooleanProperty });
+        /**
+         * 是否有边框，边框颜色为#eee
+         */
+        this.thyBordered = input(false, { transform: coerceBooleanProperty });
+        /**
+         * 大小
+         * @type sm | md | lg
+         */
+        this.thySize = input('md');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.8", type: ThyCard, isStandalone: true, selector: "thy-card", inputs: { thyHasLeftRightPadding: ["thyHasLeftRightPadding", "thyHasLeftRightPadding", coerceBooleanProperty], thyDivided: ["thyDivided", "thyDivided", coerceBooleanProperty], thyBordered: ["thyBordered", "thyBordered", coerceBooleanProperty], thySize: "thySize" }, host: { properties: { "class.thy-card--divided": "!!thyDivided", "class.thy-card--bordered": "!!thyBordered", "class.thy-card--clear-left-right-padding": "!thyHasLeftRightPadding", "class.thy-card-sm": "thySize === \"sm\"", "class.thy-card-lg": "thySize === \"lg\"" }, classAttribute: "thy-card" }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.8", type: ThyCard, isStandalone: true, selector: "thy-card", inputs: { thyHasLeftRightPadding: { classPropertyName: "thyHasLeftRightPadding", publicName: "thyHasLeftRightPadding", isSignal: true, isRequired: false, transformFunction: null }, thyDivided: { classPropertyName: "thyDivided", publicName: "thyDivided", isSignal: true, isRequired: false, transformFunction: null }, thyBordered: { classPropertyName: "thyBordered", publicName: "thyBordered", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.thy-card--divided": "!!thyDivided()", "class.thy-card--bordered": "!!thyBordered()", "class.thy-card--clear-left-right-padding": "!thyHasLeftRightPadding()", "class.thy-card-sm": "thySize() === \"sm\"", "class.thy-card-lg": "thySize() === \"lg\"" }, classAttribute: "thy-card" }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCard, decorators: [{
             type: Component,
@@ -66,25 +90,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: {
                         class: 'thy-card',
-                        '[class.thy-card--divided]': '!!thyDivided',
-                        '[class.thy-card--bordered]': '!!thyBordered',
-                        '[class.thy-card--clear-left-right-padding]': '!thyHasLeftRightPadding',
-                        '[class.thy-card-sm]': 'thySize === "sm"',
-                        '[class.thy-card-lg]': 'thySize === "lg"'
+                        '[class.thy-card--divided]': '!!thyDivided()',
+                        '[class.thy-card--bordered]': '!!thyBordered()',
+                        '[class.thy-card--clear-left-right-padding]': '!thyHasLeftRightPadding()',
+                        '[class.thy-card-sm]': 'thySize() === "sm"',
+                        '[class.thy-card-lg]': 'thySize() === "lg"'
                     }
                 }]
-        }], propDecorators: { thyHasLeftRightPadding: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyDivided: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyBordered: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thySize: [{
-                type: Input
-            }] } });
+        }] });
 
 /**
  * 卡片内容组件
@@ -93,27 +106,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
  */
 class ThyCardContent {
     constructor() {
-        this.scrollClassName = false;
-        this._thySizeSm = false;
-    }
-    /**
-     * 内容区，滚动
-     * @default false
-     */
-    set thyScroll(value) {
-        this.scrollClassName = value;
-    }
-    /**
-     * 已废弃，Content 大小，sm 时 padding-top 间距变小
-     * @deprecated
-     * @default md
-     */
-    set thySize(value) {
-        this._thySizeSm = value === 'sm';
+        /**
+         * 内容区，滚动
+         */
+        this.thyScroll = input(false, { transform: coerceBooleanProperty });
+        /**
+         * 已废弃，Content 大小，sm 时 padding-top 间距变小
+         * @deprecated
+         */
+        this.thySize = input('md');
     }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCardContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.8", type: ThyCardContent, isStandalone: true, selector: "thy-card-content", inputs: { thyScroll: ["thyScroll", "thyScroll", coerceBooleanProperty], thySize: "thySize" }, host: { properties: { "class.thy-card-content--scroll": "this.scrollClassName", "class.thy-card-content--sm": "this._thySizeSm" }, classAttribute: "thy-card-content" }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.8", type: ThyCardContent, isStandalone: true, selector: "thy-card-content", inputs: { thyScroll: { classPropertyName: "thyScroll", publicName: "thyScroll", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.thy-card-content--scroll": "!!thyScroll()", "class.thy-card-content--sm": "thySize() === \"sm\"" }, classAttribute: "thy-card-content" }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCardContent, decorators: [{
             type: Component,
@@ -123,22 +128,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
                     template: ` <ng-content></ng-content> `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: {
-                        class: 'thy-card-content'
+                        class: 'thy-card-content',
+                        '[class.thy-card-content--scroll]': '!!thyScroll()',
+                        '[class.thy-card-content--sm]': 'thySize() === "sm"'
                     }
                 }]
-        }], propDecorators: { scrollClassName: [{
-                type: HostBinding,
-                args: ['class.thy-card-content--scroll']
-            }], thyScroll: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], _thySizeSm: [{
-                type: HostBinding,
-                args: ['class.thy-card-content--sm']
-            }], thySize: [{
-                type: Input,
-                args: ['thySize']
-            }] } });
+        }] });
 
 class ThyCardModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }

package/fesm2022/ngx-tethys-card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngx-tethys-card.mjs","sources":["../../../src/card/header.component.ts","../../../src/card/header.component.html","../../../src/card/card.component.ts","../../../src/card/content.component.ts","../../../src/card/card.module.ts","../../../src/card/ngx-tethys-card.ts"],"sourcesContent":["import { Component, Input, OnInit, TemplateRef, ContentChild, ChangeDetectionStrategy } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\n/**\n * 卡片头部组件\n * @name thy-card-header\n * @order 20\n */\n@Component({\n    selector: 'thy-card-header',\n    preserveWhitespaces: false,\n    templateUrl: './header.component.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card-header',\n        '[class.thy-card-header--sm]': 'thySize === \"sm\"',\n        '[class.thy-card-header--lg]': 'thySize === \"lg\"',\n        '[class.thy-card-header--md]': 'thySize === \"md\"'\n    },\n    imports: [NgTemplateOutlet]\n})\nexport class ThyCardHeader implements OnInit {\n    public iconClass: string;\n\n    /**\n     * 头部，标题\n     */\n    @Input('thyTitle') thyTitle: string;\n\n    /**\n     * 头部，附加信息\n     */\n    @Input('thyDescription') thyDescription: string;\n\n    /**\n     * 已废弃，头部大小\n     * @deprecated\n     * @default md\n     */\n    @Input('thySize') thySize: 'sm' | 'lg' | 'md' | '';\n\n    /**\n     * 自定义头部标题\n     * @type TemplateRef\n     */\n    @ContentChild('headerTitle')\n    public titleTemplateRef: TemplateRef<any>;\n\n    /**\n     * 自定义头部描述\n     * @type TemplateRef\n     */\n    @ContentChild('headerDescription')\n    public descriptionTemplateRef: TemplateRef<any>;\n\n    /**\n     * 自定义头部操作区域\n     * @type TemplateRef\n     */\n    @ContentChild('headerOperation')\n    public operationTemplateRef: TemplateRef<any>;\n\n    constructor() {}\n\n    ngOnInit() {}\n}\n","<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef\"></ng-template>\n  @if (!titleTemplateRef) {\n    <span>{{ thyTitle }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef\"></ng-template>\n  @if (!descriptionTemplateRef) {\n    <span>{{ thyDescription }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef\"></ng-template>\n</div>\n","import { Component, Input, ChangeDetectionStrategy } from '@angular/core';\nimport { coerceBooleanProperty } from 'ngx-tethys/util';\n\n/**\n * 卡片组件\n * @name thy-card\n * @order 10\n */\n@Component({\n    selector: 'thy-card',\n    template: ` <ng-content></ng-content> `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card',\n        '[class.thy-card--divided]': '!!thyDivided',\n        '[class.thy-card--bordered]': '!!thyBordered',\n        '[class.thy-card--clear-left-right-padding]': '!thyHasLeftRightPadding',\n        '[class.thy-card-sm]': 'thySize === \"sm\"',\n        '[class.thy-card-lg]': 'thySize === \"lg\"'\n    }\n})\nexport class ThyCard {\n    /**\n     * 左右是否有内边距，已废弃，如需配置间距使用 spacing 工具样式覆盖默认间距\n     * @deprecated\n     */\n    @Input({ transform: coerceBooleanProperty })\n    thyHasLeftRightPadding: boolean | string = true;\n\n    /**\n     * 是否是分割模式，分割模式头部和内容区之间有一条分割线\n     * @default false\n     */\n    @Input({ transform: coerceBooleanProperty })\n    thyDivided: boolean | string;\n\n    /**\n     * 是否有边框，边框颜色为#eee\n     * @default false\n     */\n    @Input({ transform: coerceBooleanProperty })\n    thyBordered: boolean | string;\n\n    /**\n     * 大小\n     * @type sm | md | lg\n     * @default md\n     */\n    @Input()\n    thySize: 'md' | 'sm' | 'lg';\n}\n","import { ChangeDetectionStrategy, Component, HostBinding, Input, OnInit } from '@angular/core';\nimport { coerceBooleanProperty } from 'ngx-tethys/util';\n\n/**\n * 卡片内容组件\n * @name thy-card-content\n * @order 30\n */\n@Component({\n    selector: 'thy-card-content',\n    preserveWhitespaces: false,\n    template: ` <ng-content></ng-content> `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card-content'\n    }\n})\nexport class ThyCardContent implements OnInit {\n    @HostBinding('class.thy-card-content--scroll') scrollClassName = false;\n\n    /**\n     * 内容区，滚动\n     * @default false\n     */\n    @Input({ transform: coerceBooleanProperty })\n    set thyScroll(value: boolean) {\n        this.scrollClassName = value;\n    }\n\n    @HostBinding('class.thy-card-content--sm') _thySizeSm = false;\n\n    /**\n     * 已废弃，Content 大小，sm 时 padding-top 间距变小\n     * @deprecated\n     * @default md\n     */\n    @Input('thySize')\n    set thySize(value: string) {\n        this._thySizeSm = value === 'sm';\n    }\n\n    ngOnInit() {}\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyCard } from './card.component';\nimport { ThyCardHeader } from './header.component';\nimport { ThyCardContent } from './content.component';\n\n@NgModule({\n    imports: [CommonModule, ThyCard, ThyCardHeader, ThyCardContent],\n    exports: [ThyCard, ThyCardHeader, ThyCardContent]\n})\nexport class ThyCardModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngx-tethys-card.mjs","sources":["../../../src/card/header.component.ts","../../../src/card/header.component.html","../../../src/card/card.component.ts","../../../src/card/content.component.ts","../../../src/card/card.module.ts","../../../src/card/ngx-tethys-card.ts"],"sourcesContent":["import { Component, OnInit, TemplateRef, ChangeDetectionStrategy, input, contentChild } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\n/**\n * 卡片头部组件\n * @name thy-card-header\n * @order 20\n */\n@Component({\n    selector: 'thy-card-header',\n    preserveWhitespaces: false,\n    templateUrl: './header.component.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card-header',\n        '[class.thy-card-header--sm]': 'thySize() === \"sm\"',\n        '[class.thy-card-header--lg]': 'thySize() === \"lg\"',\n        '[class.thy-card-header--md]': 'thySize() === \"md\"'\n    },\n    imports: [NgTemplateOutlet]\n})\nexport class ThyCardHeader implements OnInit {\n    public iconClass: string;\n\n    /**\n     * 头部，标题\n     */\n    readonly thyTitle = input<string>();\n\n    /**\n     * 头部，附加信息\n     */\n    readonly thyDescription = input<string>();\n\n    /**\n     * 已废弃，头部大小\n     * @deprecated\n     */\n    readonly thySize = input<'sm' | 'lg' | 'md' | ''>('md');\n\n    /**\n     * 自定义头部标题\n     * @type TemplateRef\n     */\n    public readonly titleTemplateRef = contentChild<TemplateRef<any>>('headerTitle');\n\n    /**\n     * 自定义头部描述\n     * @type TemplateRef\n     */\n    public readonly descriptionTemplateRef = contentChild<TemplateRef<any>>('headerDescription');\n\n    /**\n     * 自定义头部操作区域\n     * @type TemplateRef\n     */\n    public readonly operationTemplateRef = contentChild<TemplateRef<any>>('headerOperation');\n\n    constructor() {}\n\n    ngOnInit() {}\n}\n","<div class=\"card-header-title\">\n  <ng-template [ngTemplateOutlet]=\"titleTemplateRef()\"></ng-template>\n  @if (!titleTemplateRef()) {\n    <span>{{ thyTitle() }}</span>\n  }\n</div>\n<div class=\"card-header-description\">\n  <ng-template [ngTemplateOutlet]=\"descriptionTemplateRef()\"></ng-template>\n  @if (!descriptionTemplateRef()) {\n    <span>{{ thyDescription() }}</span>\n  }\n</div>\n<div class=\"card-header-operation\">\n  <ng-template [ngTemplateOutlet]=\"operationTemplateRef()\"></ng-template>\n</div>\n","import { Component, ChangeDetectionStrategy, input } from '@angular/core';\nimport { coerceBooleanProperty } from 'ngx-tethys/util';\n\n/**\n * 卡片组件\n * @name thy-card\n * @order 10\n */\n@Component({\n    selector: 'thy-card',\n    template: ` <ng-content></ng-content> `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card',\n        '[class.thy-card--divided]': '!!thyDivided()',\n        '[class.thy-card--bordered]': '!!thyBordered()',\n        '[class.thy-card--clear-left-right-padding]': '!thyHasLeftRightPadding()',\n        '[class.thy-card-sm]': 'thySize() === \"sm\"',\n        '[class.thy-card-lg]': 'thySize() === \"lg\"'\n    }\n})\nexport class ThyCard {\n    /**\n     * 左右是否有内边距，已废弃，如需配置间距使用 spacing 工具样式覆盖默认间距\n     * @deprecated\n     */\n    readonly thyHasLeftRightPadding = input(true, { transform: coerceBooleanProperty });\n\n    /**\n     * 是否是分割模式，分割模式头部和内容区之间有一条分割线\n     */\n    readonly thyDivided = input(false, { transform: coerceBooleanProperty });\n\n    /**\n     * 是否有边框，边框颜色为#eee\n     */\n    readonly thyBordered = input(false, { transform: coerceBooleanProperty });\n\n    /**\n     * 大小\n     * @type sm | md | lg\n     */\n    readonly thySize = input<'md' | 'sm' | 'lg'>('md');\n}\n","import { ChangeDetectionStrategy, Component, input, OnInit } from '@angular/core';\nimport { coerceBooleanProperty } from 'ngx-tethys/util';\n\n/**\n * 卡片内容组件\n * @name thy-card-content\n * @order 30\n */\n@Component({\n    selector: 'thy-card-content',\n    preserveWhitespaces: false,\n    template: ` <ng-content></ng-content> `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'thy-card-content',\n        '[class.thy-card-content--scroll]': '!!thyScroll()',\n        '[class.thy-card-content--sm]': 'thySize() === \"sm\"'\n    }\n})\nexport class ThyCardContent implements OnInit {\n    /**\n     * 内容区，滚动\n     */\n    readonly thyScroll = input(false, { transform: coerceBooleanProperty });\n\n    /**\n     * 已废弃，Content 大小，sm 时 padding-top 间距变小\n     * @deprecated\n     */\n    readonly thySize = input<string>('md');\n\n    ngOnInit() {}\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyCard } from './card.component';\nimport { ThyCardHeader } from './header.component';\nimport { ThyCardContent } from './content.component';\n\n@NgModule({\n    imports: [CommonModule, ThyCard, ThyCardHeader, ThyCardContent],\n    exports: [ThyCard, ThyCardHeader, ThyCardContent]\n})\nexport class ThyCardModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngx-tethys-carousel.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { inject, Renderer2, ElementRef, Directive, NgZone, Injectable, InjectionToken, ChangeDetectorRef, EventEmitter, numberAttribute, Output, Input, ViewChild, ContentChildren, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { inject, Renderer2, ElementRef, Directive, NgZone, Injectable, InjectionToken, ChangeDetectorRef, viewChild, input, numberAttribute, output, computed, effect, ContentChildren, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import { DOCUMENT, NgTemplateOutlet, CommonModule } from '@angular/common';
 import { Platform } from '@angular/cdk/platform';
 import { ThyDot, ThyDotModule } from 'ngx-tethys/dot';
 import { ThyIcon, ThyIconModule } from 'ngx-tethys/icon';
-import { TinyDate, isNumber, coerceBooleanProperty } from 'ngx-tethys/util';
+import { coerceBooleanProperty, TinyDate, isNumber } from 'ngx-tethys/util';
 import { Subject, fromEvent } from 'rxjs';
 import { map, takeUntil, debounceTime } from 'rxjs/operators';
 
@@ -298,67 +298,115 @@ class ThyCarousel {
         this.carouselService = inject(ThyCarouselService);
         this.platform = inject(Platform);
         /**
-         * 是否自动切换，默认 false
+         * @private
          */
-        this.thyAutoPlay = false;
+        this.carouselWrapper = viewChild('carouselWrapper');
+        /**
+         * 是否自动切换
+         */
+        this.thyAutoPlay = input(false, { transform: coerceBooleanProperty });
         /**
          * 自动切换时间间隔(毫秒)
          */
-        this.thyAutoPlayInterval = 3000;
+        this.thyAutoPlayInterval = input(3000, { transform: numberAttribute });
         /**
          * 切换动画样式
          * @type slide | fade | noop
          */
-        this.thyEffect = 'slide';
+        this.thyEffect = input('slide');
         /**
          * 是否显示切换指示器
          */
-        this.thyIndicators = true;
+        this.thyIndicators = input(true, { transform: coerceBooleanProperty });
+        /**
+         * 指示器 Item 的渲染模板
+         */
+        this.thyIndicatorRender = input();
         /**
          * 是否显示左右切换
          */
-        this.thyControls = true;
+        this.thyControls = input(true, { transform: coerceBooleanProperty });
+        /**
+         * 上一个控制器渲染模板
+         */
+        this.thyControlPrev = input();
+        /**
+         * 下一个控制器渲染模板
+         */
+        this.thyControlNext = input();
         /**
          * 是否支持手势滑动
          */
-        this.thyTouchable = true;
+        this.thyTouchable = input(true, { transform: coerceBooleanProperty });
         /**
          * 指示点切换的触发条件
          * @type click | hover
          */
-        this.thyTrigger = 'click';
+        this.thyTrigger = input('click');
         /**
          * 鼠标移动到指示器时是否暂停播放
          * @type false | hover
          */
-        this.thyPause = 'hover';
+        this.thyPause = input('hover');
         /**
          * 触发切换帧之前，返回 `{from: number, to: number}`
          */
-        this.thyBeforeChange = new EventEmitter();
+        this.thyBeforeChange = output();
         /**
          * 切换帧之后的回调，返回当前帧索引
          */
-        this.thyAfterChange = new EventEmitter();
+        this.thyAfterChange = output();
         this.isDragging = false;
         this.isTransitioning = false;
         this.pointerVector = { x: 0, y: 0 };
+        this.engine = computed(() => {
+            switch (this.thyEffect()) {
+                case 'slide':
+                    return new ThyCarouselSlideEngine(this, this.cdr, this.renderer, this.platform);
+                case 'fade':
+                    return new ThyCarouselFadeEngine(this, this.cdr, this.renderer, this.platform);
+                default:
+                    return new ThyCarouselNoopEngine(this, this.cdr, this.renderer, this.platform);
+            }
+        });
         this._trigger$ = new Subject();
         this._destroy$ = new Subject();
         this.activeIndex = 0;
         this.transitionTimer = null;
         this.playTime = 400;
         this.isPause = false;
+        effect(() => {
+            if (this.thyEffect()) {
+                this.markContentActive(0);
+                this.setInitialValue();
+            }
+        });
+        effect(() => {
+            if (this.thyTouchable()) {
+                this.renderer.setStyle(this.wrapperEl, 'cursor', this.thyTouchable() ? 'grab' : 'default');
+            }
+        });
+        effect(() => {
+            if (!this.thyAutoPlay() || !this.thyAutoPlayInterval()) {
+                this.clearScheduledTransition();
+            }
+            else {
+                this.scheduleNextTransition();
+            }
+        });
     }
     moveTo(index) {
-        if (this.carouselItems && this.carouselItems.length && !this.isTransitioning) {
+        const carouselItems = this.carouselItems;
+        if (carouselItems && carouselItems.length && !this.isTransitioning) {
             this.setInitialValue();
-            const len = this.carouselItems.length;
+            const len = carouselItems.length;
             const from = this.activeIndex;
             const to = (index + len) % len;
             this.thyBeforeChange.emit({ from, to });
             this.isTransitioning = true;
-            this.engine?.switch(index, this.activeIndex).subscribe(() => {
+            this.engine()
+                ?.switch(index, this.activeIndex)
+                .subscribe(() => {
                 this.activeIndex = to;
                 this.markContentActive(this.activeIndex);
                 this.scheduleNextTransition();
@@ -369,36 +417,24 @@ class ThyCarousel {
             this.cdr.markForCheck();
         }
     }
-    switchEngine() {
-        switch (this.thyEffect) {
-            case 'slide':
-                this.engine = new ThyCarouselSlideEngine(this, this.cdr, this.renderer, this.platform);
-                break;
-            case 'fade':
-                this.engine = new ThyCarouselFadeEngine(this, this.cdr, this.renderer, this.platform);
-                break;
-            default:
-                this.engine = new ThyCarouselNoopEngine(this, this.cdr, this.renderer, this.platform);
-        }
-    }
     markContentActive(index) {
         this.activeIndex = index;
-        this.carouselItems.forEach((carouselContent, i) => {
+        this.cdr.markForCheck();
+        this.carouselItems?.forEach((carouselContent, i) => {
             carouselContent.isActive = index === i;
         });
-        this.cdr.detectChanges();
     }
     setInitialValue() {
-        if (this.engine) {
-            this.engine.initializeCarouselContents(this.carouselItems);
+        if (this.engine() && this.carouselItems) {
+            this.engine()?.initializeCarouselContents(this.carouselItems);
         }
     }
     scheduleNextTransition() {
         this.clearScheduledTransition();
-        if (this.thyAutoPlay && !this.isPause) {
+        if (this.thyAutoPlay() && !this.isPause) {
             this.transitionTimer = setTimeout(() => {
                 this.moveTo(this.activeIndex + 1);
-            }, this.thyAutoPlayInterval);
+            }, this.thyAutoPlayInterval());
         }
     }
     clearScheduledTransition() {
@@ -408,7 +444,7 @@ class ThyCarousel {
         }
     }
     onDrag(event) {
-        if (!this.isDragging && !this.isTransitioning && this.thyTouchable) {
+        if (!this.isDragging && !this.isTransitioning && this.thyTouchable()) {
             const mouseDownTime = new TinyDate().getTime();
             let mouseUpTime;
             this.clearScheduledTransition();
@@ -417,7 +453,7 @@ class ThyCarousel {
                 this.renderer.setStyle(this.wrapperEl, 'cursor', 'grabbing');
                 this.pointerVector = pointerVector;
                 this.isDragging = true;
-                this.engine?.dragging(this.pointerVector, this.wrapperDomRect);
+                this.engine()?.dragging(this.pointerVector, this.wrapperDomRect);
             }, () => { }, () => {
                 if (this.isDragging) {
                     mouseUpTime = new TinyDate().getTime();
@@ -439,21 +475,21 @@ class ThyCarousel {
         }
     }
     indicatorHandleClick(index) {
-        if (this.thyTrigger === 'click') {
+        if (this.thyTrigger() === 'click') {
             this.moveTo(index);
         }
     }
     indicatorHandleTrigger(index) {
-        if (this.thyPause === 'hover') {
+        if (this.thyPause() === 'hover') {
             this.isPause = true;
             this.clearScheduledTransition();
         }
-        if (this.thyTrigger === 'hover') {
+        if (this.thyTrigger() === 'hover') {
             this._trigger$.next(index);
         }
     }
     indicatorHandleLeave() {
-        if (this.thyPause === 'hover') {
+        if (this.thyPause() === 'hover') {
             this.isPause = false;
             this.scheduleNextTransition();
         }
@@ -465,41 +501,23 @@ class ThyCarousel {
         this.moveTo(this.activeIndex - 1);
     }
     ngOnInit() {
-        this.wrapperEl = this.carouselWrapper.nativeElement;
+        this.wrapperEl = this.carouselWrapper().nativeElement;
         this.ngZone.runOutsideAngular(() => {
             fromEvent(window, 'resize')
                 .pipe(takeUntil(this._destroy$), debounceTime(100))
                 .subscribe(() => {
-                this.engine?.correctionOffset();
+                this.engine()?.correctionOffset();
             });
         });
     }
-    ngOnChanges(changes) {
-        const { thyEffect, thyTouchable } = changes;
-        if (thyEffect && !thyEffect.isFirstChange()) {
-            this.switchEngine();
-            this.markContentActive(0);
-            this.setInitialValue();
-        }
-        if (thyTouchable && !thyTouchable.isFirstChange()) {
-            this.renderer.setStyle(this.wrapperEl, 'cursor', thyTouchable.currentValue ? 'grab' : 'default');
-        }
-        if (!this.thyAutoPlay || !this.thyAutoPlayInterval) {
-            this.clearScheduledTransition();
-        }
-        else {
-            this.scheduleNextTransition();
-        }
-    }
     ngAfterViewInit() {
         this.carouselItems.changes.subscribe(() => {
             this.markContentActive(0);
             this.setInitialValue();
         });
-        this.switchEngine();
         this.markContentActive(0);
         this.setInitialValue();
-        if (!this.thyTouchable) {
+        if (!this.thyTouchable()) {
             this.renderer.setStyle(this.wrapperEl, 'cursor', 'default');
         }
     }
@@ -518,12 +536,12 @@ class ThyCarousel {
         this._destroy$.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyCarousel, isStandalone: true, selector: "thy-carousel", inputs: { thyAutoPlay: ["thyAutoPlay", "thyAutoPlay", coerceBooleanProperty], thyAutoPlayInterval: ["thyAutoPlayInterval", "thyAutoPlayInterval", numberAttribute], thyEffect: "thyEffect", thyIndicators: ["thyIndicators", "thyIndicators", coerceBooleanProperty], thyIndicatorRender: "thyIndicatorRender", thyControls: ["thyControls", "thyControls", coerceBooleanProperty], thyControlPrev: "thyControlPrev", thyControlNext: "thyControlNext", thyTouchable: ["thyTouchable", "thyTouchable", coerceBooleanProperty], thyTrigger: "thyTrigger", thyPause: "thyPause" }, outputs: { thyBeforeChange: "thyBeforeChange", thyAfterChange: "thyAfterChange" }, host: { classAttribute: "thy-carousel" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyCarousel, isStandalone: true, selector: "thy-carousel", inputs: { thyAutoPlay: { classPropertyName: "thyAutoPlay", publicName: "thyAutoPlay", isSignal: true, isRequired: false, transformFunction: null }, thyAutoPlayInterval: { classPropertyName: "thyAutoPlayInterval", publicName: "thyAutoPlayInterval", isSignal: true, isRequired: false, transformFunction: null }, thyEffect: { classPropertyName: "thyEffect", publicName: "thyEffect", isSignal: true, isRequired: false, transformFunction: null }, thyIndicators: { classPropertyName: "thyIndicators", publicName: "thyIndicators", isSignal: true, isRequired: false, transformFunction: null }, thyIndicatorRender: { classPropertyName: "thyIndicatorRender", publicName: "thyIndicatorRender", isSignal: true, isRequired: false, transformFunction: null }, thyControls: { classPropertyName: "thyControls", publicName: "thyControls", isSignal: true, isRequired: false, transformFunction: null }, thyControlPrev: { classPropertyName: "thyControlPrev", publicName: "thyControlPrev", isSignal: true, isRequired: false, transformFunction: null }, thyControlNext: { classPropertyName: "thyControlNext", publicName: "thyControlNext", isSignal: true, isRequired: false, transformFunction: null }, thyTouchable: { classPropertyName: "thyTouchable", publicName: "thyTouchable", isSignal: true, isRequired: false, transformFunction: null }, thyTrigger: { classPropertyName: "thyTrigger", publicName: "thyTrigger", isSignal: true, isRequired: false, transformFunction: null }, thyPause: { classPropertyName: "thyPause", publicName: "thyPause", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyBeforeChange: "thyBeforeChange", thyAfterChange: "thyAfterChange" }, host: { classAttribute: "thy-carousel" }, providers: [
             {
                 provide: THY_CAROUSEL_COMPONENT,
                 useExisting: ThyCarousel
             }
-        ], queries: [{ propertyName: "carouselItems", predicate: ThyCarouselItemDirective }], viewQueries: [{ propertyName: "carouselWrapper", first: true, predicate: ["carouselWrapper"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"thy-carousel thy-carousel-initialized thy-carousel-point-events\">\n  <div #carouselWrapper class=\"thy-carousel-wrapper\" (mousedown)=\"onDrag($event)\" (touchstart)=\"onDrag($event)\">\n    <ng-content></ng-content>\n  </div>\n  @if (thyControls && carouselItems.length > 1) {\n    <div class=\"thy-carousel-control-pre-wrapper\" (click)=\"pre()\">\n      <ng-container *ngTemplateOutlet=\"thyControlPrev || defaultControlPrev\"></ng-container>\n    </div>\n    <div class=\"thy-carousel-control-next-wrapper\" (click)=\"next()\">\n      <ng-container *ngTemplateOutlet=\"thyControlNext || defaultControlNext\"></ng-container>\n    </div>\n  }\n  @if (thyIndicators) {\n    <div class=\"thy-carousel-indicators\">\n      @for (content of carouselItems; track $index; let i = $index) {\n        <span\n          class=\"thy-carousel-indicator\"\n          (mouseenter)=\"indicatorHandleTrigger(i)\"\n          (mouseleave)=\"indicatorHandleLeave()\"\n          (click)=\"indicatorHandleClick(i)\">\n          <ng-template\n            [ngTemplateOutlet]=\"thyIndicatorRender || defaultIndicatorRender\"\n            [ngTemplateOutletContext]=\"{ $implicit: i === activeIndex }\"></ng-template>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #defaultIndicatorRender let-active>\n  <thy-dot [class.active]=\"active\"></thy-dot>\n</ng-template>\n\n<ng-template #defaultControlPrev>\n  <div class=\"thy-carousel-control thy-carousel-control-pre\">\n    <thy-icon thyIconName=\"angle-left-bold\"></thy-icon>\n  </div>\n</ng-template>\n\n<ng-template #defaultControlNext>\n  <div class=\"thy-carousel-control thy-carousel-control-next\">\n    <thy-icon thyIconName=\"angle-right-bold\"></thy-icon>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyDot, selector: "thy-dot,[thy-dot],[thyDot]", inputs: ["thyColor", "thySize", "thyTheme", "thyShape"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "carouselItems", predicate: ThyCarouselItemDirective }], viewQueries: [{ propertyName: "carouselWrapper", first: true, predicate: ["carouselWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"thy-carousel thy-carousel-initialized thy-carousel-point-events\">\n  <div #carouselWrapper class=\"thy-carousel-wrapper\" (mousedown)=\"onDrag($event)\" (touchstart)=\"onDrag($event)\">\n    <ng-content></ng-content>\n  </div>\n  @if (thyControls() && carouselItems?.length > 1) {\n    <div class=\"thy-carousel-control-pre-wrapper\" (click)=\"pre()\">\n      <ng-container *ngTemplateOutlet=\"thyControlPrev() || defaultControlPrev\"></ng-container>\n    </div>\n    <div class=\"thy-carousel-control-next-wrapper\" (click)=\"next()\">\n      <ng-container *ngTemplateOutlet=\"thyControlNext() || defaultControlNext\"></ng-container>\n    </div>\n  }\n  @if (thyIndicators()) {\n    <div class=\"thy-carousel-indicators\">\n      @for (content of carouselItems; track $index; let i = $index) {\n        <span\n          class=\"thy-carousel-indicator\"\n          (mouseenter)=\"indicatorHandleTrigger(i)\"\n          (mouseleave)=\"indicatorHandleLeave()\"\n          (click)=\"indicatorHandleClick(i)\">\n          <ng-template\n            [ngTemplateOutlet]=\"thyIndicatorRender() || defaultIndicatorRender\"\n            [ngTemplateOutletContext]=\"{ $implicit: i === activeIndex }\"></ng-template>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #defaultIndicatorRender let-active>\n  <thy-dot [class.active]=\"active\"></thy-dot>\n</ng-template>\n\n<ng-template #defaultControlPrev>\n  <div class=\"thy-carousel-control thy-carousel-control-pre\">\n    <thy-icon thyIconName=\"angle-left-bold\"></thy-icon>\n  </div>\n</ng-template>\n\n<ng-template #defaultControlNext>\n  <div class=\"thy-carousel-control thy-carousel-control-next\">\n    <thy-icon thyIconName=\"angle-right-bold\"></thy-icon>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyDot, selector: "thy-dot,[thy-dot],[thyDot]", inputs: ["thyColor", "thySize", "thyTheme", "thyShape"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyCarousel, decorators: [{
             type: Component,
@@ -534,44 +552,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
                             provide: THY_CAROUSEL_COMPONENT,
                             useExisting: ThyCarousel
                         }
-                    ], template: "<div class=\"thy-carousel thy-carousel-initialized thy-carousel-point-events\">\n  <div #carouselWrapper class=\"thy-carousel-wrapper\" (mousedown)=\"onDrag($event)\" (touchstart)=\"onDrag($event)\">\n    <ng-content></ng-content>\n  </div>\n  @if (thyControls && carouselItems.length > 1) {\n    <div class=\"thy-carousel-control-pre-wrapper\" (click)=\"pre()\">\n      <ng-container *ngTemplateOutlet=\"thyControlPrev || defaultControlPrev\"></ng-container>\n    </div>\n    <div class=\"thy-carousel-control-next-wrapper\" (click)=\"next()\">\n      <ng-container *ngTemplateOutlet=\"thyControlNext || defaultControlNext\"></ng-container>\n    </div>\n  }\n  @if (thyIndicators) {\n    <div class=\"thy-carousel-indicators\">\n      @for (content of carouselItems; track $index; let i = $index) {\n        <span\n          class=\"thy-carousel-indicator\"\n          (mouseenter)=\"indicatorHandleTrigger(i)\"\n          (mouseleave)=\"indicatorHandleLeave()\"\n          (click)=\"indicatorHandleClick(i)\">\n          <ng-template\n            [ngTemplateOutlet]=\"thyIndicatorRender || defaultIndicatorRender\"\n            [ngTemplateOutletContext]=\"{ $implicit: i === activeIndex }\"></ng-template>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #defaultIndicatorRender let-active>\n  <thy-dot [class.active]=\"active\"></thy-dot>\n</ng-template>\n\n<ng-template #defaultControlPrev>\n  <div class=\"thy-carousel-control thy-carousel-control-pre\">\n    <thy-icon thyIconName=\"angle-left-bold\"></thy-icon>\n  </div>\n</ng-template>\n\n<ng-template #defaultControlNext>\n  <div class=\"thy-carousel-control thy-carousel-control-next\">\n    <thy-icon thyIconName=\"angle-right-bold\"></thy-icon>\n  </div>\n</ng-template>\n" }]
-        }], propDecorators: { carouselItems: [{
+                    ], template: "<div class=\"thy-carousel thy-carousel-initialized thy-carousel-point-events\">\n  <div #carouselWrapper class=\"thy-carousel-wrapper\" (mousedown)=\"onDrag($event)\" (touchstart)=\"onDrag($event)\">\n    <ng-content></ng-content>\n  </div>\n  @if (thyControls() && carouselItems?.length > 1) {\n    <div class=\"thy-carousel-control-pre-wrapper\" (click)=\"pre()\">\n      <ng-container *ngTemplateOutlet=\"thyControlPrev() || defaultControlPrev\"></ng-container>\n    </div>\n    <div class=\"thy-carousel-control-next-wrapper\" (click)=\"next()\">\n      <ng-container *ngTemplateOutlet=\"thyControlNext() || defaultControlNext\"></ng-container>\n    </div>\n  }\n  @if (thyIndicators()) {\n    <div class=\"thy-carousel-indicators\">\n      @for (content of carouselItems; track $index; let i = $index) {\n        <span\n          class=\"thy-carousel-indicator\"\n          (mouseenter)=\"indicatorHandleTrigger(i)\"\n          (mouseleave)=\"indicatorHandleLeave()\"\n          (click)=\"indicatorHandleClick(i)\">\n          <ng-template\n            [ngTemplateOutlet]=\"thyIndicatorRender() || defaultIndicatorRender\"\n            [ngTemplateOutletContext]=\"{ $implicit: i === activeIndex }\"></ng-template>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #defaultIndicatorRender let-active>\n  <thy-dot [class.active]=\"active\"></thy-dot>\n</ng-template>\n\n<ng-template #defaultControlPrev>\n  <div class=\"thy-carousel-control thy-carousel-control-pre\">\n    <thy-icon thyIconName=\"angle-left-bold\"></thy-icon>\n  </div>\n</ng-template>\n\n<ng-template #defaultControlNext>\n  <div class=\"thy-carousel-control thy-carousel-control-next\">\n    <thy-icon thyIconName=\"angle-right-bold\"></thy-icon>\n  </div>\n</ng-template>\n" }]
+        }], ctorParameters: () => [], propDecorators: { carouselItems: [{
                 type: ContentChildren,
                 args: [ThyCarouselItemDirective]
-            }], carouselWrapper: [{
-                type: ViewChild,
-                args: ['carouselWrapper', { static: true }]
-            }], thyAutoPlay: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyAutoPlayInterval: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], thyEffect: [{
-                type: Input
-            }], thyIndicators: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyIndicatorRender: [{
-                type: Input
-            }], thyControls: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyControlPrev: [{
-                type: Input
-            }], thyControlNext: [{
-                type: Input
-            }], thyTouchable: [{
-                type: Input,
-                args: [{ transform: coerceBooleanProperty }]
-            }], thyTrigger: [{
-                type: Input
-            }], thyPause: [{
-                type: Input
-            }], thyBeforeChange: [{
-                type: Output
-            }], thyAfterChange: [{
-                type: Output
             }] } });
 
 const COMPONENTS = [ThyCarousel, ThyCarouselItemDirective];