cmat 0.0.73 → 0.0.75

package/fesm2022/cmat-components-custom-formly.mjs

@@ -63,6 +63,9 @@ import { Overlay } from '@angular/cdk/overlay';
 import { TemplatePortal } from '@angular/cdk/portal';
 import { CmatUploadQueueComponent, CmatFilesUtilService } from 'cmat/components/upload';
 import BlotFormatter from '@enzedonline/quill-blot-formatter2';
+import dayjs from 'dayjs';
+import { Document, Packer, Paragraph, AlignmentType, TextRun, BorderStyle, HeadingLevel, ImageRun } from 'docx';
+import * as FileSaver from 'file-saver-es';
 import * as i2$4 from 'ngx-quill';
 import { QuillModule } from 'ngx-quill';
 import Quill from 'quill';
@@ -94,8 +97,8 @@ class CmatAddonsWrapperComponent extends FieldWrapper {
             this.props.suffix = this.matSuffix;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatAddonsWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatAddonsWrapperComponent, isStandalone: true, selector: "cmat-addons-wrapper", viewQueries: [{ propertyName: "matPrefix", first: true, predicate: ["matPrefix"], descendants: true, static: true }, { propertyName: "matSuffix", first: true, predicate: ["matSuffix"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatAddonsWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatAddonsWrapperComponent, isStandalone: true, selector: "cmat-addons-wrapper", viewQueries: [{ propertyName: "matPrefix", first: true, predicate: ["matPrefix"], descendants: true, static: true }, { propertyName: "matSuffix", first: true, predicate: ["matSuffix"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
     <ng-template #matPrefix>
       @if(props.addonLeft){
         <span>
@@ -126,7 +129,7 @@ class CmatAddonsWrapperComponent extends FieldWrapper {
     </ng-template>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormlyMaterialModule }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatAddonsWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatAddonsWrapperComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'cmat-addons-wrapper',
@@ -171,28 +174,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             }] } });
 
 class CmatCardWrapperComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCardWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatCardWrapperComponent, isStandalone: true, selector: "cmat-card-wrapper", usesInheritance: true, ngImport: i0, template: "<mat-card class=\"dark:bg-white/5\">\r\n    @if(props.label){\r\n        <mat-card-title class=\"p-4\">{{ props.label }}</mat-card-title>\r\n    }\r\n    \r\n    <mat-card-content>\r\n        <ng-container #fieldComponent></ng-container>\r\n    </mat-card-content>    \r\n</mat-card>", dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCardWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatCardWrapperComponent, isStandalone: true, selector: "cmat-card-wrapper", usesInheritance: true, ngImport: i0, template: "<mat-card class=\"dark:bg-white/5\">\r\n    @if(props.label){\r\n        <mat-card-title class=\"p-4\">{{ props.label }}</mat-card-title>\r\n    }\r\n    \r\n    <mat-card-content>\r\n        <ng-container #fieldComponent></ng-container>\r\n    </mat-card-content>    \r\n</mat-card>", dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCardWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCardWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-card-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCardModule], template: "<mat-card class=\"dark:bg-white/5\">\r\n    @if(props.label){\r\n        <mat-card-title class=\"p-4\">{{ props.label }}</mat-card-title>\r\n    }\r\n    \r\n    <mat-card-content>\r\n        <ng-container #fieldComponent></ng-container>\r\n    </mat-card-content>    \r\n</mat-card>" }]
         }] });
 
 class CmatExpansionWrapperComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatExpansionWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatExpansionWrapperComponent, isStandalone: true, selector: "cmat-expansion-wrapper", usesInheritance: true, ngImport: i0, template: "<mat-expansion-panel [expanded]=\"true\">\r\n    <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n            {{ to.label }}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n            {{ to.description }}\r\n        </mat-panel-description>\r\n    </mat-expansion-panel-header>\r\n    <ng-template #fieldComponent matExpansionPanelContent></ng-template>\r\n</mat-expansion-panel>", dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i1$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i1$1.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatExpansionWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatExpansionWrapperComponent, isStandalone: true, selector: "cmat-expansion-wrapper", usesInheritance: true, ngImport: i0, template: "<mat-expansion-panel [expanded]=\"true\">\r\n    <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n            {{ to.label }}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n            {{ to.description }}\r\n        </mat-panel-description>\r\n    </mat-expansion-panel-header>\r\n    <ng-template #fieldComponent matExpansionPanelContent></ng-template>\r\n</mat-expansion-panel>", dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i1$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i1$1.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatExpansionWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatExpansionWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-expansion-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatExpansionModule], template: "<mat-expansion-panel [expanded]=\"true\">\r\n    <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n            {{ to.label }}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n            {{ to.description }}\r\n        </mat-panel-description>\r\n    </mat-expansion-panel-header>\r\n    <ng-template #fieldComponent matExpansionPanelContent></ng-template>\r\n</mat-expansion-panel>" }]
         }] });
 
 class CmatPanelWrapperComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatPanelWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatPanelWrapperComponent, isStandalone: true, selector: "cmat-panel-wrapper", usesInheritance: true, ngImport: i0, template: "<h3 class=\"px-2\">{{ to.label }}</h3>\r\n<div>\r\n    <ng-container #fieldComponent></ng-container>\r\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatPanelWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatPanelWrapperComponent, isStandalone: true, selector: "cmat-panel-wrapper", usesInheritance: true, ngImport: i0, template: "<h3 class=\"px-2\">{{ to.label }}</h3>\r\n<div>\r\n    <ng-container #fieldComponent></ng-container>\r\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatPanelWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatPanelWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-panel-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<h3 class=\"px-2\">{{ to.label }}</h3>\r\n<div>\r\n    <ng-container #fieldComponent></ng-container>\r\n</div>" }]
         }] });
