cmat 0.0.78 → 0.0.79

package/fesm2022/cmat-components-empty-state.mjs

@@ -7,41 +7,20 @@ import { MatIconModule } from '@angular/material/icon';
 
 class CmatEmptyStateComponent {
     constructor() {
-        /**
-         * 图标名称。
-         */
         this.icon = 'mat_outline:inbox';
-        /**
-         * 标题。
-         */
         this.title = '暂无内容';
-        /**
-         * 说明文字。
-         */
-        this.description = '当前没有可展示的数据。';
-        /**
-         * 按钮文字。
-         */
+        this.description = '当前没有可显示的数据。';
         this.ctaLabel = '';
-        /**
-         * 按钮是否禁用。
-         */
         this.ctaDisabled = false;
-        /**
-         * 点击按钮事件。
-         */
         this.ctaClick = new EventEmitter();
     }
-    /**
-     * 触发操作。
-     */
     emitAction() {
         this.ctaClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatEmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.7", type: CmatEmptyStateComponent, isStandalone: true, selector: "cmat-empty-state", inputs: { icon: "icon", title: "title", description: "description", ctaLabel: "ctaLabel", ctaDisabled: "ctaDisabled" }, outputs: { ctaClick: "ctaClick" }, ngImport: i0, template: "<div class=\"flex flex-col items-center justify-center rounded-2xl bg-card px-6 py-10 text-center shadow-sm\">\r\n    @if (icon) {\r\n        <div class=\"flex h-16 w-16 items-center justify-center rounded-full bg-slate-100 dark:bg-slate-600 text-slate-500 dark:text-slate-300\">\r\n            <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n        </div>\r\n    }\r\n\r\n    <h3 class=\"mt-4 text-lg font-semibold\">{{ title }}</h3>\r\n\r\n    @if (description) {\r\n        <p class=\"mt-2 max-w-xl text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</p>\r\n    }\r\n\r\n    @if (ctaLabel) {\r\n        <div class=\"mt-4\">\r\n            <button matButton=\"outlined\" type=\"button\" [disabled]=\"ctaDisabled\" (click)=\"emitAction()\">{{ ctaLabel }}</button>\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatEmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: CmatEmptyStateComponent, isStandalone: true, selector: "cmat-empty-state", inputs: { icon: "icon", title: "title", description: "description", ctaLabel: "ctaLabel", ctaDisabled: "ctaDisabled" }, outputs: { ctaClick: "ctaClick" }, ngImport: i0, template: "<div class=\"flex flex-col items-center justify-center rounded-2xl bg-card px-6 py-10 text-center shadow-sm\">\r\n    @if (icon) {\r\n        <div class=\"flex h-16 w-16 items-center justify-center rounded-full bg-slate-100 dark:bg-slate-600 text-slate-500 dark:text-slate-300\">\r\n            <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n        </div>\r\n    }\r\n\r\n    <h3 class=\"mt-4 text-lg font-semibold\">{{ title }}</h3>\r\n\r\n    @if (description) {\r\n        <p class=\"mt-2 max-w-xl text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</p>\r\n    }\r\n\r\n    @if (ctaLabel) {\r\n        <div class=\"mt-4\">\r\n            <button matButton=\"outlined\" type=\"button\" [disabled]=\"ctaDisabled\" (click)=\"emitAction()\">{{ ctaLabel }}</button>\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatEmptyStateComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatEmptyStateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-empty-state', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatButtonModule, MatIconModule], template: "<div class=\"flex flex-col items-center justify-center rounded-2xl bg-card px-6 py-10 text-center shadow-sm\">\r\n    @if (icon) {\r\n        <div class=\"flex h-16 w-16 items-center justify-center rounded-full bg-slate-100 dark:bg-slate-600 text-slate-500 dark:text-slate-300\">\r\n            <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n        </div>\r\n    }\r\n\r\n    <h3 class=\"mt-4 text-lg font-semibold\">{{ title }}</h3>\r\n\r\n    @if (description) {\r\n        <p class=\"mt-2 max-w-xl text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</p>\r\n    }\r\n\r\n    @if (ctaLabel) {\r\n        <div class=\"mt-4\">\r\n            <button matButton=\"outlined\" type=\"button\" [disabled]=\"ctaDisabled\" (click)=\"emitAction()\">{{ ctaLabel }}</button>\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { icon: [{

package/fesm2022/cmat-components-empty-state.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-empty-state.mjs","sources":["../../../projects/cmat/components/empty-state/empty-state.component.ts","../../../projects/cmat/components/empty-state/empty-state.component.html","../../../projects/cmat/components/empty-state/cmat-components-empty-state.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\n@Component({\r\n    selector: 'cmat-empty-state',\r\n    templateUrl: './empty-state.component.html',\r\n    styleUrls: ['./empty-state.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [MatButtonModule, MatIconModule]\r\n})\r\nexport class CmatEmptyStateComponent {\r\n    /**\r\n     * 图标名称。\r\n     */\r\n    @Input() icon = 'mat_outline:inbox';\r\n\r\n    /**\r\n     * 标题。\r\n     */\r\n    @Input() title = '暂无内容';\r\n\r\n    /**\r\n     * 说明文字。\r\n     */\r\n    @Input() description = '当前没有可展示的数据。';\r\n\r\n    /**\r\n     * 按钮文字。\r\n     */\r\n    @Input() ctaLabel = '';\r\n\r\n    /**\r\n     * 按钮是否禁用。\r\n     */\r\n    @Input() ctaDisabled = false;\r\n\r\n    /**\r\n     * 点击按钮事件。\r\n     */\r\n    @Output() ctaClick = new EventEmitter<void>();\r\n\r\n    /**\r\n     * 触发操作。\r\n     */\r\n    emitAction(): void {\r\n        this.ctaClick.emit();\r\n    }\r\n}\r\n","<div class=\"flex flex-col items-center justify-center rounded-2xl bg-card px-6 py-10 text-center shadow-sm\">\r\n    @if (icon) {\r\n        <div class=\"flex h-16 w-16 items-center justify-center rounded-full bg-slate-100 dark:bg-slate-600 text-slate-500 dark:text-slate-300\">\r\n            <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n        </div>\r\n    }\r\n\r\n    <h3 class=\"mt-4 text-lg font-semibold\">{{ title }}</h3>\r\n\r\n    @if (description) {\r\n        <p class=\"mt-2 max-w-xl text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</p>\r\n    }\r\n\r\n    @if (ctaLabel) {\r\n        <div class=\"mt-4\">\r\n            <button matButton=\"outlined\" type=\"button\" [disabled]=\"ctaDisabled\" (click)=\"emitAction()\">{{ ctaLabel }}</button>\r\n        </div>\r\n    }\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAWa,uBAAuB,CAAA;AAPpC,IAAA,WAAA,GAAA;AAQI;;AAEG;QACM,IAAA,CAAA,IAAI,GAAG,mBAAmB;AAEnC;;AAEG;QACM,IAAA,CAAA,KAAK,GAAG,MAAM;AAEvB;;AAEG;QACM,IAAA,CAAA,WAAW,GAAG,aAAa;AAEpC;;AAEG;QACM,IAAA,CAAA,QAAQ,GAAG,EAAE;AAEtB;;AAEG;QACM,IAAA,CAAA,WAAW,GAAG,KAAK;AAE5B;;AAEG;AACO,QAAA,IAAA,CAAA,QAAQ,GAAG,IAAI,YAAY,EAAQ;AAQhD,IAAA;AANG;;AAEG;IACH,UAAU,GAAA;AACN,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;IACxB;8GApCS,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,WAAA,EAAA,aAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXpC,yzBAmBA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDVc,eAAe,mXAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAE/B,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAPnC,SAAS;+BACI,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,WACtC,CAAC,eAAe,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,yzBAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAMxC;;sBAKA;;sBAKA;;sBAKA;;sBAKA;;sBAKA;;;AExCL;;AAEG;;;;"}
+{"version":3,"file":"cmat-components-empty-state.mjs","sources":["../../../projects/cmat/components/empty-state/empty-state.component.ts","../../../projects/cmat/components/empty-state/empty-state.component.html","../../../projects/cmat/components/empty-state/cmat-components-empty-state.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\n@Component({\r\n    selector: 'cmat-empty-state',\r\n    templateUrl: './empty-state.component.html',\r\n    styleUrls: ['./empty-state.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [MatButtonModule, MatIconModule]\r\n})\r\nexport class CmatEmptyStateComponent {\r\n    \r\n    @Input() icon = 'mat_outline:inbox';\r\n\r\n    \r\n    @Input() title = '暂无内容';\r\n\r\n    \r\n    @Input() description = '当前没有可显示的数据。';\r\n\r\n    \r\n    @Input() ctaLabel = '';\r\n\r\n    \r\n    @Input() ctaDisabled = false;\r\n\r\n    \r\n    @Output() ctaClick = new EventEmitter<void>();\r\n\r\n    \r\n    emitAction(): void {\r\n        this.ctaClick.emit();\r\n    }\r\n}\r\n","<div class=\"flex flex-col items-center justify-center rounded-2xl bg-card px-6 py-10 text-center shadow-sm\">\r\n    @if (icon) {\r\n        <div class=\"flex h-16 w-16 items-center justify-center rounded-full bg-slate-100 dark:bg-slate-600 text-slate-500 dark:text-slate-300\">\r\n            <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n        </div>\r\n    }\r\n\r\n    <h3 class=\"mt-4 text-lg font-semibold\">{{ title }}</h3>\r\n\r\n    @if (description) {\r\n        <p class=\"mt-2 max-w-xl text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</p>\r\n    }\r\n\r\n    @if (ctaLabel) {\r\n        <div class=\"mt-4\">\r\n            <button matButton=\"outlined\" type=\"button\" [disabled]=\"ctaDisabled\" (click)=\"emitAction()\">{{ ctaLabel }}</button>\r\n        </div>\r\n    }\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAWa,uBAAuB,CAAA;AAPpC,IAAA,WAAA,GAAA;QASa,IAAA,CAAA,IAAI,GAAG,mBAAmB;QAG1B,IAAA,CAAA,KAAK,GAAG,MAAM;QAGd,IAAA,CAAA,WAAW,GAAG,aAAa;QAG3B,IAAA,CAAA,QAAQ,GAAG,EAAE;QAGb,IAAA,CAAA,WAAW,GAAG,KAAK;AAGlB,QAAA,IAAA,CAAA,QAAQ,GAAG,IAAI,YAAY,EAAQ;AAMhD,IAAA;IAHG,UAAU,GAAA;AACN,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;IACxB;8GAtBS,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,WAAA,EAAA,aAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXpC,yzBAmBA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDVc,eAAe,mXAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAE/B,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAPnC,SAAS;+BACI,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,WACtC,CAAC,eAAe,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,yzBAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAIxC;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;;AE5BL;;AAEG;;;;"}

package/fesm2022/cmat-components-file-preview.mjs

@@ -7,35 +7,17 @@ import { CmatImageComponent } from 'cmat/components/image-viewer';
 
 class CmatFilePreviewComponent {
     constructor() {
-        /**
-         * 文件名。
-         */
         this.name = '';
-        /**
-         * 文件描述。
-         */
         this.description = '';
-        /**
-         * 文件类型。
-         */
         this.fileType = 'file';
-        /**
-         * 文件大小。
-         */
         this.size = '';
-        /**
-         * 预览地址。
-         */
         this.src = '';
-        /**
-         * 是否预览图片。
-         */
         this.previewImage = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFilePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.7", type: CmatFilePreviewComponent, isStandalone: true, selector: "cmat-file-preview", inputs: { name: "name", description: "description", fileType: "fileType", size: "size", src: "src", previewImage: "previewImage" }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 rounded-2xl bg-card p-4 shadow-sm md:flex-row md:items-start\">\r\n    <div\r\n        class=\"flex h-24 w-24 flex-none items-center justify-center overflow-hidden rounded-xl bg-slate-200 dark:bg-slate-600 text-slate-300 dark:text-slate-500\">\r\n        @if (previewImage && src) {\r\n        <cmat-image class=\"h-full w-full object-cover\" [src]=\"src\" [alt]=\"name\" [preview]=\"true\"></cmat-image>\r\n        } @else {\r\n        <mat-icon [svgIcon]=\"'mat_outline:description'\"></mat-icon>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n        <div class=\"flex flex-col gap-1\">\r\n            <div class=\"truncate text-base font-semibold\">{{ name }}</div>\r\n            @if (description) {\r\n            <div class=\"text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</div>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"mt-3 flex flex-wrap items-center gap-3 text-sm \">\r\n            @if (fileType) {\r\n            <span class=\"rounded-full bg-slate-100 dark:bg-slate-600  px-2 py-0.5\">{{ fileType }}</span>\r\n            }\r\n            @if (size) {\r\n            <span class=\" text-slate-500 dark:text-slate-300\">{{ size }}</span>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CmatImageComponent, selector: "cmat-image", inputs: ["imageClass", "imageStyle", "src", "srcSet", "previewImageSrc", "previewImageSrcSet", "alt", "width", "height", "loading", "appendTo", "preview"], outputs: ["previewShowChange", "imageErrorEvent"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFilePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: CmatFilePreviewComponent, isStandalone: true, selector: "cmat-file-preview", inputs: { name: "name", description: "description", fileType: "fileType", size: "size", src: "src", previewImage: "previewImage" }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 rounded-2xl bg-card p-4 shadow-sm md:flex-row md:items-start\">\r\n    <div\r\n        class=\"flex h-24 w-24 flex-none items-center justify-center overflow-hidden rounded-xl bg-slate-200 dark:bg-slate-600 text-slate-300 dark:text-slate-500\">\r\n        @if (previewImage && src) {\r\n        <cmat-image class=\"h-full w-full object-cover\" [src]=\"src\" [alt]=\"name\" [preview]=\"true\"></cmat-image>\r\n        } @else {\r\n        <mat-icon [svgIcon]=\"'mat_outline:description'\"></mat-icon>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n        <div class=\"flex flex-col gap-1\">\r\n            <div class=\"truncate text-base font-semibold\">{{ name }}</div>\r\n            @if (description) {\r\n            <div class=\"text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</div>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"mt-3 flex flex-wrap items-center gap-3 text-sm \">\r\n            @if (fileType) {\r\n            <span class=\"rounded-full bg-slate-100 dark:bg-slate-600  px-2 py-0.5\">{{ fileType }}</span>\r\n            }\r\n            @if (size) {\r\n            <span class=\" text-slate-500 dark:text-slate-300\">{{ size }}</span>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CmatImageComponent, selector: "cmat-image", inputs: ["imageClass", "imageStyle", "src", "srcSet", "previewImageSrc", "previewImageSrcSet", "alt", "width", "height", "loading", "appendTo", "preview"], outputs: ["previewShowChange", "imageErrorEvent"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFilePreviewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFilePreviewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-file-preview', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, CmatImageComponent, MatIconModule], template: "<div class=\"flex flex-col gap-4 rounded-2xl bg-card p-4 shadow-sm md:flex-row md:items-start\">\r\n    <div\r\n        class=\"flex h-24 w-24 flex-none items-center justify-center overflow-hidden rounded-xl bg-slate-200 dark:bg-slate-600 text-slate-300 dark:text-slate-500\">\r\n        @if (previewImage && src) {\r\n        <cmat-image class=\"h-full w-full object-cover\" [src]=\"src\" [alt]=\"name\" [preview]=\"true\"></cmat-image>\r\n        } @else {\r\n        <mat-icon [svgIcon]=\"'mat_outline:description'\"></mat-icon>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n        <div class=\"flex flex-col gap-1\">\r\n            <div class=\"truncate text-base font-semibold\">{{ name }}</div>\r\n            @if (description) {\r\n            <div class=\"text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</div>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"mt-3 flex flex-wrap items-center gap-3 text-sm \">\r\n            @if (fileType) {\r\n            <span class=\"rounded-full bg-slate-100 dark:bg-slate-600  px-2 py-0.5\">{{ fileType }}</span>\r\n            }\r\n            @if (size) {\r\n            <span class=\" text-slate-500 dark:text-slate-300\">{{ size }}</span>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"] }]
         }], propDecorators: { name: [{

package/fesm2022/cmat-components-file-preview.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-file-preview.mjs","sources":["../../../projects/cmat/components/file-preview/file-preview.component.ts","../../../projects/cmat/components/file-preview/file-preview.component.html","../../../projects/cmat/components/file-preview/cmat-components-file-preview.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { CmatImageComponent } from 'cmat/components/image-viewer';\r\n\r\n@Component({\r\n    selector: 'cmat-file-preview',\r\n    templateUrl: './file-preview.component.html',\r\n    styleUrls: ['./file-preview.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule, CmatImageComponent, MatIconModule]\r\n})\r\nexport class CmatFilePreviewComponent {\r\n    /**\r\n     * 文件名。\r\n     */\r\n    @Input() name = '';\r\n\r\n    /**\r\n     * 文件描述。\r\n     */\r\n    @Input() description = '';\r\n\r\n    /**\r\n     * 文件类型。\r\n     */\r\n    @Input() fileType = 'file';\r\n\r\n    /**\r\n     * 文件大小。\r\n     */\r\n    @Input() size = '';\r\n\r\n    /**\r\n     * 预览地址。\r\n     */\r\n    @Input() src: any = '';\r\n\r\n    /**\r\n     * 是否预览图片。\r\n     */\r\n    @Input() previewImage = true;\r\n}\r\n","<div class=\"flex flex-col gap-4 rounded-2xl bg-card p-4 shadow-sm md:flex-row md:items-start\">\r\n    <div\r\n        class=\"flex h-24 w-24 flex-none items-center justify-center overflow-hidden rounded-xl bg-slate-200 dark:bg-slate-600 text-slate-300 dark:text-slate-500\">\r\n        @if (previewImage && src) {\r\n        <cmat-image class=\"h-full w-full object-cover\" [src]=\"src\" [alt]=\"name\" [preview]=\"true\"></cmat-image>\r\n        } @else {\r\n        <mat-icon [svgIcon]=\"'mat_outline:description'\"></mat-icon>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n        <div class=\"flex flex-col gap-1\">\r\n            <div class=\"truncate text-base font-semibold\">{{ name }}</div>\r\n            @if (description) {\r\n            <div class=\"text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</div>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"mt-3 flex flex-wrap items-center gap-3 text-sm \">\r\n            @if (fileType) {\r\n            <span class=\"rounded-full bg-slate-100 dark:bg-slate-600  px-2 py-0.5\">{{ fileType }}</span>\r\n            }\r\n            @if (size) {\r\n            <span class=\" text-slate-500 dark:text-slate-300\">{{ size }}</span>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAYa,wBAAwB,CAAA;AAPrC,IAAA,WAAA,GAAA;AAQI;;AAEG;QACM,IAAA,CAAA,IAAI,GAAG,EAAE;AAElB;;AAEG;QACM,IAAA,CAAA,WAAW,GAAG,EAAE;AAEzB;;AAEG;QACM,IAAA,CAAA,QAAQ,GAAG,MAAM;AAE1B;;AAEG;QACM,IAAA,CAAA,IAAI,GAAG,EAAE;AAElB;;AAEG;QACM,IAAA,CAAA,GAAG,GAAQ,EAAE;AAEtB;;AAEG;QACM,IAAA,CAAA,YAAY,GAAG,IAAI;AAC/B,IAAA;8GA9BY,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,iNCZrC,oyCA2BM,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDjBQ,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,qQAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEhD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;+BACI,mBAAmB,EAAA,eAAA,EAGZ,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,YAAY,EAAE,kBAAkB,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,oyCAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAMzD;;sBAKA;;sBAKA;;sBAKA;;sBAKA;;sBAKA;;;AEzCL;;AAEG;;;;"}
+{"version":3,"file":"cmat-components-file-preview.mjs","sources":["../../../projects/cmat/components/file-preview/file-preview.component.ts","../../../projects/cmat/components/file-preview/file-preview.component.html","../../../projects/cmat/components/file-preview/cmat-components-file-preview.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { CmatImageComponent } from 'cmat/components/image-viewer';\r\n\r\n@Component({\r\n    selector: 'cmat-file-preview',\r\n    templateUrl: './file-preview.component.html',\r\n    styleUrls: ['./file-preview.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule, CmatImageComponent, MatIconModule]\r\n})\r\nexport class CmatFilePreviewComponent {\r\n    \r\n    @Input() name = '';\r\n\r\n    \r\n    @Input() description = '';\r\n\r\n    \r\n    @Input() fileType = 'file';\r\n\r\n    \r\n    @Input() size = '';\r\n\r\n    \r\n    @Input() src: any = '';\r\n\r\n    \r\n    @Input() previewImage = true;\r\n}\r\n","<div class=\"flex flex-col gap-4 rounded-2xl bg-card p-4 shadow-sm md:flex-row md:items-start\">\r\n    <div\r\n        class=\"flex h-24 w-24 flex-none items-center justify-center overflow-hidden rounded-xl bg-slate-200 dark:bg-slate-600 text-slate-300 dark:text-slate-500\">\r\n        @if (previewImage && src) {\r\n        <cmat-image class=\"h-full w-full object-cover\" [src]=\"src\" [alt]=\"name\" [preview]=\"true\"></cmat-image>\r\n        } @else {\r\n        <mat-icon [svgIcon]=\"'mat_outline:description'\"></mat-icon>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n        <div class=\"flex flex-col gap-1\">\r\n            <div class=\"truncate text-base font-semibold\">{{ name }}</div>\r\n            @if (description) {\r\n            <div class=\"text-sm leading-6 text-slate-500 dark:text-slate-300\">{{ description }}</div>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"mt-3 flex flex-wrap items-center gap-3 text-sm \">\r\n            @if (fileType) {\r\n            <span class=\"rounded-full bg-slate-100 dark:bg-slate-600  px-2 py-0.5\">{{ fileType }}</span>\r\n            }\r\n            @if (size) {\r\n            <span class=\" text-slate-500 dark:text-slate-300\">{{ size }}</span>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAYa,wBAAwB,CAAA;AAPrC,IAAA,WAAA,GAAA;QASa,IAAA,CAAA,IAAI,GAAG,EAAE;QAGT,IAAA,CAAA,WAAW,GAAG,EAAE;QAGhB,IAAA,CAAA,QAAQ,GAAG,MAAM;QAGjB,IAAA,CAAA,IAAI,GAAG,EAAE;QAGT,IAAA,CAAA,GAAG,GAAQ,EAAE;QAGb,IAAA,CAAA,YAAY,GAAG,IAAI;AAC/B,IAAA;8GAlBY,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,iNCZrC,oyCA2BM,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDjBQ,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,qQAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEhD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;+BACI,mBAAmB,EAAA,eAAA,EAGZ,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,YAAY,EAAE,kBAAkB,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,oyCAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAIzD;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;;AE7BL;;AAEG;;;;"}

package/fesm2022/cmat-components-filter-toolbar.mjs

@@ -1,6 +1,7 @@
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, HostBinding, Output, Input, ChangeDetectionStrategy, Component } from '@angular/core';
+import { EventEmitter, inject, DestroyRef, HostBinding, Output, Input, ChangeDetectionStrategy, Component } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i5 from '@angular/forms';
 import { FormControl, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@angular/material/button';
@@ -11,87 +12,43 @@ import * as i3 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import * as i4 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import { Subject, takeUntil } from 'rxjs';
 
 class CmatFilterToolbarComponent {
     constructor() {
-        /**
-         * 标题。
-         */
         this.title = '';
-        /**
-         * 说明文字。
-         */
         this.description = '';
-        /**
-         * 搜索框占位符。
-         */
         this.searchPlaceholder = '搜索';
-        /**
-         * 是否显示搜索框。
-         */
         this.showSearch = true;
-        /**
-         * 当前搜索内容。
-         */
         this.searchText = '';
-        /**
-         * 是否允许清空搜索内容。
-         */
         this.clearable = true;
-        /**
-         * 搜索内容变化事件。
-         */
         this.searchTextChange = new EventEmitter();
-        /**
-         * 清空事件。
-         */
         this.clear = new EventEmitter();
-        /**
-         * 搜索提交事件。
-         */
         this.searchSubmit = new EventEmitter();
         this.hostClass = 'block';
         this.searchControl = new FormControl('');
-        this._unsubscribeAll = new Subject();
+        this._destroyRef = inject(DestroyRef);
     }
-    /**
-     * 初始化搜索联动。
-     */
     ngOnInit() {
         this.searchControl.setValue(this.searchText, { emitEvent: false });
         this.searchControl.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
+            .pipe(takeUntilDestroyed(this._destroyRef))
             .subscribe((value) => {
             const text = value ?? '';
             this.searchText = text;
             this.searchTextChange.emit(text);
         });
     }
-    /**
-     * 释放订阅。
-     */
-    ngOnDestroy() {
-        this._unsubscribeAll.next();
-        this._unsubscribeAll.complete();
-    }
-    /**
-     * 提交搜索。
-     */
     submitSearch() {
         this.searchSubmit.emit(this.searchControl.value ?? '');
     }
-    /**
-     * 清空搜索。
-     */
     clearSearch() {
         this.searchControl.setValue('', { emitEvent: true });
         this.clear.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFilterToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.7", type: CmatFilterToolbarComponent, isStandalone: true, selector: "cmat-filter-toolbar", inputs: { title: "title", description: "description", searchPlaceholder: "searchPlaceholder", showSearch: "showSearch", searchText: "searchText", clearable: "clearable" }, outputs: { searchTextChange: "searchTextChange", clear: "clear", searchSubmit: "searchSubmit" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 rounded-2xl border border-default bg-card p-4 shadow-sm\">\r\n    <div class=\"flex flex-col gap-1\">\r\n        @if (title) {\r\n            <h3 class=\"text-lg font-semibold text-default\">{{ title }}</h3>\r\n        }\r\n\r\n        @if (description) {\r\n            <p class=\"text-sm leading-6 text-secondary\">{{ description }}</p>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\r\n        <div class=\"flex-1\">\r\n            @if (showSearch) {\r\n                <mat-form-field class=\"w-full max-w-xl\" subscriptSizing=\"dynamic\">\r\n                    <mat-icon matPrefix class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n                    <input matInput [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" (keyup.enter)=\"submitSearch()\" />\r\n                    @if (clearable && searchControl.value) {\r\n                        <button mat-icon-button matSuffix type=\"button\" aria-label=\"\u6E05\u7A7A\u641C\u7D22\" (click)=\"clearSearch()\">\r\n                            <mat-icon class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n                        </button>\r\n                    }\r\n                </mat-form-field>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"flex items-center gap-2\">\r\n            <ng-content select=\"[cmatFilterToolbarActions]\"></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFilterToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: CmatFilterToolbarComponent, isStandalone: true, selector: "cmat-filter-toolbar", inputs: { title: "title", description: "description", searchPlaceholder: "searchPlaceholder", showSearch: "showSearch", searchText: "searchText", clearable: "clearable" }, outputs: { searchTextChange: "searchTextChange", clear: "clear", searchSubmit: "searchSubmit" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 rounded-2xl border border-default bg-card p-4 shadow-sm\">\r\n    <div class=\"flex flex-col gap-1\">\r\n        @if (title) {\r\n            <h3 class=\"text-lg font-semibold text-default\">{{ title }}</h3>\r\n        }\r\n\r\n        @if (description) {\r\n            <p class=\"text-sm leading-6 text-secondary\">{{ description }}</p>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\r\n        <div class=\"flex-1\">\r\n            @if (showSearch) {\r\n                <mat-form-field class=\"w-full max-w-xl\" subscriptSizing=\"dynamic\">\r\n                    <mat-icon matPrefix class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n                    <input matInput [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" (keyup.enter)=\"submitSearch()\" />\r\n                    @if (clearable && searchControl.value) {\r\n                        <button mat-icon-button matSuffix type=\"button\" aria-label=\"\u6E05\u7A7A\u641C\u7D22\" (click)=\"clearSearch()\">\r\n                            <mat-icon class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n                        </button>\r\n                    }\r\n                </mat-form-field>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"flex items-center gap-2\">\r\n            <ng-content select=\"[cmatFilterToolbarActions]\"></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFilterToolbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFilterToolbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-filter-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, ReactiveFormsModule], template: "<div class=\"flex flex-col gap-4 rounded-2xl border border-default bg-card p-4 shadow-sm\">\r\n    <div class=\"flex flex-col gap-1\">\r\n        @if (title) {\r\n            <h3 class=\"text-lg font-semibold text-default\">{{ title }}</h3>\r\n        }\r\n\r\n        @if (description) {\r\n            <p class=\"text-sm leading-6 text-secondary\">{{ description }}</p>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\r\n        <div class=\"flex-1\">\r\n            @if (showSearch) {\r\n                <mat-form-field class=\"w-full max-w-xl\" subscriptSizing=\"dynamic\">\r\n                    <mat-icon matPrefix class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n                    <input matInput [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" (keyup.enter)=\"submitSearch()\" />\r\n                    @if (clearable && searchControl.value) {\r\n                        <button mat-icon-button matSuffix type=\"button\" aria-label=\"\u6E05\u7A7A\u641C\u7D22\" (click)=\"clearSearch()\">\r\n                            <mat-icon class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n                        </button>\r\n                    }\r\n                </mat-form-field>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"flex items-center gap-2\">\r\n            <ng-content select=\"[cmatFilterToolbarActions]\"></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { title: [{

package/fesm2022/cmat-components-filter-toolbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-filter-toolbar.mjs","sources":["../../../projects/cmat/components/filter-toolbar/filter-toolbar.component.ts","../../../projects/cmat/components/filter-toolbar/filter-toolbar.component.html","../../../projects/cmat/components/filter-toolbar/cmat-components-filter-toolbar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output } from '@angular/core';\r\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { Subject, takeUntil } from 'rxjs';\r\n\r\n@Component({\r\n    selector: 'cmat-filter-toolbar',\r\n    templateUrl: './filter-toolbar.component.html',\r\n    styleUrls: ['./filter-toolbar.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule, MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, ReactiveFormsModule]\r\n})\r\nexport class CmatFilterToolbarComponent implements OnInit, OnDestroy {\r\n    /**\r\n     * 标题。\r\n     */\r\n    @Input() title = '';\r\n\r\n    /**\r\n     * 说明文字。\r\n     */\r\n    @Input() description = '';\r\n\r\n    /**\r\n     * 搜索框占位符。\r\n     */\r\n    @Input() searchPlaceholder = '搜索';\r\n\r\n    /**\r\n     * 是否显示搜索框。\r\n     */\r\n    @Input() showSearch = true;\r\n\r\n    /**\r\n     * 当前搜索内容。\r\n     */\r\n    @Input() searchText = '';\r\n\r\n    /**\r\n     * 是否允许清空搜索内容。\r\n     */\r\n    @Input() clearable = true;\r\n\r\n    /**\r\n     * 搜索内容变化事件。\r\n     */\r\n    @Output() searchTextChange = new EventEmitter<string>();\r\n\r\n    /**\r\n     * 清空事件。\r\n     */\r\n    @Output() clear = new EventEmitter<void>();\r\n\r\n    /**\r\n     * 搜索提交事件。\r\n     */\r\n    @Output() searchSubmit = new EventEmitter<string>();\r\n\r\n    @HostBinding('class') hostClass = 'block';\r\n\r\n    searchControl = new FormControl('');\r\n\r\n    private readonly _unsubscribeAll = new Subject<void>();\r\n\r\n    /**\r\n     * 初始化搜索联动。\r\n     */\r\n    ngOnInit(): void {\r\n        this.searchControl.setValue(this.searchText, { emitEvent: false });\r\n\r\n        this.searchControl.valueChanges\r\n            .pipe(takeUntil(this._unsubscribeAll))\r\n            .subscribe((value) => {\r\n                const text = value ?? '';\r\n                this.searchText = text;\r\n                this.searchTextChange.emit(text);\r\n            });\r\n    }\r\n\r\n    /**\r\n     * 释放订阅。\r\n     */\r\n    ngOnDestroy(): void {\r\n        this._unsubscribeAll.next();\r\n        this._unsubscribeAll.complete();\r\n    }\r\n\r\n    /**\r\n     * 提交搜索。\r\n     */\r\n    submitSearch(): void {\r\n        this.searchSubmit.emit(this.searchControl.value ?? '');\r\n    }\r\n\r\n    /**\r\n     * 清空搜索。\r\n     */\r\n    clearSearch(): void {\r\n        this.searchControl.setValue('', { emitEvent: true });\r\n        this.clear.emit();\r\n    }\r\n}\r\n","<div class=\"flex flex-col gap-4 rounded-2xl border border-default bg-card p-4 shadow-sm\">\r\n    <div class=\"flex flex-col gap-1\">\r\n        @if (title) {\r\n            <h3 class=\"text-lg font-semibold text-default\">{{ title }}</h3>\r\n        }\r\n\r\n        @if (description) {\r\n            <p class=\"text-sm leading-6 text-secondary\">{{ description }}</p>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\r\n        <div class=\"flex-1\">\r\n            @if (showSearch) {\r\n                <mat-form-field class=\"w-full max-w-xl\" subscriptSizing=\"dynamic\">\r\n                    <mat-icon matPrefix class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n                    <input matInput [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" (keyup.enter)=\"submitSearch()\" />\r\n                    @if (clearable && searchControl.value) {\r\n                        <button mat-icon-button matSuffix type=\"button\" aria-label=\"清空搜索\" (click)=\"clearSearch()\">\r\n                            <mat-icon class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n                        </button>\r\n                    }\r\n                </mat-form-field>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"flex items-center gap-2\">\r\n            <ng-content select=\"[cmatFilterToolbarActions]\"></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cmat-components-filter-toolbar.mjs","sources":["../../../projects/cmat/components/filter-toolbar/filter-toolbar.component.ts","../../../projects/cmat/components/filter-toolbar/filter-toolbar.component.html","../../../projects/cmat/components/filter-toolbar/cmat-components-filter-toolbar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, DestroyRef, EventEmitter, HostBinding, Input, OnInit, Output, inject } from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\n\r\n@Component({\r\n    selector: 'cmat-filter-toolbar',\r\n    templateUrl: './filter-toolbar.component.html',\r\n    styleUrls: ['./filter-toolbar.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule, MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, ReactiveFormsModule]\r\n})\r\nexport class CmatFilterToolbarComponent implements OnInit {\r\n    \r\n    @Input() title = '';\r\n\r\n    \r\n    @Input() description = '';\r\n\r\n    \r\n    @Input() searchPlaceholder = '搜索';\r\n\r\n    \r\n    @Input() showSearch = true;\r\n\r\n    \r\n    @Input() searchText = '';\r\n\r\n    \r\n    @Input() clearable = true;\r\n\r\n    \r\n    @Output() searchTextChange = new EventEmitter<string>();\r\n\r\n    \r\n    @Output() clear = new EventEmitter<void>();\r\n\r\n    \r\n    @Output() searchSubmit = new EventEmitter<string>();\r\n\r\n    @HostBinding('class') hostClass = 'block';\r\n\r\n    searchControl = new FormControl('');\r\n\r\n    private readonly _destroyRef = inject(DestroyRef);\r\n\r\n    \r\n    ngOnInit(): void {\r\n        this.searchControl.setValue(this.searchText, { emitEvent: false });\r\n\r\n        this.searchControl.valueChanges\r\n            .pipe(takeUntilDestroyed(this._destroyRef))\r\n            .subscribe((value) => {\r\n                const text = value ?? '';\r\n                this.searchText = text;\r\n                this.searchTextChange.emit(text);\r\n            });\r\n    }\r\n\r\n    \r\n    \r\n    submitSearch(): void {\r\n        this.searchSubmit.emit(this.searchControl.value ?? '');\r\n    }\r\n\r\n    \r\n    clearSearch(): void {\r\n        this.searchControl.setValue('', { emitEvent: true });\r\n        this.clear.emit();\r\n    }\r\n}\r\n","<div class=\"flex flex-col gap-4 rounded-2xl border border-default bg-card p-4 shadow-sm\">\r\n    <div class=\"flex flex-col gap-1\">\r\n        @if (title) {\r\n            <h3 class=\"text-lg font-semibold text-default\">{{ title }}</h3>\r\n        }\r\n\r\n        @if (description) {\r\n            <p class=\"text-sm leading-6 text-secondary\">{{ description }}</p>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\r\n        <div class=\"flex-1\">\r\n            @if (showSearch) {\r\n                <mat-form-field class=\"w-full max-w-xl\" subscriptSizing=\"dynamic\">\r\n                    <mat-icon matPrefix class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n                    <input matInput [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" (keyup.enter)=\"submitSearch()\" />\r\n                    @if (clearable && searchControl.value) {\r\n                        <button mat-icon-button matSuffix type=\"button\" aria-label=\"清空搜索\" (click)=\"clearSearch()\">\r\n                            <mat-icon class=\"text-secondary\" [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n                        </button>\r\n                    }\r\n                </mat-form-field>\r\n            }\r\n        </div>\r\n\r\n        <div class=\"flex items-center gap-2\">\r\n            <ng-content select=\"[cmatFilterToolbarActions]\"></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cmat-components-form-actions.mjs

@@ -4,19 +4,13 @@ import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
 
 class CmatFormActionsComponent {
     constructor() {
-        /**
-         * 对齐方式。
-         */
         this.align = 'end';
-        /**
-         * 是否显示顶部分割线。
-         */
         this.divider = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFormActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.7", type: CmatFormActionsComponent, isStandalone: true, selector: "cmat-form-actions", inputs: { align: "align", divider: "divider" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3 border-default pt-4\" [class.border-t]=\"divider\" [class.items-start]=\"align === 'start'\" [class.items-center]=\"align === 'center'\" [class.items-end]=\"align === 'end'\">\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActionsLeft]\"></ng-content>\r\n    </div>\r\n\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActions]\"></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFormActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: CmatFormActionsComponent, isStandalone: true, selector: "cmat-form-actions", inputs: { align: "align", divider: "divider" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3 border-default pt-4\" [class.border-t]=\"divider\" [class.items-start]=\"align === 'start'\" [class.items-center]=\"align === 'center'\" [class.items-end]=\"align === 'end'\">\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActionsLeft]\"></ng-content>\r\n    </div>\r\n\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActions]\"></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFormActionsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFormActionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-form-actions', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule], template: "<div class=\"flex flex-col gap-3 border-default pt-4\" [class.border-t]=\"divider\" [class.items-start]=\"align === 'start'\" [class.items-center]=\"align === 'center'\" [class.items-end]=\"align === 'end'\">\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActionsLeft]\"></ng-content>\r\n    </div>\r\n\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActions]\"></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { align: [{

package/fesm2022/cmat-components-form-actions.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-form-actions.mjs","sources":["../../../projects/cmat/components/form-actions/form-actions.component.ts","../../../projects/cmat/components/form-actions/form-actions.component.html","../../../projects/cmat/components/form-actions/cmat-components-form-actions.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'cmat-form-actions',\r\n    templateUrl: './form-actions.component.html',\r\n    styleUrls: ['./form-actions.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule]\r\n})\r\nexport class CmatFormActionsComponent {\r\n    /**\r\n     * 对齐方式。\r\n     */\r\n    @Input() align: 'start' | 'center' | 'end' = 'end';\r\n\r\n    /**\r\n     * 是否显示顶部分割线。\r\n     */\r\n    @Input() divider = true;\r\n}\r\n","<div class=\"flex flex-col gap-3 border-default pt-4\" [class.border-t]=\"divider\" [class.items-start]=\"align === 'start'\" [class.items-center]=\"align === 'center'\" [class.items-end]=\"align === 'end'\">\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActionsLeft]\"></ng-content>\r\n    </div>\r\n\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActions]\"></ng-content>\r\n    </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAUa,wBAAwB,CAAA;AAPrC,IAAA,WAAA,GAAA;AAQI;;AAEG;QACM,IAAA,CAAA,KAAK,GAA+B,KAAK;AAElD;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,IAAI;AAC1B,IAAA;8GAVY,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECVrC,ouBASA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDDc,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEb,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,mBAGZ,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,ouBAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAMtB;;sBAKA;;;AEnBL;;AAEG;;;;"}
+{"version":3,"file":"cmat-components-form-actions.mjs","sources":["../../../projects/cmat/components/form-actions/form-actions.component.ts","../../../projects/cmat/components/form-actions/form-actions.component.html","../../../projects/cmat/components/form-actions/cmat-components-form-actions.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'cmat-form-actions',\r\n    templateUrl: './form-actions.component.html',\r\n    styleUrls: ['./form-actions.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [CommonModule]\r\n})\r\nexport class CmatFormActionsComponent {\r\n    \r\n    @Input() align: 'start' | 'center' | 'end' = 'end';\r\n\r\n    \r\n    @Input() divider = true;\r\n}\r\n","<div class=\"flex flex-col gap-3 border-default pt-4\" [class.border-t]=\"divider\" [class.items-start]=\"align === 'start'\" [class.items-center]=\"align === 'center'\" [class.items-end]=\"align === 'end'\">\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActionsLeft]\"></ng-content>\r\n    </div>\r\n\r\n    <div class=\"flex flex-wrap gap-2\" [class.justify-start]=\"align === 'start'\" [class.justify-center]=\"align === 'center'\" [class.justify-end]=\"align === 'end'\">\r\n        <ng-content select=\"[cmatFormActions]\"></ng-content>\r\n    </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAUa,wBAAwB,CAAA;AAPrC,IAAA,WAAA,GAAA;QASa,IAAA,CAAA,KAAK,GAA+B,KAAK;QAGzC,IAAA,CAAA,OAAO,GAAG,IAAI;AAC1B,IAAA;8GANY,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECVrC,ouBASA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDDc,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAEb,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,mBAGZ,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,ouBAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAItB;;sBAGA;;;AEfL;;AAEG;;;;"}

package/fesm2022/cmat-components-fullscreen.mjs

@@ -28,12 +28,12 @@ class CmatFullscreenComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFullscreenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.7", type: CmatFullscreenComponent, isStandalone: true, selector: "cmat-fullscreen", inputs: { iconTpl: "iconTpl", tooltip: "tooltip" }, exportAs: ["cmatFullscreen"], ngImport: i0, template: "<!-- Button -->\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n<!-- Default icon -->\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFullscreenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: CmatFullscreenComponent, isStandalone: true, selector: "cmat-fullscreen", inputs: { iconTpl: "iconTpl", tooltip: "tooltip" }, exportAs: ["cmatFullscreen"], ngImport: i0, template: "\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatFullscreenComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatFullscreenComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-fullscreen', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatFullscreen', imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule], template: "<!-- Button -->\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n<!-- Default icon -->\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>" }]
+            args: [{ selector: 'cmat-fullscreen', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatFullscreen', imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule], template: "\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>\r\n" }]
         }], propDecorators: { iconTpl: [{
                 type: Input
             }], tooltip: [{

package/fesm2022/cmat-components-fullscreen.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-fullscreen.mjs","sources":["../../../projects/cmat/components/fullscreen/fullscreen.component.ts","../../../projects/cmat/components/fullscreen/fullscreen.component.html","../../../projects/cmat/components/fullscreen/cmat-components-fullscreen.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input, TemplateRef, ViewEncapsulation, DOCUMENT, inject } from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\n\r\n@Component({\r\n    selector: 'cmat-fullscreen',\r\n    templateUrl: './fullscreen.component.html',\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    exportAs: 'cmatFullscreen',\r\n    imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule]\r\n})\r\nexport class CmatFullscreenComponent {\r\n    @Input() iconTpl: TemplateRef<any>;\r\n    @Input() tooltip: string;\r\n\r\n    private _document = inject<Document>(DOCUMENT);\r\n\r\n\r\n    toggleFullscreen(): void {\r\n        if (!this._document.fullscreenEnabled) {\r\n            console.log('Fullscreen is not available in this browser.');\r\n            return;\r\n        }\r\n\r\n        const fullScreen = this._document.fullscreenElement;\r\n\r\n        if (fullScreen) {\r\n            void this._document.exitFullscreen();\r\n        }\r\n        else {\r\n            this._document.documentElement.requestFullscreen()\r\n                .catch(() => {\r\n                    console.error('Entering fullscreen mode failed.');\r\n                });\r\n        }\r\n    }\r\n}\r\n","<!-- Button -->\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '切换全屏'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n<!-- Default icon -->\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MAca,uBAAuB,CAAA;AARpC,IAAA,WAAA,GAAA;AAYY,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAW,QAAQ,CAAC;AAqBjD,IAAA;IAlBG,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,iBAAiB,EAAE;AACnC,YAAA,OAAO,CAAC,GAAG,CAAC,8CAA8C,CAAC;YAC3D;QACJ;AAEA,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,iBAAiB;QAEnD,IAAI,UAAU,EAAE;AACZ,YAAA,KAAK,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE;QACxC;aACK;AACD,YAAA,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,iBAAiB;iBAC3C,KAAK,CAAC,MAAK;AACR,gBAAA,OAAO,CAAC,KAAK,CAAC,kCAAkC,CAAC;AACrD,YAAA,CAAC,CAAC;QACV;IACJ;8GAxBS,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECdpC,wZAQc,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDIA,eAAe,qNAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAEnE,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBARnC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,iBAEZ,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,gBAAgB,EAAA,OAAA,EACjB,CAAC,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,wZAAA,EAAA;;sBAG5E;;sBACA;;;AEhBL;;AAEG;;;;"}
+{"version":3,"file":"cmat-components-fullscreen.mjs","sources":["../../../projects/cmat/components/fullscreen/fullscreen.component.ts","../../../projects/cmat/components/fullscreen/fullscreen.component.html","../../../projects/cmat/components/fullscreen/cmat-components-fullscreen.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, Input, TemplateRef, ViewEncapsulation, DOCUMENT, inject } from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\n\r\n@Component({\r\n    selector: 'cmat-fullscreen',\r\n    templateUrl: './fullscreen.component.html',\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    exportAs: 'cmatFullscreen',\r\n    imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule]\r\n})\r\nexport class CmatFullscreenComponent {\r\n    @Input() iconTpl: TemplateRef<any>;\r\n    @Input() tooltip: string;\r\n\r\n    private _document = inject<Document>(DOCUMENT);\r\n\r\n\r\n    toggleFullscreen(): void {\r\n        if (!this._document.fullscreenEnabled) {\r\n            console.log('Fullscreen is not available in this browser.');\r\n            return;\r\n        }\r\n\r\n        const fullScreen = this._document.fullscreenElement;\r\n\r\n        if (fullScreen) {\r\n            void this._document.exitFullscreen();\r\n        }\r\n        else {\r\n            this._document.documentElement.requestFullscreen()\r\n                .catch(() => {\r\n                    console.error('Entering fullscreen mode failed.');\r\n                });\r\n        }\r\n    }\r\n}\r\n","\r\n<button type=\"button\" matIconButton  [matTooltip]=\"tooltip || '切换全屏'\" (click)=\"toggleFullscreen()\">\r\n    <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n\r\n<ng-template #defaultIconTpl>\r\n    <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MAca,uBAAuB,CAAA;AARpC,IAAA,WAAA,GAAA;AAYY,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAW,QAAQ,CAAC;AAqBjD,IAAA;IAlBG,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,iBAAiB,EAAE;AACnC,YAAA,OAAO,CAAC,GAAG,CAAC,8CAA8C,CAAC;YAC3D;QACJ;AAEA,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,iBAAiB;QAEnD,IAAI,UAAU,EAAE;AACZ,YAAA,KAAK,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE;QACxC;aACK;AACD,YAAA,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,iBAAiB;iBAC3C,KAAK,CAAC,MAAK;AACR,gBAAA,OAAO,CAAC,KAAK,CAAC,kCAAkC,CAAC;AACrD,YAAA,CAAC,CAAC;QACV;IACJ;8GAxBS,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECdpC,wXASA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDGc,eAAe,qNAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAEnE,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBARnC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,iBAEZ,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,gBAAgB,EAAA,OAAA,EACjB,CAAC,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,wXAAA,EAAA;;sBAG5E;;sBACA;;;AEhBL;;AAEG;;;;"}

package/fesm2022/cmat-components-highlight.mjs

@@ -6,42 +6,32 @@ import hljs from 'highlight.js';
 
 class CmatHighlightService {
     highlight(code, language) {
-        // Format the code
         code = this._format(code);
-        // Highlight and return the code
         return hljs.highlight(code, { language }).value;
     }
     _format(code) {
         let indentation = 0;
-        // Split the code into lines and store the lines
         const lines = code.split('\n');
-        // Trim the empty lines around the code block
         while (lines.length && lines[0].trim() === '') {
             lines.shift();
         }
         while (lines.length && lines[lines.length - 1].trim() === '') {
             lines.pop();
         }
-        // Iterate through the lines
         lines.filter(line => line.length)
             .forEach((line, index) => {
-            // Always get the indentation of the first line so we can
-            // have something to compare with
             if (index === 0) {
                 indentation = line.search(/\S|$/);
                 return;
             }
-            // Look at all the remaining lines to figure out the smallest indentation.
             indentation = Math.min(line.search(/\S|$/), indentation);
         });
-        // Iterate through the lines one more time, remove the extra
-        // indentation, join them together and return it
         return lines.map(line => line.substring(indentation)).join('\n');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatHighlightService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatHighlightService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatHighlightService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatHighlightService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatHighlightService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatHighlightService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -56,62 +46,47 @@ class CmatHighlightComponent {
         this._viewContainerRef = inject(ViewContainerRef);
     }
     ngOnChanges(changes) {
-        // Code & Lang
         if ('code' in changes || 'lang' in changes) {
-            // Return if the viewContainerRef is not available
             if (!this._viewContainerRef.length) {
                 return;
             }
-            // Highlight and insert the code
             this._highlightAndInsert();
         }
     }
     ngAfterViewInit() {
-        // Return if there is no language set
         if (!this.lang) {
             return;
         }
-        // If there is no code input, get the code from
-        // the textarea
         if (!this.code) {
-            // Get the code
             this.code = this._elementRef.nativeElement.value;
         }
-        // Highlight and insert
         this._highlightAndInsert();
     }
     _highlightAndInsert() {
-        // Return if the template reference is not available
         if (!this.templateRef) {
             return;
         }
-        // Return if the code or language is not defined
         if (!this.code || !this.lang) {
             return;
         }
-        // Destroy the component if there is already one
         if (this._viewRef) {
             this._viewRef.destroy();
             this._viewRef = null;
         }
-        // Highlight and sanitize the code just in case
         this.highlightedCode = this._domSanitizer.sanitize(SecurityContext.HTML, this._cmatHighlightService.highlight(this.code, this.lang));
-        // Return if the highlighted code is null
         if (this.highlightedCode === null) {
             return;
         }
-        // Render and insert the template
         this._viewRef = this._viewContainerRef.createEmbeddedView(this.templateRef, {
             highlightedCode: this.highlightedCode,
             lang: this.lang
         });
-        // Detect the changes
         this._viewRef.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatHighlightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.7", type: CmatHighlightComponent, isStandalone: true, selector: "textarea[cmat-highlight]", inputs: { code: "code", lang: "lang" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["cmatHighlight"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\r\n\r\n<ng-template let-highlightedCode=\"highlightedCode\" let-lang=\"lang\">\r\n    <div class=\"cmat-highlight cmat-highlight-code-container\">\r\n        <pre [ngClass]=\"'language-' + lang\"><code [ngClass]=\"'language-' + lang\" [innerHTML]=\"highlightedCode\"></code>\r\n        </pre>\r\n    </div>\r\n</ng-template>", styles: ["textarea[cmat-highlight]{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatHighlightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: CmatHighlightComponent, isStandalone: true, selector: "textarea[cmat-highlight]", inputs: { code: "code", lang: "lang" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["cmatHighlight"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\r\n\r\n<ng-template let-highlightedCode=\"highlightedCode\" let-lang=\"lang\">\r\n    <div class=\"cmat-highlight cmat-highlight-code-container\">\r\n        <pre [ngClass]=\"'language-' + lang\"><code [ngClass]=\"'language-' + lang\" [innerHTML]=\"highlightedCode\"></code>\r\n        </pre>\r\n    </div>\r\n</ng-template>", styles: ["textarea[cmat-highlight]{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: CmatHighlightComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: CmatHighlightComponent, decorators: [{
             type: Component,
             args: [{ selector: 'textarea[cmat-highlight]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatHighlight', imports: [NgClass], template: "<ng-content></ng-content>\r\n\r\n<ng-template let-highlightedCode=\"highlightedCode\" let-lang=\"lang\">\r\n    <div class=\"cmat-highlight cmat-highlight-code-container\">\r\n        <pre [ngClass]=\"'language-' + lang\"><code [ngClass]=\"'language-' + lang\" [innerHTML]=\"highlightedCode\"></code>\r\n        </pre>\r\n    </div>\r\n</ng-template>", styles: ["textarea[cmat-highlight]{display:none}\n"] }]
         }], propDecorators: { code: [{