@@ -223,10 +226,10 @@ class CmatFormFieldWrapperComponent extends FieldWrapper {
         delete this.field._formField;
         this._focusMonitor.stopMonitoring(this._elementRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatFormFieldWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatFormFieldWrapperComponent, isStandalone: true, selector: "cmat-form-field-wrapper", viewQueries: [{ propertyName: "formField", first: true, predicate: MatFormField, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field [hideRequiredMarker]=\"true\" [floatLabel]=\"$any(props.floatLabel)\" [appearance]=\"$any(props.appearance)\"\r\n    [subscriptSizing]=\"$any(props.subscriptSizing)\" [color]=\"props.color ?? 'primary'\">\r\n    <ng-container #fieldComponent></ng-container>\r\n    @if(props.label && props.hideLabel !== true){\r\n    <mat-label>\r\n        {{ props.label }}\r\n        @if(props.required && props.hideRequiredMarker !== true){\r\n        <span aria-hidden=\"true\" class=\"mat-form-field-required-marker mat-mdc-form-field-required-marker\">*</span>\r\n        }\r\n    </mat-label>\r\n    }\r\n\r\n    @if(props.textPrefix){\r\n    <ng-container matTextPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textPrefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.prefix){\r\n    <ng-container matPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.prefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.textSuffix){\r\n    <ng-container matTextSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textSuffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.suffix){\r\n    <ng-container matSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.suffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.showValidationMessage){\r\n    <mat-error>\r\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\r\n    </mat-error>\r\n    }\r\n\r\n    @if(props.description || props.hintStart){\r\n    <mat-hint>\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.description || props.hintStart }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n\r\n    @if(props.hintEnd){\r\n    <mat-hint align=\"end\">\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.hintEnd }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n</mat-form-field>\r\n\r\n<ng-template #stringOrTemplate let-content=\"content\">\r\n    @if(!content.createEmbeddedView){\r\n    <ng-container>{{ content }}</ng-container>\r\n    }@else {\r\n    <ng-container [ngTemplateOutlet]=\"content\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    }\r\n</ng-template>", styles: ["cmat-form-field-wrapper .mat-mdc-form-field,cmat-form-field-wrapper .mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatFormFieldWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatFormFieldWrapperComponent, isStandalone: true, selector: "cmat-form-field-wrapper", viewQueries: [{ propertyName: "formField", first: true, predicate: MatFormField, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field [hideRequiredMarker]=\"true\" [floatLabel]=\"$any(props.floatLabel)\" [appearance]=\"$any(props.appearance)\"\r\n    [subscriptSizing]=\"$any(props.subscriptSizing)\" [color]=\"props.color ?? 'primary'\">\r\n    <ng-container #fieldComponent></ng-container>\r\n    @if(props.label && props.hideLabel !== true){\r\n    <mat-label>\r\n        {{ props.label }}\r\n        @if(props.required && props.hideRequiredMarker !== true){\r\n        <span aria-hidden=\"true\" class=\"mat-form-field-required-marker mat-mdc-form-field-required-marker\">*</span>\r\n        }\r\n    </mat-label>\r\n    }\r\n\r\n    @if(props.textPrefix){\r\n    <ng-container matTextPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textPrefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.prefix){\r\n    <ng-container matPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.prefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.textSuffix){\r\n    <ng-container matTextSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textSuffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.suffix){\r\n    <ng-container matSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.suffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.showValidationMessage){\r\n    <mat-error>\r\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\r\n    </mat-error>\r\n    }\r\n\r\n    @if(props.description || props.hintStart){\r\n    <mat-hint>\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.description || props.hintStart }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n\r\n    @if(props.hintEnd){\r\n    <mat-hint align=\"end\">\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.hintEnd }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n</mat-form-field>\r\n\r\n<ng-template #stringOrTemplate let-content=\"content\">\r\n    @if(!content.createEmbeddedView){\r\n    <ng-container>{{ content }}</ng-container>\r\n    }@else {\r\n    <ng-container [ngTemplateOutlet]=\"content\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    }\r\n</ng-template>", styles: ["cmat-form-field-wrapper .mat-mdc-form-field,cmat-form-field-wrapper .mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatFormFieldWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatFormFieldWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-form-field-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MatFormFieldModule, ReactiveFormsModule, CommonModule, FormlyModule], template: "<mat-form-field [hideRequiredMarker]=\"true\" [floatLabel]=\"$any(props.floatLabel)\" [appearance]=\"$any(props.appearance)\"\r\n    [subscriptSizing]=\"$any(props.subscriptSizing)\" [color]=\"props.color ?? 'primary'\">\r\n    <ng-container #fieldComponent></ng-container>\r\n    @if(props.label && props.hideLabel !== true){\r\n    <mat-label>\r\n        {{ props.label }}\r\n        @if(props.required && props.hideRequiredMarker !== true){\r\n        <span aria-hidden=\"true\" class=\"mat-form-field-required-marker mat-mdc-form-field-required-marker\">*</span>\r\n        }\r\n    </mat-label>\r\n    }\r\n\r\n    @if(props.textPrefix){\r\n    <ng-container matTextPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textPrefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.prefix){\r\n    <ng-container matPrefix>\r\n        <ng-container [ngTemplateOutlet]=\"props.prefix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.textSuffix){\r\n    <ng-container matTextSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.textSuffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.suffix){\r\n    <ng-container matSuffix>\r\n        <ng-container [ngTemplateOutlet]=\"props.suffix\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    </ng-container>\r\n    }\r\n\r\n    @if(props.showValidationMessage){\r\n    <mat-error>\r\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\r\n    </mat-error>\r\n    }\r\n\r\n    @if(props.description || props.hintStart){\r\n    <mat-hint>\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.description || props.hintStart }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n\r\n    @if(props.hintEnd){\r\n    <mat-hint align=\"end\">\r\n        <ng-container [ngTemplateOutlet]=\"stringOrTemplate\" [ngTemplateOutletContext]=\"{ content: props.hintEnd }\">\r\n        </ng-container>\r\n    </mat-hint>\r\n    }\r\n</mat-form-field>\r\n\r\n<ng-template #stringOrTemplate let-content=\"content\">\r\n    @if(!content.createEmbeddedView){\r\n    <ng-container>{{ content }}</ng-container>\r\n    }@else {\r\n    <ng-container [ngTemplateOutlet]=\"content\" [ngTemplateOutletContext]=\"{ field: field }\"></ng-container>\r\n    }\r\n</ng-template>", styles: ["cmat-form-field-wrapper .mat-mdc-form-field,cmat-form-field-wrapper .mat-form-field{width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { formField: [{
@@ -297,10 +300,10 @@ class CmatButtonTypeComponent extends FieldType {
             console.error('Error executing function from string:', error);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatButtonTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatButtonTypeComponent, isStandalone: true, selector: "cmat-button-type", usesInheritance: true, ngImport: i0, template: "<button class=\"print:hidden\" matButton=\"filled\" [type]=\"props.type\" [color]=\"props.color\" [disabled]=\"disabled\" (click)=\"onClick($event)\">\r\n    {{ to.label }}\r\n</button>", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatButtonTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatButtonTypeComponent, isStandalone: true, selector: "cmat-button-type", usesInheritance: true, ngImport: i0, template: "<button class=\"print:hidden\" matButton=\"filled\" [type]=\"props.type\" [color]=\"props.color\" [disabled]=\"disabled\" (click)=\"onClick($event)\">\r\n    {{ to.label }}\r\n</button>", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatButtonTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatButtonTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-button-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatButtonModule], template: "<button class=\"print:hidden\" matButton=\"filled\" [type]=\"props.type\" [color]=\"props.color\" [disabled]=\"disabled\" (click)=\"onClick($event)\">\r\n    {{ to.label }}\r\n</button>" }]
         }], ctorParameters: () => [] });
@@ -359,10 +362,10 @@ class CmatCascadeTypeComponent extends FieldType {
         this._unsubscribeAll.next(void 0);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCascadeTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatCascadeTypeComponent, isStandalone: true, selector: "cmat-cascade-type", usesInheritance: true, ngImport: i0, template: "<cmat-cascade-list [formControl]=\"formControl\" [clearable]=\"props.clearable\" [fullLevels]=\"props.fullLevels\"\r\n    [changeOnSelect]=\"props.changeOnSelect\" [placeholder]=\"placeholder\" [options]=\"urlData\" [tabIndex]=\"props.tabindex\"\r\n    [required]=\"required\" [touchUi]=\"isHandSet\"></cmat-cascade-list>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatCascadeListComponent, selector: "cmat-cascade-list", inputs: ["id", "options", "clearable", "fullLevels", "changeOnSelect", "allowLabelValue", "touchUi", "placeholder", "value", "required", "disabled"], exportAs: ["cmatCascadeList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCascadeTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatCascadeTypeComponent, isStandalone: true, selector: "cmat-cascade-type", usesInheritance: true, ngImport: i0, template: "<cmat-cascade-list [formControl]=\"formControl\" [clearable]=\"props.clearable\" [fullLevels]=\"props.fullLevels\"\r\n    [changeOnSelect]=\"props.changeOnSelect\" [placeholder]=\"placeholder\" [options]=\"urlData\" [tabIndex]=\"props.tabindex\"\r\n    [required]=\"required\" [touchUi]=\"isHandSet\"></cmat-cascade-list>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatCascadeListComponent, selector: "cmat-cascade-list", inputs: ["id", "options", "clearable", "fullLevels", "changeOnSelect", "allowLabelValue", "touchUi", "placeholder", "value", "required", "disabled"], exportAs: ["cmatCascadeList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCascadeTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCascadeTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-cascade-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, CmatCascadeListComponent], template: "<cmat-cascade-list [formControl]=\"formControl\" [clearable]=\"props.clearable\" [fullLevels]=\"props.fullLevels\"\r\n    [changeOnSelect]=\"props.changeOnSelect\" [placeholder]=\"placeholder\" [options]=\"urlData\" [tabIndex]=\"props.tabindex\"\r\n    [required]=\"required\" [touchUi]=\"isHandSet\"></cmat-cascade-list>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
@@ -503,10 +506,10 @@ class CmatCheckListTypeComponent extends FieldType {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCheckListTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatCheckListTypeComponent, isStandalone: true, selector: "cmat-checklist-type", usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col\">\r\n  <div class=\"p-2\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n      {{ props.label }}\r\n      @if(props.required){\r\n      <span>*</span>\r\n      }\r\n    </legend>\r\n    }\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"w-full h-full rounded-sm border shadow-sm bg-card\" [tabIndex]=\"props.tabindex\">\r\n    <div class=\"flex items-center m-1 mr-2 min-h-12 print:hidden\">\r\n      @if (props.showAllCheck&&!props.disabled) {\r\n      <div>\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 m-1\" [color]=\"'primary'\" [checked]=\"isChecked\"\r\n          [indeterminate]=\"isIndeterminate\" (change)=\"allCheckChange($event.checked)\">\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      <div class=\"flex items-center w-full\">\r\n        <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\"></mat-icon>\r\n        <div class=\"ml-2\">\r\n          <input #query class=\"w-full min-w-0 py-1 border-none\" type=\"text\"\r\n            placeholder=\"\u8F93\u5165\u8FC7\u6EE4\u4FE1\u606F\" (input)=\"filterByQuery(query.value)\">\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"border-t overflow-y-auto scrollbar-custom\"\r\n      [ngClass]=\"props.controlMaxHeight?'max-h-64 sm:max-h-128 lg:max-h-64':''\">\r\n      @if ((filteredItems$ | async); as filteredItems) {\r\n      @if(filteredItems.length>0){\r\n      @for (data of filteredItems; track trackByFn($index, data)) {\r\n      <div role=\"presentation\" class=\"flex items-center pl-2 pr-4 py-2 cursor-pointer hover:bg-hover\" matRipple\r\n        (click)=\"toggleCheckList(data,$event)\">\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 pointer-events-none\" disableRipple [color]=\"'primary'\"\r\n          [checked]=\"isCheck(data)\" [value]=\"data\" [disabled]=\"data.disabled||props.disabled\">\r\n          <div class=\"flex flex-col flex-auto\">\r\n            <div class=\"font-medium leading-5 truncate\">{{data.label}}</div>\r\n          </div>\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      } @else {\r\n      <div\r\n        class=\"flex flex-auto flex-col items-center justify-center bg-slate-100 dark:bg-transparent h-64 sm:h-128 lg:h-64\">\r\n        <mat-icon class=\"icon-size-24\" [svgIcon]=\"'heroicons_outline:document-magnifying-glass'\"></mat-icon>\r\n        <div class=\"mt-4 text-2xl font-bold tracking-tight text-secondary\">\u6CA1\u6709\u6570\u636E!</div>\r\n      </div>\r\n      }\r\n      }\r\n    </div>\r\n  </div>\r\n</div>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCheckListTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatCheckListTypeComponent, isStandalone: true, selector: "cmat-checklist-type", usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col\">\r\n  <div class=\"p-2\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n      {{ props.label }}\r\n      @if(props.required){\r\n      <span>*</span>\r\n      }\r\n    </legend>\r\n    }\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"w-full h-full rounded-sm border shadow-sm bg-card\" [tabIndex]=\"props.tabindex\">\r\n    <div class=\"flex items-center m-1 mr-2 min-h-12 print:hidden\">\r\n      @if (props.showAllCheck&&!props.disabled) {\r\n      <div>\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 m-1\" [color]=\"'primary'\" [checked]=\"isChecked\"\r\n          [indeterminate]=\"isIndeterminate\" (change)=\"allCheckChange($event.checked)\">\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      <div class=\"flex items-center w-full\">\r\n        <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\"></mat-icon>\r\n        <div class=\"ml-2\">\r\n          <input #query class=\"w-full min-w-0 py-1 border-none\" type=\"text\"\r\n            placeholder=\"\u8F93\u5165\u8FC7\u6EE4\u4FE1\u606F\" (input)=\"filterByQuery(query.value)\">\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"border-t overflow-y-auto scrollbar-custom\"\r\n      [ngClass]=\"props.controlMaxHeight?'max-h-64 sm:max-h-128 lg:max-h-64':''\">\r\n      @if ((filteredItems$ | async); as filteredItems) {\r\n      @if(filteredItems.length>0){\r\n      @for (data of filteredItems; track trackByFn($index, data)) {\r\n      <div role=\"presentation\" class=\"flex items-center pl-2 pr-4 py-2 cursor-pointer hover:bg-hover\" matRipple\r\n        (click)=\"toggleCheckList(data,$event)\">\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 pointer-events-none\" disableRipple [color]=\"'primary'\"\r\n          [checked]=\"isCheck(data)\" [value]=\"data\" [disabled]=\"data.disabled||props.disabled\">\r\n          <div class=\"flex flex-col flex-auto\">\r\n            <div class=\"font-medium leading-5 truncate\">{{data.label}}</div>\r\n          </div>\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      } @else {\r\n      <div\r\n        class=\"flex flex-auto flex-col items-center justify-center bg-slate-100 dark:bg-transparent h-64 sm:h-128 lg:h-64\">\r\n        <mat-icon class=\"icon-size-24\" [svgIcon]=\"'heroicons_outline:document-magnifying-glass'\"></mat-icon>\r\n        <div class=\"mt-4 text-2xl font-bold tracking-tight text-secondary\">\u6CA1\u6709\u6570\u636E!</div>\r\n      </div>\r\n      }\r\n      }\r\n    </div>\r\n  </div>\r\n</div>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatCheckListTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatCheckListTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-checklist-type', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCheckboxModule, MatIconModule, NgClass, MatRippleModule, AsyncPipe], template: "<div class=\"flex flex-col\">\r\n  <div class=\"p-2\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n      {{ props.label }}\r\n      @if(props.required){\r\n      <span>*</span>\r\n      }\r\n    </legend>\r\n    }\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"w-full h-full rounded-sm border shadow-sm bg-card\" [tabIndex]=\"props.tabindex\">\r\n    <div class=\"flex items-center m-1 mr-2 min-h-12 print:hidden\">\r\n      @if (props.showAllCheck&&!props.disabled) {\r\n      <div>\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 m-1\" [color]=\"'primary'\" [checked]=\"isChecked\"\r\n          [indeterminate]=\"isIndeterminate\" (change)=\"allCheckChange($event.checked)\">\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      <div class=\"flex items-center w-full\">\r\n        <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\"></mat-icon>\r\n        <div class=\"ml-2\">\r\n          <input #query class=\"w-full min-w-0 py-1 border-none\" type=\"text\"\r\n            placeholder=\"\u8F93\u5165\u8FC7\u6EE4\u4FE1\u606F\" (input)=\"filterByQuery(query.value)\">\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"border-t overflow-y-auto scrollbar-custom\"\r\n      [ngClass]=\"props.controlMaxHeight?'max-h-64 sm:max-h-128 lg:max-h-64':''\">\r\n      @if ((filteredItems$ | async); as filteredItems) {\r\n      @if(filteredItems.length>0){\r\n      @for (data of filteredItems; track trackByFn($index, data)) {\r\n      <div role=\"presentation\" class=\"flex items-center pl-2 pr-4 py-2 cursor-pointer hover:bg-hover\" matRipple\r\n        (click)=\"toggleCheckList(data,$event)\">\r\n        <mat-checkbox class=\"flex items-center h-10 min-h-10 pointer-events-none\" disableRipple [color]=\"'primary'\"\r\n          [checked]=\"isCheck(data)\" [value]=\"data\" [disabled]=\"data.disabled||props.disabled\">\r\n          <div class=\"flex flex-col flex-auto\">\r\n            <div class=\"font-medium leading-5 truncate\">{{data.label}}</div>\r\n          </div>\r\n        </mat-checkbox>\r\n      </div>\r\n      }\r\n      } @else {\r\n      <div\r\n        class=\"flex flex-auto flex-col items-center justify-center bg-slate-100 dark:bg-transparent h-64 sm:h-128 lg:h-64\">\r\n        <mat-icon class=\"icon-size-24\" [svgIcon]=\"'heroicons_outline:document-magnifying-glass'\"></mat-icon>\r\n        <div class=\"mt-4 text-2xl font-bold tracking-tight text-secondary\">\u6CA1\u6709\u6570\u636E!</div>\r\n      </div>\r\n      }\r\n      }\r\n    </div>\r\n  </div>\r\n</div>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
@@ -550,19 +553,19 @@ class CmatChipsInputTypeComponent extends FieldType {
         this._unsubscribeAll.next(void 0);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatChipsInputTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatChipsInputTypeComponent, isStandalone: true, selector: "cmat-chips-input-type", usesInheritance: true, ngImport: i0, template: "<cmat-chip-input [hasAutocomplete]=\"props.hasAutocomplete??false\" [formControl]=\"formControl\"\r\n    [placeholder]=\"placeholder\" [selectableOptions]=\"autocompleteText\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-chip-input>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatChipInputComponent, selector: "cmat-chip-input", inputs: ["id", "selectableOptions", "hasAutocomplete", "outputIsString", "separatorKey", "placeholder", "value", "required", "disabled"], exportAs: ["cmatChipInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatChipsInputTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatChipsInputTypeComponent, isStandalone: true, selector: "cmat-chips-input-type", usesInheritance: true, ngImport: i0, template: "<cmat-chip-input [hasAutocomplete]=\"props.hasAutocomplete??false\" [formControl]=\"formControl\"\r\n    [placeholder]=\"placeholder\" [selectableOptions]=\"autocompleteText\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-chip-input>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatChipInputComponent, selector: "cmat-chip-input", inputs: ["id", "selectableOptions", "hasAutocomplete", "outputIsString", "separatorKey", "placeholder", "value", "required", "disabled"], exportAs: ["cmatChipInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatChipsInputTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatChipsInputTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-chips-input-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, CmatChipInputComponent], template: "<cmat-chip-input [hasAutocomplete]=\"props.hasAutocomplete??false\" [formControl]=\"formControl\"\r\n    [placeholder]=\"placeholder\" [selectableOptions]=\"autocompleteText\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-chip-input>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
 
 class CmatColorPickerTypeComponent extends FieldType$1 {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatColorPickerTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatColorPickerTypeComponent, isStandalone: true, selector: "cmat-color-picker-type", usesInheritance: true, ngImport: i0, template: "<cmat-material-color-picker [title]=\"props.label??''\" [formControl]=\"formControl\" [readonly]=\"disabled\"\r\n    [tabindex]=\"props.tabindex\"></cmat-material-color-picker>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatMaterialColorPickerComponent, selector: "cmat-material-color-picker", inputs: ["color", "title", "readonly"], outputs: ["colorChanged"], exportAs: ["cmatMaterialColorPicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatColorPickerTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatColorPickerTypeComponent, isStandalone: true, selector: "cmat-color-picker-type", usesInheritance: true, ngImport: i0, template: "<cmat-material-color-picker [title]=\"props.label??''\" [formControl]=\"formControl\" [readonly]=\"disabled\"\r\n    [tabindex]=\"props.tabindex\"></cmat-material-color-picker>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatMaterialColorPickerComponent, selector: "cmat-material-color-picker", inputs: ["color", "title", "readonly"], outputs: ["colorChanged"], exportAs: ["cmatMaterialColorPicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatColorPickerTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatColorPickerTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-color-picker-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, CmatMaterialColorPickerComponent], template: "<cmat-material-color-picker [title]=\"props.label??''\" [formControl]=\"formControl\" [readonly]=\"disabled\"\r\n    [tabindex]=\"props.tabindex\"></cmat-material-color-picker>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -578,10 +581,10 @@ class CmatDateRangeTypeComponent extends FieldType {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatDateRangeTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatDateRangeTypeComponent, isStandalone: true, selector: "cmat-date-range-type", usesInheritance: true, ngImport: i0, template: "<cmat-date-range [dateFormat]=\"props.dateFormat\" [timeFormat]=\"props.timeFormat\" [timeRange]=\"props.timeRange\" \r\n[formControl]=\"formControl\" [tabindex]=\"props.tabindex\" [readonly]=\"disabled\">\r\n</cmat-date-range>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatDateRangeComponent, selector: "cmat-date-range", inputs: ["controlClass", "initData", "readonly", "dateFormat", "timeFormat", "timeRange", "range"], outputs: ["rangeChanged"], exportAs: ["cmatDateRange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatDateRangeTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatDateRangeTypeComponent, isStandalone: true, selector: "cmat-date-range-type", usesInheritance: true, ngImport: i0, template: "<cmat-date-range [dateFormat]=\"props.dateFormat\" [timeFormat]=\"props.timeFormat\" [timeRange]=\"props.timeRange\" \r\n[formControl]=\"formControl\" [tabindex]=\"props.tabindex\" [readonly]=\"disabled\">\r\n</cmat-date-range>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatDateRangeComponent, selector: "cmat-date-range", inputs: ["controlClass", "initData", "readonly", "dateFormat", "timeFormat", "timeRange", "range"], outputs: ["rangeChanged"], exportAs: ["cmatDateRange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatDateRangeTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatDateRangeTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-date-range-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatDateRangeComponent, ReactiveFormsModule], template: "<cmat-date-range [dateFormat]=\"props.dateFormat\" [timeFormat]=\"props.timeFormat\" [timeRange]=\"props.timeRange\" \r\n[formControl]=\"formControl\" [tabindex]=\"props.tabindex\" [readonly]=\"disabled\">\r\n</cmat-date-range>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -618,10 +621,10 @@ class CmatDatepickerTypeComponent extends FieldType {
         this._unsubscribeAll.next(void 0);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatDatepickerTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatDatepickerTypeComponent, isStandalone: true, selector: "cmat-datepicker-type", usesInheritance: true, ngImport: i0, template: "@if(props.togglePosition==='left'){\r\n<cmat-datetimepicker-toggle matPrefix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}\r\n\r\n<cmat-datetimepicker #datetimePicker openOnFocus=\"true\" [startView]=\"props.startView\" [mode]=\"props.mode\"\r\n    [timeInterval]=\"props.timeInterval\" [twelvehour]=\"props.twelvehour\" [type]=\"props.type\"\r\n    [multiYearSelector]=\"props.multiYearSelector\" [timeInput]=\"props.timeInput\" [touchUi]=\"isHandSet\"\r\n    [disabled]=\"disabled\"></cmat-datetimepicker>\r\n\r\n<input autocomplete=\"false\" matInput [cmatDatetimepicker]=\"datetimePicker\" [required]=\"required\"\r\n    [formControl]=\"formControl\" [placeholder]=\"placeholder\" />\r\n\r\n@if(props.togglePosition==='right'){\r\n<cmat-datetimepicker-toggle matSuffix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}", styles: [":host{width:100%;display:flex}\n"], dependencies: [{ kind: "component", type: CmatDatetimepickerToggleComponent, selector: "cmat-datetimepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disableRipple", "disabled"], exportAs: ["cmatDatetimepickerToggle"] }, { kind: "directive", type: CmatDatetimepickerInputDirective, selector: "input[cmatDatetimepicker]", inputs: ["cmatDatetimepicker", "cmatDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["cmatDatepickerInput"] }, { kind: "component", type: CmatDatetimepickerComponent, selector: "cmat-datetimepicker", inputs: ["startView", "mode", "timeInterval", "preventSameDateTimeSelection", "xPosition", "yPosition", "multiYearSelector", "twelvehour", "panelClass", "opened", "color", "startAt", "type", "timeInput", "touchUi", "disabled", "restoreFocus"], outputs: ["selectedChanged", "openedStream", "closedStream", "viewChanged"], exportAs: ["cmatDatetimepicker"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatDatepickerTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatDatepickerTypeComponent, isStandalone: true, selector: "cmat-datepicker-type", usesInheritance: true, ngImport: i0, template: "@if(props.togglePosition==='left'){\r\n<cmat-datetimepicker-toggle matPrefix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}\r\n\r\n<cmat-datetimepicker #datetimePicker openOnFocus=\"true\" [startView]=\"props.startView\" [mode]=\"props.mode\"\r\n    [timeInterval]=\"props.timeInterval\" [twelvehour]=\"props.twelvehour\" [type]=\"props.type\"\r\n    [multiYearSelector]=\"props.multiYearSelector\" [timeInput]=\"props.timeInput\" [touchUi]=\"isHandSet\"\r\n    [disabled]=\"disabled\"></cmat-datetimepicker>\r\n\r\n<input autocomplete=\"false\" matInput [cmatDatetimepicker]=\"datetimePicker\" [required]=\"required\"\r\n    [formControl]=\"formControl\" [placeholder]=\"placeholder\" />\r\n\r\n@if(props.togglePosition==='right'){\r\n<cmat-datetimepicker-toggle matSuffix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}", styles: [":host{width:100%;display:flex}\n"], dependencies: [{ kind: "component", type: CmatDatetimepickerToggleComponent, selector: "cmat-datetimepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disableRipple", "disabled"], exportAs: ["cmatDatetimepickerToggle"] }, { kind: "directive", type: CmatDatetimepickerInputDirective, selector: "input[cmatDatetimepicker]", inputs: ["cmatDatetimepicker", "cmatDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["cmatDatepickerInput"] }, { kind: "component", type: CmatDatetimepickerComponent, selector: "cmat-datetimepicker", inputs: ["startView", "mode", "timeInterval", "preventSameDateTimeSelection", "xPosition", "yPosition", "multiYearSelector", "twelvehour", "panelClass", "opened", "color", "startAt", "type", "timeInput", "touchUi", "disabled", "restoreFocus"], outputs: ["selectedChanged", "openedStream", "closedStream", "viewChanged"], exportAs: ["cmatDatetimepicker"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatDatepickerTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatDatepickerTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-datepicker-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatDatetimepickerToggleComponent, CmatDatetimepickerInputDirective, CmatDatetimepickerComponent, MatInputModule, FormsModule, ReactiveFormsModule], template: "@if(props.togglePosition==='left'){\r\n<cmat-datetimepicker-toggle matPrefix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}\r\n\r\n<cmat-datetimepicker #datetimePicker openOnFocus=\"true\" [startView]=\"props.startView\" [mode]=\"props.mode\"\r\n    [timeInterval]=\"props.timeInterval\" [twelvehour]=\"props.twelvehour\" [type]=\"props.type\"\r\n    [multiYearSelector]=\"props.multiYearSelector\" [timeInput]=\"props.timeInput\" [touchUi]=\"isHandSet\"\r\n    [disabled]=\"disabled\"></cmat-datetimepicker>\r\n\r\n<input autocomplete=\"false\" matInput [cmatDatetimepicker]=\"datetimePicker\" [required]=\"required\"\r\n    [formControl]=\"formControl\" [placeholder]=\"placeholder\" />\r\n\r\n@if(props.togglePosition==='right'){\r\n<cmat-datetimepicker-toggle matSuffix [for]=\"datetimePicker\" [disabled]=\"disabled\"></cmat-datetimepicker-toggle>\r\n}", styles: [":host{width:100%;display:flex}\n"] }]
         }], ctorParameters: () => [] });
@@ -693,10 +696,10 @@ class CmatMultiCheckboxTypeComponent extends FieldType {
     trackByFn(index) {
         return index;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatMultiCheckboxTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatMultiCheckboxTypeComponent, isStandalone: true, selector: "cmat-multicheckbox-type", viewQueries: [{ propertyName: "checkboxes", predicate: MatCheckbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ((urlData$ | async); as urlData) {\r\n@for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\ntrackByFn($index)) {\r\n<mat-checkbox [tabIndex]=\"props.tabindex\" [color]=\"props.color\" [labelPosition]=\"props.labelPosition\"\r\n    [checked]=\"isChecked(option)\" [disabled]=\"formControl.disabled || option.disabled\"\r\n    (change)=\"onChange(option.value, $event.checked)\">\r\n    {{ option.label }}\r\n</mat-checkbox>\r\n}\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: FormlySelectModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2$2.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatMultiCheckboxTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatMultiCheckboxTypeComponent, isStandalone: true, selector: "cmat-multicheckbox-type", viewQueries: [{ propertyName: "checkboxes", predicate: MatCheckbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ((urlData$ | async); as urlData) {\r\n@for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\ntrackByFn($index)) {\r\n<mat-checkbox [tabIndex]=\"props.tabindex\" [color]=\"props.color\" [labelPosition]=\"props.labelPosition\"\r\n    [checked]=\"isChecked(option)\" [disabled]=\"formControl.disabled || option.disabled\"\r\n    (change)=\"onChange(option.value, $event.checked)\">\r\n    {{ option.label }}\r\n</mat-checkbox>\r\n}\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: FormlySelectModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2$2.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatMultiCheckboxTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatMultiCheckboxTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-multicheckbox-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCheckboxModule, AsyncPipe, FormlySelectModule], template: "@if ((urlData$ | async); as urlData) {\r\n@for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\ntrackByFn($index)) {\r\n<mat-checkbox [tabIndex]=\"props.tabindex\" [color]=\"props.color\" [labelPosition]=\"props.labelPosition\"\r\n    [checked]=\"isChecked(option)\" [disabled]=\"formControl.disabled || option.disabled\"\r\n    (change)=\"onChange(option.value, $event.checked)\">\r\n    {{ option.label }}\r\n</mat-checkbox>\r\n}\r\n}", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { checkboxes: [{
@@ -715,10 +718,10 @@ class CmatNumberTypeComponent extends FieldType {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatNumberTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatNumberTypeComponent, isStandalone: true, selector: "cmat-number-type", usesInheritance: true, ngImport: i0, template: "<input matInput cmatDigitOnly [formControl]=\"formControl\" [readonly]=\"props.readonly\" [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\" [decimal]=\"props.decimal\" [allowNegatives]=\"true\" [allowPaste]=\"true\"\r\n    [min]=\"props.min\" [max]=\"props.max\" [errorStateMatcher]=\"errorStateMatcher\">\r\n\r\n", styles: [":host{width:100%}\n"], dependencies: [{ kind: "directive", type: CmatDigitOnlyDirective, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatNumberTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatNumberTypeComponent, isStandalone: true, selector: "cmat-number-type", usesInheritance: true, ngImport: i0, template: "<input matInput cmatDigitOnly [formControl]=\"formControl\" [readonly]=\"props.readonly\" [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\" [decimal]=\"props.decimal\" [allowNegatives]=\"true\" [allowPaste]=\"true\"\r\n    [min]=\"props.min\" [max]=\"props.max\" [errorStateMatcher]=\"errorStateMatcher\">\r\n\r\n", styles: [":host{width:100%}\n"], dependencies: [{ kind: "directive", type: CmatDigitOnlyDirective, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatNumberTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatNumberTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-number-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatDigitOnlyDirective, MatInputModule, ReactiveFormsModule], template: "<input matInput cmatDigitOnly [formControl]=\"formControl\" [readonly]=\"props.readonly\" [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\" [decimal]=\"props.decimal\" [allowNegatives]=\"true\" [allowPaste]=\"true\"\r\n    [min]=\"props.min\" [max]=\"props.max\" [errorStateMatcher]=\"errorStateMatcher\">\r\n\r\n", styles: [":host{width:100%}\n"] }]
         }] });
@@ -735,10 +738,10 @@ class CmatRatingTypeComponent extends FieldType {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRatingTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatRatingTypeComponent, isStandalone: true, selector: "cmat-rating-type", usesInheritance: true, ngImport: i0, template: "@if(props.customColor&&props.customColor.indexOf('#')>-1){\r\n<div [ngStyle]=\"{'color': props.customColor}\">\r\n    <cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\"\r\n        [readonly]=\"props.readonly\" [hover]=\"props.hover\" [half]=\"props.half\" [showMode]=\"props.showMode\"></cmat-rating>\r\n</div>\r\n}@else{\r\n<cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\" [readonly]=\"props.readonly\"\r\n    [hover]=\"props.hover\" [half]=\"props.half\" [color]=\"props.customColor\" [showMode]=\"props.showMode\"></cmat-rating>\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatRatingComponent, selector: "cmat-rating", inputs: ["id", "stars", "readonly", "hover", "half", "color", "showMode", "placeholder", "value", "required", "disabled"], outputs: ["valueChange"], exportAs: ["cmatRating"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRatingTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatRatingTypeComponent, isStandalone: true, selector: "cmat-rating-type", usesInheritance: true, ngImport: i0, template: "@if(props.customColor&&props.customColor.indexOf('#')>-1){\r\n<div [ngStyle]=\"{'color': props.customColor}\">\r\n    <cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\"\r\n        [readonly]=\"props.readonly\" [hover]=\"props.hover\" [half]=\"props.half\" [showMode]=\"props.showMode\"></cmat-rating>\r\n</div>\r\n}@else{\r\n<cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\" [readonly]=\"props.readonly\"\r\n    [hover]=\"props.hover\" [half]=\"props.half\" [color]=\"props.customColor\" [showMode]=\"props.showMode\"></cmat-rating>\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatRatingComponent, selector: "cmat-rating", inputs: ["id", "stars", "readonly", "hover", "half", "color", "showMode", "placeholder", "value", "required", "disabled"], outputs: ["valueChange"], exportAs: ["cmatRating"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRatingTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRatingTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-rating-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatRatingComponent, ReactiveFormsModule, NgStyle], template: "@if(props.customColor&&props.customColor.indexOf('#')>-1){\r\n<div [ngStyle]=\"{'color': props.customColor}\">\r\n    <cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\"\r\n        [readonly]=\"props.readonly\" [hover]=\"props.hover\" [half]=\"props.half\" [showMode]=\"props.showMode\"></cmat-rating>\r\n</div>\r\n}@else{\r\n<cmat-rating [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [stars]=\"props.stars\" [readonly]=\"props.readonly\"\r\n    [hover]=\"props.hover\" [half]=\"props.half\" [color]=\"props.customColor\" [showMode]=\"props.showMode\"></cmat-rating>\r\n}", styles: [":host{width:100%}\n"] }]
         }] });
@@ -806,10 +809,10 @@ class CmatRadioTypeComponent extends FieldType {
     trackByFn(index) {
         return index;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRadioTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatRadioTypeComponent, isStandalone: true, selector: "cmat-radio-type", viewQueries: [{ propertyName: "radioGroup", first: true, predicate: MatRadioGroup, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-radio-group [formControl]=\"formControl\" [required]=\"required\" [tabindex]=\"props.tabindex\">\r\n    @if ((urlData$ | async); as urlData) {\r\n    @for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\n    trackByFn($index)) {\r\n    <mat-radio-button [color]=\"props.color\" [labelPosition]=\"props.labelPosition\" [disabled]=\"option.disabled\"\r\n        [value]=\"option.value\">\r\n        {{ option.label }}\r\n    </mat-radio-button>\r\n    }\r\n    }\r\n</mat-radio-group>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i1$7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: FormlySelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2$2.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRadioTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatRadioTypeComponent, isStandalone: true, selector: "cmat-radio-type", viewQueries: [{ propertyName: "radioGroup", first: true, predicate: MatRadioGroup, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-radio-group [formControl]=\"formControl\" [required]=\"required\" [tabindex]=\"props.tabindex\">\r\n    @if ((urlData$ | async); as urlData) {\r\n    @for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\n    trackByFn($index)) {\r\n    <mat-radio-button [color]=\"props.color\" [labelPosition]=\"props.labelPosition\" [disabled]=\"option.disabled\"\r\n        [value]=\"option.value\">\r\n        {{ option.label }}\r\n    </mat-radio-button>\r\n    }\r\n    }\r\n</mat-radio-group>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i1$7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: FormlySelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2$2.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRadioTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRadioTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-radio-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatRadioModule, AsyncPipe, FormlySelectModule, ReactiveFormsModule], template: "<mat-radio-group [formControl]=\"formControl\" [required]=\"required\" [tabindex]=\"props.tabindex\">\r\n    @if ((urlData$ | async); as urlData) {\r\n    @for (option of (urlData.length > 0 ? urlData : (props.options | formlySelectOptions : field | async)); track\r\n    trackByFn($index)) {\r\n    <mat-radio-button [color]=\"props.color\" [labelPosition]=\"props.labelPosition\" [disabled]=\"option.disabled\"\r\n        [value]=\"option.value\">\r\n        {{ option.label }}\r\n    </mat-radio-button>\r\n    }\r\n    }\r\n</mat-radio-group>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { radioGroup: [{
@@ -826,10 +829,10 @@ class CmatRepeatTypeComponent extends FieldArrayType {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRepeatTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatRepeatTypeComponent, isStandalone: true, selector: "cmat-repeat-type", usesInheritance: true, ngImport: i0, template: "<div class=\"mb-2\" [tabIndex]=\"props.tabindex\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n        {{ props.label }}\r\n        @if(props.required){\r\n        <span>*</span>\r\n        }\r\n    </legend>\r\n    }\r\n\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n\r\n    <div class=\"mb-2 h-1 border-solid border-b-2\"></div>\r\n    <div class=\"flex flex-col repeat-body\">\r\n        @for (field of field.fieldGroup; track $index) {\r\n        <div class=\"flex flex-row repeat-item\">\r\n            <formly-field class=\"repeat-field\" [field]=\"field\"></formly-field>\r\n            @if(!props.disabled){\r\n            <div class=\"flex items-center pl-2 print:hidden\">\r\n                <button matIconButton  color=\"warn\" matTooltip=\"\u5220\u9664\" (click)=\"remove($index)\">\r\n                    <mat-icon color=\"warn\" [svgIcon]=\"'heroicons_outline:trash'\"></mat-icon>\r\n                </button>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"mt-2 print:hidden\">\r\n        <button matButton=\"filled\" color=\"primary\" (click)=\"add()\">{{ props.addText}}</button>\r\n    </div>\r\n    }\r\n\r\n</div>", styles: [":host{width:100%}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-infix .mat-mdc-floating-label{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-text-field-wrapper{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRepeatTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatRepeatTypeComponent, isStandalone: true, selector: "cmat-repeat-type", usesInheritance: true, ngImport: i0, template: "<div class=\"mb-2\" [tabIndex]=\"props.tabindex\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n        {{ props.label }}\r\n        @if(props.required){\r\n        <span>*</span>\r\n        }\r\n    </legend>\r\n    }\r\n\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n\r\n    <div class=\"mb-2 h-1 border-solid border-b-2\"></div>\r\n    <div class=\"flex flex-col repeat-body\">\r\n        @for (field of field.fieldGroup; track $index) {\r\n        <div class=\"flex flex-row repeat-item\">\r\n            <formly-field class=\"repeat-field\" [field]=\"field\"></formly-field>\r\n            @if(!props.disabled){\r\n            <div class=\"flex items-center pl-2 print:hidden\">\r\n                <button matIconButton  color=\"warn\" matTooltip=\"\u5220\u9664\" (click)=\"remove($index)\">\r\n                    <mat-icon color=\"warn\" [svgIcon]=\"'heroicons_outline:trash'\"></mat-icon>\r\n                </button>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"mt-2 print:hidden\">\r\n        <button matButton=\"filled\" color=\"primary\" (click)=\"add()\">{{ props.addText}}</button>\r\n    </div>\r\n    }\r\n\r\n</div>", styles: [":host{width:100%}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-infix .mat-mdc-floating-label{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-text-field-wrapper{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatRepeatTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatRepeatTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-repeat-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormlyModule, MatIconModule, MatButtonModule], template: "<div class=\"mb-2\" [tabIndex]=\"props.tabindex\">\r\n    @if(props.label){\r\n    <legend class=\"text-lg\">\r\n        {{ props.label }}\r\n        @if(props.required){\r\n        <span>*</span>\r\n        }\r\n    </legend>\r\n    }\r\n\r\n    @if(props.description){\r\n    <p>{{ props.description }}</p>\r\n    }\r\n\r\n    <div class=\"mb-2 h-1 border-solid border-b-2\"></div>\r\n    <div class=\"flex flex-col repeat-body\">\r\n        @for (field of field.fieldGroup; track $index) {\r\n        <div class=\"flex flex-row repeat-item\">\r\n            <formly-field class=\"repeat-field\" [field]=\"field\"></formly-field>\r\n            @if(!props.disabled){\r\n            <div class=\"flex items-center pl-2 print:hidden\">\r\n                <button matIconButton  color=\"warn\" matTooltip=\"\u5220\u9664\" (click)=\"remove($index)\">\r\n                    <mat-icon color=\"warn\" [svgIcon]=\"'heroicons_outline:trash'\"></mat-icon>\r\n                </button>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"mt-2 print:hidden\">\r\n        <button matButton=\"filled\" color=\"primary\" (click)=\"add()\">{{ props.addText}}</button>\r\n    </div>\r\n    }\r\n\r\n</div>", styles: [":host{width:100%}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-infix .mat-mdc-floating-label{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .repeat-body .repeat-item:not(:first-child) .repeat-field .mat-mdc-text-field-wrapper{margin-top:8px}\n"] }]
         }] });
@@ -979,10 +982,10 @@ class CmatSelectTypeComponent extends FieldType {
     compareWithFn(o1, o2) {
         return o1 && o2 ? o1?.label === o2?.label && o1?.value === o2?.value : o1 === o2;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatSelectTypeComponent, isStandalone: true, selector: "cmat-select-search-type", usesInheritance: true, ngImport: i0, template: "@if(props.multiple){\r\n<mat-select #multiSelect multiple [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}@else {\r\n<mat-select #multiSelect [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$8.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$8.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1$8.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: CmatSelectSearchComponent, selector: "cmat-select-search", inputs: ["placeholderLabel", "type", "noEntriesFoundLabel", "showNoFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"], exportAs: ["cmatSelectSearch"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatSelectTypeComponent, isStandalone: true, selector: "cmat-select-search-type", usesInheritance: true, ngImport: i0, template: "@if(props.multiple){\r\n<mat-select #multiSelect multiple [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}@else {\r\n<mat-select #multiSelect [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$8.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$8.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1$8.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: CmatSelectSearchComponent, selector: "cmat-select-search", inputs: ["placeholderLabel", "type", "noEntriesFoundLabel", "showNoFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"], exportAs: ["cmatSelectSearch"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-search-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCheckboxModule, MatSelectModule, CmatSelectSearchComponent, ReactiveFormsModule, AsyncPipe], template: "@if(props.multiple){\r\n<mat-select #multiSelect multiple [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}@else {\r\n<mat-select #multiSelect [id]=\"id\" [formControl]=\"formControl\" [placeholder]=\"props.placeholder??''\"\r\n    [required]=\"required\" [tabIndex]=\"props.tabindex\" [compareWith]=\"compareWithFn\"\r\n    [errorStateMatcher]=\"errorStateMatcher\" [aria-label]=\"getAriaLabel()\" [aria-labelledby]=\"getAriaLabelledby()\"\r\n    [disableOptionCentering]=\"props.disableOptionCentering\"\r\n    [typeaheadDebounceInterval]=\"props.typeaheadDebounceInterval\"\r\n    [panelClass]=\"'overflow-y-auto scrollbar-custom'\">\r\n    @if ((filteredCustomDetails | async); as customDetails) {\r\n    @if (props.search) {\r\n    <mat-option>\r\n        <cmat-select-search [formControl]=\"multiFilterCtrl\" [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\"\r\n            [toggleAllCheckboxIndeterminate]=\"isIndeterminate\" [toggleAllCheckboxChecked]=\"isChecked\"\r\n            (toggleAll)=\"toggleSelectAll($event)\">\r\n        </cmat-select-search>\r\n    </mat-option>\r\n    }\r\n    @if (customDetails?.length!==0&&props.canNull&&!props.multiple) {\r\n    <mat-option>\u7A7A</mat-option>\r\n    }\r\n    @for (i of customDetails; track $index) {\r\n    @if(i.label){\r\n    @if(i.group){\r\n    <mat-optgroup [label]=\"i.label\">\r\n        @for (child of i.group; track $index) {\r\n        <mat-option [value]=\"child\" [disabled]=\"child.disabled\">\r\n            {{ child.label }}\r\n        </mat-option>\r\n        }\r\n    </mat-optgroup>\r\n    }@else {\r\n    <mat-option [value]=\"i\" [disabled]=\"i.disabled\">{{i.label}}</mat-option>\r\n    }\r\n    }@else {\r\n    <mat-option [value]=\"i\">{{i}}</mat-option>\r\n    }\r\n    }\r\n    }\r\n</mat-select>\r\n}", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
@@ -1037,10 +1040,10 @@ class CmatSelectTreeTypeComponent extends FieldType$1 {
         this._unsubscribeAll.next(void 0);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTreeTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatSelectTreeTypeComponent, isStandalone: true, selector: "cmat-select-tree-type", usesInheritance: true, ngImport: i0, template: "<cmat-select-tree [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\" [expandable]=\"props.expandable\" [placeholder]=\"placeholder\"\r\n    [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-tree>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatSelectTreeComponent, selector: "cmat-select-tree", inputs: ["id", "dataSource", "noEntriesFoundLabel", "showNoFoundLabel", "multiple", "overallSearchEnabled", "canNull", "customTriggerLabelFn", "customTriggerLabelTemplate", "expandable", "showToggleAllCheckbox", "compareWith", "placeholder", "value", "required", "disabled"], exportAs: ["cmatSelectTree"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTreeTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatSelectTreeTypeComponent, isStandalone: true, selector: "cmat-select-tree-type", usesInheritance: true, ngImport: i0, template: "<cmat-select-tree [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\" [expandable]=\"props.expandable\" [placeholder]=\"placeholder\"\r\n    [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-tree>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatSelectTreeComponent, selector: "cmat-select-tree", inputs: ["id", "dataSource", "noEntriesFoundLabel", "showNoFoundLabel", "multiple", "overallSearchEnabled", "canNull", "customTriggerLabelFn", "customTriggerLabelTemplate", "expandable", "showToggleAllCheckbox", "compareWith", "placeholder", "value", "required", "disabled"], exportAs: ["cmatSelectTree"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTreeTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTreeTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-tree-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, CmatSelectTreeComponent], template: "<cmat-select-tree [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [showToggleAllCheckbox]=\"props.showToggleAllCheckbox\" [expandable]=\"props.expandable\" [placeholder]=\"placeholder\"\r\n    [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-tree>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
@@ -1093,10 +1096,10 @@ class CmatSelectTableTypeComponent extends FieldType$1 {
         this._unsubscribeAll.next(void 0);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTableTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatSelectTableTypeComponent, isStandalone: true, selector: "cmat-select-table-type", usesInheritance: true, ngImport: i0, template: "<cmat-select-table [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-table>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatSelectTableComponent, selector: "cmat-select-table", inputs: ["id", "dataSource", "noEntriesFoundLabel", "showNoFoundLabel", "isPhone", "multiple", "overallSearchEnabled", "overallSearchVisible", "resetSortOnOpen", "resetFiltersOnOpen", "customTriggerLabelFn", "triggerLabelSort", "customTriggerLabelTemplate", "canNull", "defaultSort", "resetOptionAction", "keyParam", "compareWith", "placeholder", "value", "required", "disabled"], outputs: ["closed"], exportAs: ["cmatSelectTable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTableTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatSelectTableTypeComponent, isStandalone: true, selector: "cmat-select-table-type", usesInheritance: true, ngImport: i0, template: "<cmat-select-table [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-table>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: CmatSelectTableComponent, selector: "cmat-select-table", inputs: ["id", "dataSource", "noEntriesFoundLabel", "showNoFoundLabel", "isPhone", "multiple", "overallSearchEnabled", "overallSearchVisible", "resetSortOnOpen", "resetFiltersOnOpen", "customTriggerLabelFn", "triggerLabelSort", "customTriggerLabelTemplate", "canNull", "defaultSort", "resetOptionAction", "keyParam", "compareWith", "placeholder", "value", "required", "disabled"], outputs: ["closed"], exportAs: ["cmatSelectTable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSelectTableTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSelectTableTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-table-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, CmatSelectTableComponent], template: "<cmat-select-table [formControl]=\"formControl\" [dataSource]=\"urlData\" [customTriggerLabelTemplate]=\"'${name}'\"\r\n    [multiple]=\"props.multiple\" [overallSearchEnabled]=\"props.search\" [canNull]=\"props.canNull\"\r\n    [placeholder]=\"placeholder\" [tabIndex]=\"props.tabindex\" [required]=\"required\"></cmat-select-table>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
@@ -1110,10 +1113,10 @@ class CmatStepperHorizontalTypeComponent extends FieldType$2 {
         }
         return field.fieldGroup ? field.fieldGroup.every(f => this.isValid(f)) : true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatStepperHorizontalTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatStepperHorizontalTypeComponent, isStandalone: true, selector: "cmat-stepper-horizontal-type", usesInheritance: true, ngImport: i0, template: "<mat-horizontal-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index !== 0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n\r\n</mat-horizontal-stepper>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$3.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$3.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$3.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i2$3.MatStepperNext, selector: "button[matStepperNext]" }, { kind: "directive", type: i2$3.MatStepperPrevious, selector: "button[matStepperPrevious]" }, { kind: "directive", type: i2$3.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: ReactiveFormsModule }, { 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.1", ngImport: i0, type: CmatStepperHorizontalTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatStepperHorizontalTypeComponent, isStandalone: true, selector: "cmat-stepper-horizontal-type", usesInheritance: true, ngImport: i0, template: "<mat-horizontal-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index !== 0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n\r\n</mat-horizontal-stepper>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$3.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$3.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$3.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i2$3.MatStepperNext, selector: "button[matStepperNext]" }, { kind: "directive", type: i2$3.MatStepperPrevious, selector: "button[matStepperPrevious]" }, { kind: "directive", type: i2$3.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: ReactiveFormsModule }, { 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.0", ngImport: i0, type: CmatStepperHorizontalTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatStepperHorizontalTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-stepper-horizontal-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormlyModule, MatStepperModule, MatButtonModule, ReactiveFormsModule, MatIconModule], template: "<mat-horizontal-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index !== 0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n\r\n</mat-horizontal-stepper>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1127,10 +1130,10 @@ class CmatStepperVerticalTypeComponent extends FieldType$2 {
         }
         return field.fieldGroup ? field.fieldGroup.every(f => this.isValid(f)) : true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatStepperVerticalTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatStepperVerticalTypeComponent, isStandalone: true, selector: "cmat-stepper-vertical-type", usesInheritance: true, ngImport: i0, template: "<mat-vertical-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index!==0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n</mat-vertical-stepper>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$3.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$3.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$3.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i2$3.MatStepperNext, selector: "button[matStepperNext]" }, { kind: "directive", type: i2$3.MatStepperPrevious, selector: "button[matStepperPrevious]" }, { kind: "directive", type: i2$3.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: ReactiveFormsModule }, { 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.1", ngImport: i0, type: CmatStepperVerticalTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatStepperVerticalTypeComponent, isStandalone: true, selector: "cmat-stepper-vertical-type", usesInheritance: true, ngImport: i0, template: "<mat-vertical-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index!==0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n</mat-vertical-stepper>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }, { kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$3.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$3.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$3.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i2$3.MatStepperNext, selector: "button[matStepperNext]" }, { kind: "directive", type: i2$3.MatStepperPrevious, selector: "button[matStepperPrevious]" }, { kind: "directive", type: i2$3.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: ReactiveFormsModule }, { 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.0", ngImport: i0, type: CmatStepperVerticalTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatStepperVerticalTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-stepper-vertical-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormlyModule, MatStepperModule, MatButtonModule, ReactiveFormsModule, MatIconModule], template: "<mat-vertical-stepper [linear]=\"props.isLinear\" [tabIndex]=\"props.tabindex\">\r\n    <ng-template matStepperIcon=\"edit\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_solid:pencil'\"></mat-icon>\r\n    </ng-template>\r\n    <ng-template matStepperIcon=\"done\">\r\n        <mat-icon class=\"icon-size-4\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n    </ng-template>\r\n\r\n    @for (step of field.fieldGroup; track $index) {\r\n    <mat-step [stepControl]=\"step.formControl!\" [editable]=\"step.props?.isEditable||$last\" [optional]=\"step.props?.isOptional\">\r\n        <ng-template matStepLabel>{{ step.props?.label||'' }}</ng-template>\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"step\"></formly-field>\r\n        </div>\r\n\r\n        <div class=\"mt-2 flex flex-row gap-2\">\r\n            @if($index!==0){\r\n            <button matStepperPrevious matButton=\"filled\" color=\"primary\" type=\"button\">\u4E0A\u4E00\u6B65</button>\r\n            }\r\n\r\n            @if(!$last){\r\n            <button matStepperNext matButton=\"filled\" color=\"primary\" type=\"button\" [disabled]=\"!isValid(step)\">\r\n                \u4E0B\u4E00\u6B65\r\n            </button>\r\n            }\r\n        </div>\r\n    </mat-step>\r\n    }\r\n</mat-vertical-stepper>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1215,10 +1218,10 @@ class CmatTableTypeComponent extends FieldArrayType {
         this._changeDetectorRef.markForCheck();
         this._dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTableTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatTableTypeComponent, isStandalone: true, selector: "cmat-table-type", viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"relative flex flex-col sm:flex-row flex-none sm:items-center sm:justify-between p-2 border-b mb-1\">\r\n    <div>\r\n        @if(props.label){\r\n        <legend class=\"text-lg\">\r\n            {{ props.label }}\r\n            @if(props.required){\r\n            <span>*</span>\r\n            }\r\n        </legend>\r\n        }\r\n        @if(props.description){\r\n        <p>{{ props.description }}</p>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4 print:hidden\">\r\n        <button class=\"ml-4\" matButton=\"filled\" [color]=\"'primary'\" (click)=\"addRow()\">\r\n            <mat-icon [svgIcon]=\"'heroicons_outline:plus'\"></mat-icon>\r\n            <span class=\"ml-2\">{{props.addText}}</span>\r\n        </button>\r\n    </div>\r\n    }\r\n</div>\r\n\r\n\r\n<table #table mat-table class=\"w-full\" [dataSource]=\"model||[]\" [tabIndex]=\"props.tabindex\">\r\n    @for (column of columns; track $index) {\r\n    <ng-container [matColumnDef]=\"column.key\">\r\n        <th *matHeaderCellDef mat-header-cell> {{ column.label }} </th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell>\r\n            <div class=\" has-label-on-mobile\" [attr.data-label]=\"column.label +':'\">\r\n                {{element[column.key]}}\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n    }\r\n\r\n    <ng-container matColumnDef=\"operate\" stickyEnd>\r\n        <th *matHeaderCellDef mat-header-cell class=\"print:hidden\">\u64CD\u4F5C</th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell class=\"w-24 print:hidden\">\r\n            <div class=\"flex flex-col lg:w-full\">\r\n                <div class=\"relative flex flex-row gap-2 lg:m-2 justify-center\">\r\n                    <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u7F16\u8F91'\" (click)=\"editRow(element,i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"primary\" [svgIcon]=\"'heroicons_solid:pencil-square'\">\r\n                    </mat-icon>\r\n                </button>\r\n    \r\n                <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u79FB\u9664'\" (click)=\"deleteRow(i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"warn\" [svgIcon]=\"'heroicons_solid:trash'\"></mat-icon>\r\n                </button>\r\n                </div>\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n\r\n    <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row></tr>\r\n    <tr *matRowDef=\"let row; columns: displayedColumns;\" mat-row class=\"group\"></tr>\r\n</table>\r\n\r\n<ng-template #inlineTable>\r\n    <div class=\"overflow-y-auto scrollbar-custom w-full\">\r\n        <form [formGroup]=\"inlineform\">\r\n            <formly-form [fields]=\"fieldArray\" [model]=\"currentMode\" [form]=\"inlineform\"></formly-form>\r\n        </form>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogRef>\r\n    <div mat-dialog-title cdkDrag class=\"-mt-6\" cdkDragRootElement=\".cdk-overlay-pane\" cdkDragHandle>\r\n        <h2 class=\"pointer-events-none text-xl\">{{ props.label +'\u8BE6\u7EC6\u9875'}}</h2>\r\n    </div>\r\n\r\n    <mat-dialog-content>\r\n        <ng-container *ngTemplateOutlet=\"inlineTable\"></ng-container>\r\n    </mat-dialog-content>\r\n\r\n    <mat-dialog-actions>\r\n        <div class=\"w-full flex justify-end items-center\">\r\n            <button matButton=\"filled\" color=\"primary\" cdkFocusInitial (click)=\"confirm()\">\r\n                \u786E\u5B9A\r\n            </button>\r\n            <button matButton=\"outlined\" mat-dialog-close>\r\n                \u53D6\u6D88\r\n            </button>\r\n        </div>\r\n    </mat-dialog-actions>\r\n</ng-template>", styles: [":host{width:100%}.mat-column-operate{width:8rem;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyForm, selector: "formly-form" }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTableTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatTableTypeComponent, isStandalone: true, selector: "cmat-table-type", viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"relative flex flex-col sm:flex-row flex-none sm:items-center sm:justify-between p-2 border-b mb-1\">\r\n    <div>\r\n        @if(props.label){\r\n        <legend class=\"text-lg\">\r\n            {{ props.label }}\r\n            @if(props.required){\r\n            <span>*</span>\r\n            }\r\n        </legend>\r\n        }\r\n        @if(props.description){\r\n        <p>{{ props.description }}</p>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4 print:hidden\">\r\n        <button class=\"ml-4\" matButton=\"filled\" [color]=\"'primary'\" (click)=\"addRow()\">\r\n            <mat-icon [svgIcon]=\"'heroicons_outline:plus'\"></mat-icon>\r\n            <span class=\"ml-2\">{{props.addText}}</span>\r\n        </button>\r\n    </div>\r\n    }\r\n</div>\r\n\r\n\r\n<table #table mat-table class=\"w-full\" [dataSource]=\"model||[]\" [tabIndex]=\"props.tabindex\">\r\n    @for (column of columns; track $index) {\r\n    <ng-container [matColumnDef]=\"column.key\">\r\n        <th *matHeaderCellDef mat-header-cell> {{ column.label }} </th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell>\r\n            <div class=\" has-label-on-mobile\" [attr.data-label]=\"column.label +':'\">\r\n                {{element[column.key]}}\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n    }\r\n\r\n    <ng-container matColumnDef=\"operate\" stickyEnd>\r\n        <th *matHeaderCellDef mat-header-cell class=\"print:hidden\">\u64CD\u4F5C</th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell class=\"w-24 print:hidden\">\r\n            <div class=\"flex flex-col lg:w-full\">\r\n                <div class=\"relative flex flex-row gap-2 lg:m-2 justify-center\">\r\n                    <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u7F16\u8F91'\" (click)=\"editRow(element,i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"primary\" [svgIcon]=\"'heroicons_solid:pencil-square'\">\r\n                    </mat-icon>\r\n                </button>\r\n    \r\n                <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u79FB\u9664'\" (click)=\"deleteRow(i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"warn\" [svgIcon]=\"'heroicons_solid:trash'\"></mat-icon>\r\n                </button>\r\n                </div>\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n\r\n    <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row></tr>\r\n    <tr *matRowDef=\"let row; columns: displayedColumns;\" mat-row class=\"group\"></tr>\r\n</table>\r\n\r\n<ng-template #inlineTable>\r\n    <div class=\"overflow-y-auto scrollbar-custom w-full\">\r\n        <form [formGroup]=\"inlineform\">\r\n            <formly-form [fields]=\"fieldArray\" [model]=\"currentMode\" [form]=\"inlineform\"></formly-form>\r\n        </form>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogRef>\r\n    <div mat-dialog-title cdkDrag class=\"-mt-6\" cdkDragRootElement=\".cdk-overlay-pane\" cdkDragHandle>\r\n        <h2 class=\"pointer-events-none text-xl\">{{ props.label +'\u8BE6\u7EC6\u9875'}}</h2>\r\n    </div>\r\n\r\n    <mat-dialog-content>\r\n        <ng-container *ngTemplateOutlet=\"inlineTable\"></ng-container>\r\n    </mat-dialog-content>\r\n\r\n    <mat-dialog-actions>\r\n        <div class=\"w-full flex justify-end items-center\">\r\n            <button matButton=\"filled\" color=\"primary\" cdkFocusInitial (click)=\"confirm()\">\r\n                \u786E\u5B9A\r\n            </button>\r\n            <button matButton=\"outlined\" mat-dialog-close>\r\n                \u53D6\u6D88\r\n            </button>\r\n        </div>\r\n    </mat-dialog-actions>\r\n</ng-template>", styles: [":host{width:100%}.mat-column-operate{width:8rem;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.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: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyForm, selector: "formly-form" }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTableTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTableTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-table-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatButtonModule, MatIconModule, MatTableModule, FormsModule, FormlyModule, CdkDrag,
                         ReactiveFormsModule, MatDialogModule, NgTemplateOutlet, MatTooltipModule], template: "<div class=\"relative flex flex-col sm:flex-row flex-none sm:items-center sm:justify-between p-2 border-b mb-1\">\r\n    <div>\r\n        @if(props.label){\r\n        <legend class=\"text-lg\">\r\n            {{ props.label }}\r\n            @if(props.required){\r\n            <span>*</span>\r\n            }\r\n        </legend>\r\n        }\r\n        @if(props.description){\r\n        <p>{{ props.description }}</p>\r\n        }\r\n    </div>\r\n\r\n    @if(!props.disabled){\r\n    <div class=\"flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4 print:hidden\">\r\n        <button class=\"ml-4\" matButton=\"filled\" [color]=\"'primary'\" (click)=\"addRow()\">\r\n            <mat-icon [svgIcon]=\"'heroicons_outline:plus'\"></mat-icon>\r\n            <span class=\"ml-2\">{{props.addText}}</span>\r\n        </button>\r\n    </div>\r\n    }\r\n</div>\r\n\r\n\r\n<table #table mat-table class=\"w-full\" [dataSource]=\"model||[]\" [tabIndex]=\"props.tabindex\">\r\n    @for (column of columns; track $index) {\r\n    <ng-container [matColumnDef]=\"column.key\">\r\n        <th *matHeaderCellDef mat-header-cell> {{ column.label }} </th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell>\r\n            <div class=\" has-label-on-mobile\" [attr.data-label]=\"column.label +':'\">\r\n                {{element[column.key]}}\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n    }\r\n\r\n    <ng-container matColumnDef=\"operate\" stickyEnd>\r\n        <th *matHeaderCellDef mat-header-cell class=\"print:hidden\">\u64CD\u4F5C</th>\r\n        <td *matCellDef=\"let element; let i = index\" mat-cell class=\"w-24 print:hidden\">\r\n            <div class=\"flex flex-col lg:w-full\">\r\n                <div class=\"relative flex flex-row gap-2 lg:m-2 justify-center\">\r\n                    <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u7F16\u8F91'\" (click)=\"editRow(element,i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"primary\" [svgIcon]=\"'heroicons_solid:pencil-square'\">\r\n                    </mat-icon>\r\n                </button>\r\n    \r\n                <button type=\"button\" class=\"w-8 min-h-8 h-8 max-w-8 lg:opacity-0 lg:group-hover:opacity-100\"\r\n                    matIconButton  [matTooltip]=\"'\u79FB\u9664'\" (click)=\"deleteRow(i)\">\r\n                    <mat-icon class=\"icon-size-5\" color=\"warn\" [svgIcon]=\"'heroicons_solid:trash'\"></mat-icon>\r\n                </button>\r\n                </div>\r\n            </div>\r\n        </td>\r\n    </ng-container>\r\n\r\n    <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row></tr>\r\n    <tr *matRowDef=\"let row; columns: displayedColumns;\" mat-row class=\"group\"></tr>\r\n</table>\r\n\r\n<ng-template #inlineTable>\r\n    <div class=\"overflow-y-auto scrollbar-custom w-full\">\r\n        <form [formGroup]=\"inlineform\">\r\n            <formly-form [fields]=\"fieldArray\" [model]=\"currentMode\" [form]=\"inlineform\"></formly-form>\r\n        </form>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogRef>\r\n    <div mat-dialog-title cdkDrag class=\"-mt-6\" cdkDragRootElement=\".cdk-overlay-pane\" cdkDragHandle>\r\n        <h2 class=\"pointer-events-none text-xl\">{{ props.label +'\u8BE6\u7EC6\u9875'}}</h2>\r\n    </div>\r\n\r\n    <mat-dialog-content>\r\n        <ng-container *ngTemplateOutlet=\"inlineTable\"></ng-container>\r\n    </mat-dialog-content>\r\n\r\n    <mat-dialog-actions>\r\n        <div class=\"w-full flex justify-end items-center\">\r\n            <button matButton=\"filled\" color=\"primary\" cdkFocusInitial (click)=\"confirm()\">\r\n                \u786E\u5B9A\r\n            </button>\r\n            <button matButton=\"outlined\" mat-dialog-close>\r\n                \u53D6\u6D88\r\n            </button>\r\n        </div>\r\n    </mat-dialog-actions>\r\n</ng-template>", styles: [":host{width:100%}.mat-column-operate{width:8rem;text-align:center}\n"] }]
@@ -1231,10 +1234,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             }] } });
 
 class CmatTabTypeComponent extends FieldType$1 {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTabTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatTabTypeComponent, isStandalone: true, selector: "cmat-tab-type", usesInheritance: true, ngImport: i0, template: "<mat-tab-group [tabIndex]=\"props.tabindex\">\r\n    @for (tab of field.fieldGroup; track $index) {\r\n    <mat-tab [label]=\"tab.props?.label||''\" [disabled]=\"tab.props?.disabled\">\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"tab\"></formly-field>\r\n        </div>\r\n    </mat-tab>\r\n    }\r\n</mat-tab-group>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$9.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$9.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTabTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatTabTypeComponent, isStandalone: true, selector: "cmat-tab-type", usesInheritance: true, ngImport: i0, template: "<mat-tab-group [tabIndex]=\"props.tabindex\">\r\n    @for (tab of field.fieldGroup; track $index) {\r\n    <mat-tab [label]=\"tab.props?.label||''\" [disabled]=\"tab.props?.disabled\">\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"tab\"></formly-field>\r\n        </div>\r\n    </mat-tab>\r\n    }\r\n</mat-tab-group>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$9.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$9.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$3.LegacyFormlyField, selector: "formly-field" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTabTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTabTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-tab-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatTabsModule, FormlyModule], template: "<mat-tab-group [tabIndex]=\"props.tabindex\">\r\n    @for (tab of field.fieldGroup; track $index) {\r\n    <mat-tab [label]=\"tab.props?.label||''\" [disabled]=\"tab.props?.disabled\">\r\n        <div class=\"py-2\">\r\n            <formly-field [field]=\"tab\"></formly-field>\r\n        </div>\r\n    </mat-tab>\r\n    }\r\n</mat-tab-group>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1358,10 +1361,10 @@ class CmatTagsTypeComponent extends FieldType {
     isCheck(tag) {
         return this.formControl.value?.filter((i) => i.value === tag.value).length > 0;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTagsTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CmatTagsTypeComponent, isStandalone: true, selector: "cmat-tags-type", viewQueries: [{ propertyName: "_tagsPanelOrigin", first: true, predicate: ["tagsPanelOrigin"], descendants: true }, { propertyName: "_tagsPanel", first: true, predicate: ["tagsPanel"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"text-lg mb-2\">\r\n    {{ props.label }}\r\n    @if(props.required){\r\n    <span>*</span>\r\n    }\r\n</div>\r\n<div class=\"flex flex-wrap items-center -m-2\" [tabIndex]=\"props.tabindex\">\r\n    <ng-container>\r\n        @for (selectedItem of formControl.value; track $index) {\r\n        <div\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700\">\r\n            <span class=\"text-md font-medium whitespace-nowrap\">{{selectedItem.label}}</span>\r\n        </div>\r\n        }\r\n\r\n        <div #tagsPanelOrigin\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 cursor-pointer text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700 print:hidden\" role=\"presentation\" (click)=\"openTagsPanel()\">\r\n\r\n            @if(formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:pencil-square'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u7F16\u8F91</span>\r\n            }\r\n\r\n            @if(!formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:plus-circle'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u65B0\u589E</span>\r\n            }\r\n\r\n            <ng-template #tagsPanel>\r\n                <div class=\"w-60 rounded-sm border shadow-md bg-card\">\r\n                    <div class=\"flex items-center m-3 mr-2\">\r\n                        <div class=\"flex items-center\">\r\n                            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\">\r\n                            </mat-icon>\r\n                            <div class=\"ml-2\">\r\n                                <input class=\"w-full min-w-0 py-1 border-none\" type=\"text\" placeholder=\"\u8F93\u5165\u6807\u7B7E\u540D\"\r\n                                    [maxLength]=\"30\" (input)=\"filterTags($event)\">\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"flex flex-col max-h-64 py-2 border-t overflow-y-auto scrollbar-custom\">\r\n                        @if ((filteredItems$ | async); as filteredItems) {\r\n                        @if(filteredItems.length>0){\r\n                        @for (tag of filteredItems; track $index) {\r\n                        <div role=\"presentation\"\r\n                            class=\"flex items-center h-10 min-h-10 pl-1 pr-4 cursor-pointer hover:bg-hover\"\r\n                            matRipple (click)=\"toggleTag(tag)\">\r\n                            <mat-checkbox class=\"flex items-center h-10 min-h-10\" [color]=\"'primary'\"\r\n                                [disabled]=\"tag.disabled\" [checked]=\"isCheck(tag)\">\r\n                                {{tag.label}}\r\n                            </mat-checkbox>\r\n                        </div>\r\n                        }\r\n                        }@else {\r\n                        <div class=\"flex flex-auto flex-col justify-center px-4 h-10 min-h-10\">\r\n                            \u65E0\u7ED3\u679C\r\n                        </div>\r\n                        }\r\n                        }\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n    </ng-container>\r\n</div>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTagsTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CmatTagsTypeComponent, isStandalone: true, selector: "cmat-tags-type", viewQueries: [{ propertyName: "_tagsPanelOrigin", first: true, predicate: ["tagsPanelOrigin"], descendants: true }, { propertyName: "_tagsPanel", first: true, predicate: ["tagsPanel"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"text-lg mb-2\">\r\n    {{ props.label }}\r\n    @if(props.required){\r\n    <span>*</span>\r\n    }\r\n</div>\r\n<div class=\"flex flex-wrap items-center -m-2\" [tabIndex]=\"props.tabindex\">\r\n    <ng-container>\r\n        @for (selectedItem of formControl.value; track $index) {\r\n        <div\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700\">\r\n            <span class=\"text-md font-medium whitespace-nowrap\">{{selectedItem.label}}</span>\r\n        </div>\r\n        }\r\n\r\n        <div #tagsPanelOrigin\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 cursor-pointer text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700 print:hidden\" role=\"presentation\" (click)=\"openTagsPanel()\">\r\n\r\n            @if(formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:pencil-square'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u7F16\u8F91</span>\r\n            }\r\n\r\n            @if(!formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:plus-circle'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u65B0\u589E</span>\r\n            }\r\n\r\n            <ng-template #tagsPanel>\r\n                <div class=\"w-60 rounded-sm border shadow-md bg-card\">\r\n                    <div class=\"flex items-center m-3 mr-2\">\r\n                        <div class=\"flex items-center\">\r\n                            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\">\r\n                            </mat-icon>\r\n                            <div class=\"ml-2\">\r\n                                <input class=\"w-full min-w-0 py-1 border-none\" type=\"text\" placeholder=\"\u8F93\u5165\u6807\u7B7E\u540D\"\r\n                                    [maxLength]=\"30\" (input)=\"filterTags($event)\">\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"flex flex-col max-h-64 py-2 border-t overflow-y-auto scrollbar-custom\">\r\n                        @if ((filteredItems$ | async); as filteredItems) {\r\n                        @if(filteredItems.length>0){\r\n                        @for (tag of filteredItems; track $index) {\r\n                        <div role=\"presentation\"\r\n                            class=\"flex items-center h-10 min-h-10 pl-1 pr-4 cursor-pointer hover:bg-hover\"\r\n                            matRipple (click)=\"toggleTag(tag)\">\r\n                            <mat-checkbox class=\"flex items-center h-10 min-h-10\" [color]=\"'primary'\"\r\n                                [disabled]=\"tag.disabled\" [checked]=\"isCheck(tag)\">\r\n                                {{tag.label}}\r\n                            </mat-checkbox>\r\n                        </div>\r\n                        }\r\n                        }@else {\r\n                        <div class=\"flex flex-auto flex-col justify-center px-4 h-10 min-h-10\">\r\n                            \u65E0\u7ED3\u679C\r\n                        </div>\r\n                        }\r\n                        }\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n    </ng-container>\r\n</div>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTagsTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTagsTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-tags-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatIconModule, MatCheckboxModule, AsyncPipe], template: "<div class=\"text-lg mb-2\">\r\n    {{ props.label }}\r\n    @if(props.required){\r\n    <span>*</span>\r\n    }\r\n</div>\r\n<div class=\"flex flex-wrap items-center -m-2\" [tabIndex]=\"props.tabindex\">\r\n    <ng-container>\r\n        @for (selectedItem of formControl.value; track $index) {\r\n        <div\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700\">\r\n            <span class=\"text-md font-medium whitespace-nowrap\">{{selectedItem.label}}</span>\r\n        </div>\r\n        }\r\n\r\n        <div #tagsPanelOrigin\r\n            class=\"flex items-center justify-center px-4 m-1.5 rounded-full leading-9 cursor-pointer text-gray-500 bg-slate-100 dark:text-gray-300 dark:bg-slate-700 print:hidden\" role=\"presentation\" (click)=\"openTagsPanel()\">\r\n\r\n            @if(formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:pencil-square'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u7F16\u8F91</span>\r\n            }\r\n\r\n            @if(!formControl.value?.length&&!disabled){\r\n            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:plus-circle'\"></mat-icon>\r\n            <span class=\"ml-1.5 text-md font-medium whitespace-nowrap\">\u65B0\u589E</span>\r\n            }\r\n\r\n            <ng-template #tagsPanel>\r\n                <div class=\"w-60 rounded-sm border shadow-md bg-card\">\r\n                    <div class=\"flex items-center m-3 mr-2\">\r\n                        <div class=\"flex items-center\">\r\n                            <mat-icon class=\"icon-size-5\" [svgIcon]=\"'heroicons_solid:magnifying-glass'\">\r\n                            </mat-icon>\r\n                            <div class=\"ml-2\">\r\n                                <input class=\"w-full min-w-0 py-1 border-none\" type=\"text\" placeholder=\"\u8F93\u5165\u6807\u7B7E\u540D\"\r\n                                    [maxLength]=\"30\" (input)=\"filterTags($event)\">\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"flex flex-col max-h-64 py-2 border-t overflow-y-auto scrollbar-custom\">\r\n                        @if ((filteredItems$ | async); as filteredItems) {\r\n                        @if(filteredItems.length>0){\r\n                        @for (tag of filteredItems; track $index) {\r\n                        <div role=\"presentation\"\r\n                            class=\"flex items-center h-10 min-h-10 pl-1 pr-4 cursor-pointer hover:bg-hover\"\r\n                            matRipple (click)=\"toggleTag(tag)\">\r\n                            <mat-checkbox class=\"flex items-center h-10 min-h-10\" [color]=\"'primary'\"\r\n                                [disabled]=\"tag.disabled\" [checked]=\"isCheck(tag)\">\r\n                                {{tag.label}}\r\n                            </mat-checkbox>\r\n                        </div>\r\n                        }\r\n                        }@else {\r\n                        <div class=\"flex flex-auto flex-col justify-center px-4 h-10 min-h-10\">\r\n                            \u65E0\u7ED3\u679C\r\n                        </div>\r\n                        }\r\n                        }\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n    </ng-container>\r\n</div>", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { _tagsPanelOrigin: [{
@@ -1382,10 +1385,10 @@ class CmatTextareaTypeComponent extends FieldType$1 {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTextareaTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatTextareaTypeComponent, isStandalone: true, selector: "cmat-textarea-type", usesInheritance: true, ngImport: i0, template: "<textarea matInput [placeholder]=\"placeholder\"   \r\n    [readonly]=\"props.readonly\" [errorStateMatcher]=\"errorStateMatcher\"\r\n    [cols]=\"props.cols\"\r\n    [rows]=\"props.rows\"\r\n    [tabindex]=\"props.tabindex\"\r\n    [formControl]=\"formControl\" [required]=\"required\">\r\n</textarea>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatTextareaTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatTextareaTypeComponent, isStandalone: true, selector: "cmat-textarea-type", usesInheritance: true, ngImport: i0, template: "<textarea matInput [placeholder]=\"placeholder\"   \r\n    [readonly]=\"props.readonly\" [errorStateMatcher]=\"errorStateMatcher\"\r\n    [cols]=\"props.cols\"\r\n    [rows]=\"props.rows\"\r\n    [tabindex]=\"props.tabindex\"\r\n    [formControl]=\"formControl\" [required]=\"required\">\r\n</textarea>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$6.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: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatTextareaTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatTextareaTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-textarea-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatInputModule, ReactiveFormsModule], template: "<textarea matInput [placeholder]=\"placeholder\"   \r\n    [readonly]=\"props.readonly\" [errorStateMatcher]=\"errorStateMatcher\"\r\n    [cols]=\"props.cols\"\r\n    [rows]=\"props.rows\"\r\n    [tabindex]=\"props.tabindex\"\r\n    [formControl]=\"formControl\" [required]=\"required\">\r\n</textarea>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1445,10 +1448,10 @@ class CmatUploadTypeComponent extends FieldType {
         }
         return baseControl;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatUploadTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatUploadTypeComponent, isStandalone: true, selector: "cmat-upload-type", usesInheritance: true, ngImport: i0, template: "<cmat-upload-queue [tabindex]=\"props.tabindex\" [fileAlias]=\"props.fileAlias\"\r\n    [filePath]=\"props.filePath\" [required]=\"required\" [fileCategory]=\"props.fileCategory\" [multiple]=\"props.multiple\"\r\n    [accept]=\"props.accept\" [title]=\"props.label??'\u9644\u4EF6'\" [editMode]=\"props.editMode&&!disabled\" [filesData]=\"formControl.value\"\r\n    [autoUpload]=\"props.autoUpload\" (outputUploadIdEvent)=\"upload($event)\" (outputRemoveIdEvent)=\"remove($event)\" (outputFilesDataEvent)=\"updateData($event)\">\r\n</cmat-upload-queue>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatUploadQueueComponent, selector: "cmat-upload-queue", inputs: ["fileAlias", "filePath", "fileCategory", "isPublic", "required", "autoUpload", "multiple", "accept", "title", "editMode", "filesData"], outputs: ["outputRemoveIdEvent", "outputUploadIdEvent", "outputFilesDataEvent"], exportAs: ["cmatUploadQueue"] }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatUploadTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatUploadTypeComponent, isStandalone: true, selector: "cmat-upload-type", usesInheritance: true, ngImport: i0, template: "<cmat-upload-queue [tabindex]=\"props.tabindex\" [fileAlias]=\"props.fileAlias\"\r\n    [filePath]=\"props.filePath\" [required]=\"required\" [fileCategory]=\"props.fileCategory\" [multiple]=\"props.multiple\"\r\n    [accept]=\"props.accept\" [title]=\"props.label??'\u9644\u4EF6'\" [editMode]=\"props.editMode&&!disabled\" [filesData]=\"formControl.value\"\r\n    [autoUpload]=\"props.autoUpload\" (outputUploadIdEvent)=\"upload($event)\" (outputRemoveIdEvent)=\"remove($event)\" (outputFilesDataEvent)=\"updateData($event)\">\r\n</cmat-upload-queue>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatUploadQueueComponent, selector: "cmat-upload-queue", inputs: ["fileAlias", "filePath", "fileCategory", "isPublic", "required", "autoUpload", "multiple", "accept", "title", "editMode", "filesData"], outputs: ["outputRemoveIdEvent", "outputUploadIdEvent", "outputFilesDataEvent"], exportAs: ["cmatUploadQueue"] }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatUploadTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatUploadTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-upload-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatUploadQueueComponent, ReactiveFormsModule], template: "<cmat-upload-queue [tabindex]=\"props.tabindex\" [fileAlias]=\"props.fileAlias\"\r\n    [filePath]=\"props.filePath\" [required]=\"required\" [fileCategory]=\"props.fileCategory\" [multiple]=\"props.multiple\"\r\n    [accept]=\"props.accept\" [title]=\"props.label??'\u9644\u4EF6'\" [editMode]=\"props.editMode&&!disabled\" [filesData]=\"formControl.value\"\r\n    [autoUpload]=\"props.autoUpload\" (outputUploadIdEvent)=\"upload($event)\" (outputRemoveIdEvent)=\"remove($event)\" (outputFilesDataEvent)=\"updateData($event)\">\r\n</cmat-upload-queue>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1466,13 +1469,15 @@ class CmatQuillTypeComponent extends FieldType {
                     [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
                     [{ 'color': [] }, { 'background': [] }],
                     [{ 'font': [] }],
-                    [{ 'align': [] }],
-                    ['clean'],
-                    ['link', 'image', 'video']
+                    [{ 'align': [] }, 'clean'],
+                    ['link', 'image', 'video', 'word']
                 ],
                 handlers: {
                     image: this._imgFileHandler.bind(this),
-                    video: this._videoFileHandler.bind(this)
+                    video: this._videoFileHandler.bind(this),
+                    word: () => {
+                        this._wordFileHandler().catch(err => console.error('Word 导出失败:', err));
+                    },
                 },
             },
             clipboard: {
@@ -1492,6 +1497,7 @@ class CmatQuillTypeComponent extends FieldType {
         this._fileService = inject(CmatFilesUtilService);
         this._urlStateConfigService = inject(CmatUrlStateConfigService);
         this._changeDetectorRef = inject(ChangeDetectorRef);
+        this._http = inject(HttpClient);
         this._imgIds = [];
         this._unsubscribeAll = new Subject();
         this._urlStateConfigService.config$
@@ -1505,6 +1511,10 @@ class CmatQuillTypeComponent extends FieldType {
         this._unsubscribeAll.complete();
     }
     ngAfterViewInit() {
+        const icons = Quill.import('ui/icons');
+        icons['word'] = `
+        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="20px"><path fill="#2196F3" d="M41,10H25v28h16c0.553,0,1-0.447,1-1V11C42,10.447,41.553,10,41,10z"/><path fill="#FFF" d="M25 15.001H39V17H25zM25 19H39V21H25zM25 23.001H39V25.001H25zM25 27.001H39V29H25zM25 31H39V33.001H25z"/><path fill="#0D47A1" d="M27 42L6 38 6 10 27 6z"/><path fill="#FFF" d="M21.167,31.012H18.45l-1.802-8.988c-0.098-0.477-0.155-0.996-0.174-1.576h-0.032c-0.043,0.637-0.11,1.162-0.197,1.576l-1.85,8.988h-2.827l-2.86-14.014h2.675l1.536,9.328c0.062,0.404,0.111,0.938,0.143,1.607h0.042c0.019-0.498,0.098-1.051,0.223-1.645l1.97-9.291h2.622l1.785,9.404c0.062,0.348,0.119,0.846,0.17,1.511h0.031c0.02-0.515,0.073-1.035,0.16-1.563l1.503-9.352h2.468L21.167,31.012z"/></svg>
+    `;
         if (!this.baseGroup)
             this.baseGroup = this._getRootControl(this.formControl);
         if (!this.baseGroup.contains('uploadId')) {
@@ -1574,6 +1584,232 @@ class CmatQuillTypeComponent extends FieldType {
     _videoFileHandler() {
         this.videoInput.nativeElement.click();
     }
+    async _wordFileHandler() {
+        try {
+            // 获取 Quill Delta 内容
+            const delta = this._editorInstance.getContents();
+            // 转换为 docx 文档结构
+            const children = await this._convertDeltaToDocxChildren(delta);
+            // 创建文档
+            const doc = new Document({
+                sections: [{
+                        properties: {},
+                        children: children
+                    }]
+            });
+            // 生成 Blob
+            const blob = await Packer.toBlob(doc);
+            // 下载文件
+            FileSaver.saveAs(blob, `${this.placeholder ?? '富文本内容下载_'}${dayjs().format('YYYYMMDDHHmmss')}.docx`);
+        }
+        catch (error) {
+            console.error('Word 导出失败:', error);
+        }
+    }
+    async _convertDeltaToDocxChildren(delta) {
+        const children = [];
+        let currentRun = [];
+        let currentListLevel = 0;
+        let isList = false;
+        for (const op of delta.ops) {
+            // 处理图片
+            if (op.insert?.image) {
+                if (currentRun.length > 0) {
+                    children.push(new Paragraph({ children: currentRun }));
+                    currentRun = [];
+                }
+                const imageRun = await this._createImageRun(op.insert.image);
+                children.push(new Paragraph({
+                    children: [imageRun],
+                    alignment: AlignmentType.CENTER
+                }));
+            }
+            // 处理文本
+            else if (typeof op.insert === 'string') {
+                const text = op.insert;
+                // 换行符 - 新建段落
+                if (text === '\n') {
+                    if (currentRun.length > 0) {
+                        children.push(this._createParagraph(currentRun, op.attributes, isList, currentListLevel));
+                        currentRun = [];
+                    }
+                    else {
+                        // 空行
+                        children.push(new Paragraph({ children: [new TextRun({ text: '' })] }));
+                    }
+                    // 重置列表状态
+                    if (!op.attributes?.list) {
+                        isList = false;
+                        currentListLevel = 0;
+                    }
+                }
+                // 普通文本
+                else {
+                    const textRun = this._createTextRun(text, op.attributes);
+                    currentRun.push(textRun);
+                    // 检测列表
+                    if (op.attributes?.list) {
+                        isList = true;
+                        currentListLevel = op.attributes.list === 'bullet' ? 0 :
+                            op.attributes.list === 'order' ? 0 : currentListLevel;
+                    }
+                }
+            }
+        }
+        // 处理剩余文本
+        if (currentRun.length > 0) {
+            children.push(this._createParagraph(currentRun, null, isList, currentListLevel));
+        }
+        return children;
+    }
+    _createTextRun(text, attributes) {
+        return new TextRun({
+            text: text,
+            bold: attributes?.bold ?? false,
+            italics: attributes?.italic ?? false,
+            underline: attributes?.underline ? { type: BorderStyle.SINGLE } : undefined,
+            size: this._mapFontSize(attributes?.size),
+            font: attributes?.font ?? undefined,
+            color: attributes?.color ? this._parseColor(attributes.color) : undefined,
+            highlight: attributes?.background ? this._parseColor(attributes.background) : undefined
+        });
+    }
+    _createParagraph(runs, attributes, isList, listLevel) {
+        const paragraphOptions = {
+            children: runs,
+            alignment: this._mapAlignment(attributes?.align),
+        };
+        // 处理标题
+        if (attributes?.header) {
+            const headerLevel = parseInt(attributes.header);
+            if (headerLevel >= 1 && headerLevel <= 6) {
+                paragraphOptions.heading = HeadingLevel[`HEADING_${headerLevel}`];
+            }
+        }
+        // 处理列表
+        if (isList && attributes?.list) {
+            paragraphOptions.bullet = {
+                level: listLevel ?? 0
+            };
+        }
+        return new Paragraph(paragraphOptions);
+    }
+    async _createImageRun(imageUrl) {
+        const imageBuffer = await this._getImageBuffer(imageUrl);
+        // 根据 URL 后缀判断图片类型，默认 PNG
+        let type = 'png';
+        if (imageUrl.toLowerCase().endsWith('.svg')) {
+            type = 'svg';
+        }
+        else if (imageUrl.toLowerCase().endsWith('.jpeg') || imageUrl.toLowerCase().endsWith('.jpg')) {
+            type = 'jpg';
+        }
+        else if (imageUrl.toLowerCase().endsWith('.gif')) {
+            type = 'gif';
+        }
+        const dimensions = await this._getImageDimensions(imageUrl);
+        const maxWidth = 500;
+        const maxHeight = 400;
+        // 按比例缩放
+        const scale = Math.min(maxWidth / dimensions.width, maxHeight / dimensions.height, 1);
+        return new ImageRun({
+            data: imageBuffer,
+            transformation: {
+                width: Math.round(dimensions.width * scale),
+                height: Math.round(dimensions.height * scale)
+            },
+            type: type,
+            fallback: {
+                type: type != 'svg' ? type : 'png',
+                data: imageBuffer
+            }
+        });
+    }
+    async _getImageBuffer(imageUrl) {
+        // 如果已经是 Base64
+        if (imageUrl.startsWith('data:image')) {
+            const base64 = imageUrl.split(',')[1];
+            return this._base64ToUint8Array(base64);
+        }
+        try {
+            const response = await fetch(imageUrl, {
+                method: 'GET',
+                mode: 'cors',
+                credentials: 'omit'
+            });
+            if (!response.ok) {
+                throw new Error(`图片获取失败: ${imageUrl}`);
+            }
+            const arrayBuffer = await response.arrayBuffer();
+            return new Uint8Array(arrayBuffer);
+        }
+        catch (error) {
+            console.error('图片加载失败:', imageUrl, error);
+            // 返回空图片占位
+            return new Uint8Array(0);
+        }
+    }
+    async _getImageDimensions(imageUrl) {
+        return new Promise((resolve) => {
+            const img = new Image();
+            img.onload = () => {
+                resolve({ width: img.width, height: img.height });
+            };
+            img.onerror = () => {
+                // 默认尺寸
+                resolve({ width: 400, height: 300 });
+            };
+            img.src = imageUrl;
+        });
+    }
+    _base64ToUint8Array(base64) {
+        const binaryString = atob(base64);
+        const bytes = new Uint8Array(binaryString.length);
+        for (let i = 0; i < binaryString.length; i++) {
+            bytes[i] = binaryString.charCodeAt(i);
+        }
+        return bytes;
+    }
+    _mapFontSize(size) {
+        if (!size)
+            return undefined;
+        const sizeMap = {
+            'small': 12,
+            'normal': 14,
+            'large': 18,
+            'huge': 24
+        };
+        return sizeMap[size] || 14;
+    }
+    _mapAlignment(align) {
+        switch (align) {
+            case 'center':
+                return AlignmentType.CENTER;
+            case 'right':
+                return AlignmentType.RIGHT;
+            case 'justify':
+                return AlignmentType.JUSTIFIED;
+            default:
+                return AlignmentType.LEFT;
+        }
+    }
+    _parseColor(color) {
+        if (!color)
+            return undefined;
+        // 处理 hex 颜色 #RRGGBB -> RRGGBB
+        if (color.startsWith('#')) {
+            return color.substring(1).toUpperCase();
+        }
+        // 处理 rgb/rgba
+        const rgbMatch = /rgba?\((\d+),\s*(\d+),\s*(\d+)/.exec(color);
+        if (rgbMatch) {
+            const r = parseInt(rgbMatch[1]).toString(16).padStart(2, '0');
+            const g = parseInt(rgbMatch[2]).toString(16).padStart(2, '0');
+            const b = parseInt(rgbMatch[3]).toString(16).padStart(2, '0');
+            return `${r}${g}${b}`.toUpperCase();
+        }
+        return undefined;
+    }
     _dropFileHandler(dataUrl, type, fileData) {
         this.fileChangeEvent(fileData.toFile());
     }
@@ -1606,12 +1842,12 @@ class CmatQuillTypeComponent extends FieldType {
         }
         return baseControl;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatQuillTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatQuillTypeComponent, isStandalone: true, selector: "cmat-quill-type", viewQueries: [{ propertyName: "imgInput", first: true, predicate: ["imgInput"], descendants: true }, { propertyName: "videoInput", first: true, predicate: ["videoInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<quill-editor class=\"w-full\" defaultEmptyValue=\"\" [formControl]=\"formControl\" [required]=\"required\"  [placeholder]=\"placeholder\" [tabindex]=\"props.tabindex\"\r\n    [readOnly]=\"disabled\" [modules]=\"quillModules\" (onEditorCreated)=\"editorCreated($event)\"\r\n    (onContentChanged)=\"contentChanged($event)\">\r\n    <input #imgInput type=\"file\" accept=\"image/png,image/jpeg,image/jpg,image/gif\" class=\"hidden\" (change)=\"fileChangeEvent(imgInput.files?.[0])\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0])\" />\r\n</quill-editor>", styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: QuillModule }, { kind: "component", type: i2$4.QuillEditorComponent, selector: "quill-editor" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatQuillTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatQuillTypeComponent, isStandalone: true, selector: "cmat-quill-type", viewQueries: [{ propertyName: "imgInput", first: true, predicate: ["imgInput"], descendants: true }, { propertyName: "videoInput", first: true, predicate: ["videoInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<quill-editor class=\"w-full\" defaultEmptyValue=\"\" [formControl]=\"formControl\" [required]=\"required\"  [placeholder]=\"placeholder\" [tabindex]=\"props.tabindex\"\r\n    [readOnly]=\"disabled\" [modules]=\"quillModules\" (onEditorCreated)=\"editorCreated($event)\"\r\n    (onContentChanged)=\"contentChanged($event)\">\r\n    \r\n    <input #imgInput type=\"file\" accept=\"image/png,image/jpeg,image/jpg,image/gif\" class=\"hidden\" (change)=\"fileChangeEvent(imgInput.files?.[0])\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0])\" />\r\n</quill-editor>", styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: QuillModule }, { kind: "component", type: i2$4.QuillEditorComponent, selector: "quill-editor" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatQuillTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatQuillTypeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-quill-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, QuillModule], template: "<quill-editor class=\"w-full\" defaultEmptyValue=\"\" [formControl]=\"formControl\" [required]=\"required\"  [placeholder]=\"placeholder\" [tabindex]=\"props.tabindex\"\r\n    [readOnly]=\"disabled\" [modules]=\"quillModules\" (onEditorCreated)=\"editorCreated($event)\"\r\n    (onContentChanged)=\"contentChanged($event)\">\r\n    <input #imgInput type=\"file\" accept=\"image/png,image/jpeg,image/jpg,image/gif\" class=\"hidden\" (change)=\"fileChangeEvent(imgInput.files?.[0])\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0])\" />\r\n</quill-editor>", styles: [":host{display:block;width:100%}\n"] }]
+            args: [{ selector: 'cmat-quill-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, QuillModule], template: "<quill-editor class=\"w-full\" defaultEmptyValue=\"\" [formControl]=\"formControl\" [required]=\"required\"  [placeholder]=\"placeholder\" [tabindex]=\"props.tabindex\"\r\n    [readOnly]=\"disabled\" [modules]=\"quillModules\" (onEditorCreated)=\"editorCreated($event)\"\r\n    (onContentChanged)=\"contentChanged($event)\">\r\n    \r\n    <input #imgInput type=\"file\" accept=\"image/png,image/jpeg,image/jpg,image/gif\" class=\"hidden\" (change)=\"fileChangeEvent(imgInput.files?.[0])\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0])\" />\r\n</quill-editor>", styles: [":host{display:block;width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { imgInput: [{
                 type: ViewChild,
                 args: ['imgInput']
@@ -1638,10 +1874,10 @@ class CmatKnobTypeComponent extends FieldType {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatKnobTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatKnobTypeComponent, isStandalone: true, selector: "cmat-knob-type", usesInheritance: true, ngImport: i0, template: "<cmat-knob-input [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [valueColor]=\"props.valueColor\"\r\n    [rangeColor]=\"props.rangeColor\" [textColor]=\"props.textColor\" [valueTemplate]=\"props.valueTemplate\"\r\n    [name]=\"props.name\" [size]=\"props.size\" [step]=\"props.step\" [min]=\"props.min\" [max]=\"props.max\"\r\n    [strokeWidth]=\"props.strokeWidth\" [showValue]=\"props.showValue\">\r\n</cmat-knob-input>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatKnobInputComponent, selector: "cmat-knob-input", inputs: ["id", "valueColor", "rangeColor", "textColor", "valueTemplate", "name", "size", "step", "min", "max", "strokeWidth", "showValue", "placeholder", "value", "required", "disabled"], outputs: ["valueChange"], exportAs: ["cmatKnobInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatKnobTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatKnobTypeComponent, isStandalone: true, selector: "cmat-knob-type", usesInheritance: true, ngImport: i0, template: "<cmat-knob-input [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [valueColor]=\"props.valueColor\"\r\n    [rangeColor]=\"props.rangeColor\" [textColor]=\"props.textColor\" [valueTemplate]=\"props.valueTemplate\"\r\n    [name]=\"props.name\" [size]=\"props.size\" [step]=\"props.step\" [min]=\"props.min\" [max]=\"props.max\"\r\n    [strokeWidth]=\"props.strokeWidth\" [showValue]=\"props.showValue\">\r\n</cmat-knob-input>", styles: [":host{width:100%}\n"], dependencies: [{ kind: "component", type: CmatKnobInputComponent, selector: "cmat-knob-input", inputs: ["id", "valueColor", "rangeColor", "textColor", "valueTemplate", "name", "size", "step", "min", "max", "strokeWidth", "showValue", "placeholder", "value", "required", "disabled"], outputs: ["valueChange"], exportAs: ["cmatKnobInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatKnobTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatKnobTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-knob-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CmatKnobInputComponent, ReactiveFormsModule], template: "<cmat-knob-input [formControl]=\"formControl\" [tabIndex]=\"props.tabindex\" [valueColor]=\"props.valueColor\"\r\n    [rangeColor]=\"props.rangeColor\" [textColor]=\"props.textColor\" [valueTemplate]=\"props.valueTemplate\"\r\n    [name]=\"props.name\" [size]=\"props.size\" [step]=\"props.step\" [min]=\"props.min\" [max]=\"props.max\"\r\n    [strokeWidth]=\"props.strokeWidth\" [showValue]=\"props.showValue\">\r\n</cmat-knob-input>", styles: [":host{width:100%}\n"] }]
         }] });
@@ -1657,10 +1893,10 @@ class CmatSliderTypeComponent extends FieldType$1 {
             }
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSliderTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CmatSliderTypeComponent, isStandalone: true, selector: "cmat-slider-type", usesInheritance: true, ngImport: i0, template: "<mat-slider class=\"w-full\" [id]=\"id\" [tabIndex]=\"props.tabindex\" [color]=\"props.color\"\r\n  [displayWith]=\"props.displayWith!\" [max]=\"props.max\" [min]=\"props.min\" [step]=\"props.step\" [discrete]=\"props.discrete\"\r\n  [showTickMarks]=\"props.showTickMarks\" (input)=\"props.input && props.input(field, $event)\"\r\n  (change)=\"props.change && props.change(field, $event)\">\r\n  <input matSliderThumb [formControl]=\"formControl\" />\r\n</mat-slider>", styles: [":host{width:100%}:host .mdc-slider__input{padding:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i1$a.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i1$a.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.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.1", ngImport: i0, type: CmatSliderTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: CmatSliderTypeComponent, isStandalone: true, selector: "cmat-slider-type", usesInheritance: true, ngImport: i0, template: "<mat-slider class=\"w-full\" [id]=\"id\" [tabIndex]=\"props.tabindex\" [color]=\"props.color\"\r\n  [displayWith]=\"props.displayWith!\" [max]=\"props.max\" [min]=\"props.min\" [step]=\"props.step\" [discrete]=\"props.discrete\"\r\n  [showTickMarks]=\"props.showTickMarks\" (input)=\"props.input && props.input(field, $event)\"\r\n  (change)=\"props.change && props.change(field, $event)\">\r\n  <input matSliderThumb [formControl]=\"formControl\" />\r\n</mat-slider>", styles: [":host{width:100%}:host .mdc-slider__input{padding:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i1$a.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i1$a.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CmatSliderTypeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CmatSliderTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-slider-type', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatSliderModule, ReactiveFormsModule], template: "<mat-slider class=\"w-full\" [id]=\"id\" [tabIndex]=\"props.tabindex\" [color]=\"props.color\"\r\n  [displayWith]=\"props.displayWith!\" [max]=\"props.max\" [min]=\"props.min\" [step]=\"props.step\" [discrete]=\"props.discrete\"\r\n  [showTickMarks]=\"props.showTickMarks\" (input)=\"props.input && props.input(field, $event)\"\r\n  (change)=\"props.change && props.change(field, $event)\">\r\n  <input matSliderThumb [formControl]=\"formControl\" />\r\n</mat-slider>", styles: [":host{width:100%}:host .mdc-slider__input{padding:0!important}\n"] }]
         }] });