cmat 0.0.82 → 0.0.84

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

@@ -64,7 +64,7 @@ import BlotFormatter from '@enzedonline/quill-blot-formatter2';
 import { CmatUrlStateConfigService } from 'cmat/services/config';
 import { CmatUtilsService } from 'cmat/services/utils';
 import dayjs from 'dayjs';
-import { Document, Packer, Paragraph, AlignmentType, TextRun, BorderStyle, HeadingLevel, ImageRun } from 'docx';
+import { Document, Packer, Paragraph, AlignmentType, TextRun, BorderStyle, HeadingLevel, ImageRun, HighlightColor } from 'docx';
 import * as FileSaver from 'file-saver-es';
 import * as i2$4 from 'ngx-quill';
 import { QuillModule } from 'ngx-quill';
@@ -75,13 +75,14 @@ import * as i1$a from '@angular/material/slider';
 import { MatSliderModule } from '@angular/material/slider';
 
 function addonsExtension(field) {
-    if (!field.props || (field.wrappers?.includes('addons'))) {
+    const props = field.props;
+    if (!props || (field.wrappers?.includes('addons'))) {
         return;
     }
-    if ((field.props.addonLeft && ((!isNil(field.props.addonLeft.icon) && field.props.addonLeft.icon !== '')
-        || (!isNil(field.props.addonLeft.text)) && field.props.addonLeft.text !== ''))
-        || (field.props.addonRight && ((!isNil(field.props.addonRight.icon) && field.props.addonRight.icon !== '')
-            || (!isNil(field.props.addonRight.text)) && field.props.addonRight.text !== ''))) {
+    if ((props.addonLeft && ((!isNil(props.addonLeft.icon) && props.addonLeft.icon !== '')
+        || (!isNil(props.addonLeft.text)) && props.addonLeft.text !== ''))
+        || (props.addonRight && ((!isNil(props.addonRight.icon) && props.addonRight.icon !== '')
+            || (!isNil(props.addonRight.text)) && props.addonRight.text !== ''))) {
         field.wrappers = [...(field.wrappers ?? []), 'addons'];
     }
 }
@@ -215,8 +216,11 @@ class CmatFormFieldWrapperComponent extends FieldWrapper {
     }
     ngAfterViewInit() {
         if (this.formField.appearance !== 'outline' && this.props.hideFieldUnderline === true) {
-            const underlineElement = this.formField._elementRef.nativeElement.querySelector('.mat-form-field-underline');
-            underlineElement && this._renderer.removeChild(underlineElement.parentNode, underlineElement);
+            const formFieldElement = this._elementRef.nativeElement;
+            const underlineElement = formFieldElement.querySelector('.mat-form-field-underline');
+            if (underlineElement?.parentNode) {
+                this._renderer.removeChild(underlineElement.parentNode, underlineElement);
+            }
         }
     }
     ngOnDestroy() {
@@ -234,9 +238,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 args: [MatFormField, { static: true }]
             }] } });
 
+const DANGEROUS_PATTERNS = [
+    /\bdocument\s*\./i,
+    /\bwindow\s*\./i,
+    /\beval\s*\(/i,
+    /\bfetch\s*\(/i,
+    /\bXMLHttpRequest\b/i,
+    /\bimport\s*\(/i,
+    /\b__proto__\b/i,
+    /\bconstructor\s*\(/i,
+    /\bprototype\b/i
+];
 class CmatButtonTypeComponent extends FieldType {
     constructor() {
-        super();
+        super(...arguments);
         this.defaultOptions = {
             props: {
                 color: 'primary'
@@ -247,14 +262,21 @@ class CmatButtonTypeComponent extends FieldType {
         $event.preventDefault();
         if (this.props.onClick) {
             if (isString(this.props.onClick)) {
-                this._executeFunctionFromString(this.props.onClick, $event, this);
+                this._executeFunctionFromString(this.props.onClick, $event, { props: this.props });
             }
             else {
                 this.props.onClick($event);
             }
         }
     }
+    _isDangerousCode(code) {
+        return DANGEROUS_PATTERNS.some((pattern) => pattern.test(code));
+    }
     _executeFunctionFromString(funcString, event, context) {
+        if (this._isDangerousCode(funcString)) {
+            console.error('Button onClick contains potentially dangerous code and was blocked:', funcString);
+            return;
+        }
         try {
             // eslint-disable-next-line @typescript-eslint/no-implied-eval
             const func = new Function('event', 'context', `with (context) { ${funcString} }`);
@@ -264,13 +286,13 @@ class CmatButtonTypeComponent extends FieldType {
             console.error('Error executing function from string:', error);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatButtonTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatButtonTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", 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    {{ props.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.9", 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    {{ props.label }}\r\n</button>" }]
-        }], ctorParameters: () => [] });
+        }] });
 
 class CmatCascadeTypeComponent extends FieldType {
     constructor() {
@@ -294,9 +316,11 @@ class CmatCascadeTypeComponent extends FieldType {
         if (url && this.props?.domain?.code && this.props?.domain?.key && this.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
@@ -336,6 +360,8 @@ class CmatCheckListTypeComponent extends FieldType {
         super();
         this.isIndeterminate = false;
         this.isChecked = false;
+        this.urlData = [];
+        this.optionsData = [];
         this.checklist = [];
         this.filteredData = [];
         this._http = inject(HttpClient);
@@ -364,13 +390,15 @@ class CmatCheckListTypeComponent extends FieldType {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this.urlData = datas[0][this.field.props?.domain?.value];
+                        this.urlData = datas[0][this.field.props?.domain?.value] ?? [];
                     }
                     else {
                         this.urlData = [];
@@ -389,7 +417,7 @@ class CmatCheckListTypeComponent extends FieldType {
             this._filteredItems.set(this.filteredData);
         }
         this.formControl.valueChanges.pipe(takeUntilDestroyed(this._destroyRef)).subscribe((value) => {
-            this.checklist = value ?? [];
+            this.checklist = (value ?? []);
             this._getAllCheckCountState();
         });
     }
@@ -397,7 +425,9 @@ class CmatCheckListTypeComponent extends FieldType {
         return item.id ?? index;
     }
     filterByQuery(event) {
-        this.filteredData = this.datas.filter(data => data.value.toString().toLowerCase().includes(event) ?? data.label.toLowerCase().includes(event));
+        const query = typeof event === 'string' ? event : event.target?.value ?? '';
+        const normalizedQuery = query.toLowerCase();
+        this.filteredData = this.datas.filter((data) => this._toSearchText(data.value).toLowerCase().includes(normalizedQuery) || this._toSearchText(data.label).toLowerCase().includes(normalizedQuery));
         this._filteredItems.set(this.filteredData);
         this._getAllCheckCountState();
     }
@@ -432,7 +462,8 @@ class CmatCheckListTypeComponent extends FieldType {
         this.formControl.setValue(this.checklist);
     }
     isCheck(data) {
-        return this.formControl.value?.filter((i) => i.value === data.value).length > 0;
+        const selected = (this.formControl.value ?? []);
+        return selected.filter((i) => i.value === data.value).length > 0;
     }
     _getAllCheckCountState() {
         if (this.props.showAllCheck && !this.props.disabled) {
@@ -464,35 +495,47 @@ class CmatCheckListTypeComponent extends FieldType {
             }
         }
     }
+    _toSearchText(value) {
+        return typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean' ? String(value) : '';
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatCheckListTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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)\" [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>\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: 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.9", 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"] }]
+            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)\" [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>\r\n", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [] });
 
 class CmatChipsInputTypeComponent extends FieldType {
     constructor() {
         super();
+        this.autocompleteUrlData = [];
         this._http = inject(HttpClient);
         this._destroyRef = inject(DestroyRef);
     }
     get autocompleteText() {
-        return this.autocompleteUrlData?.length > 0 ? this.autocompleteUrlData : this.props?.autocompleteText?.split(',') ?? [];
+        if (this.autocompleteUrlData?.length > 0) {
+            // Ensure all elements are strings, filter out non-strings
+            return this.autocompleteUrlData.filter((item) => typeof item === 'string');
+        }
+        return this.props?.autocompleteText?.split(',') ?? [];
     }
     ngOnInit() {
         const url = this.props?.domain?.url;
         if (url && this.props?.domain?.code && this.props?.domain?.key && this.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
-                    const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
+                    const datas = data
+                        .filter((i) => typeof i === 'object' && i !== null)
+                        .filter((i) => {
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this.autocompleteUrlData = datas[0][this.field.props?.domain?.value];
+                        this.autocompleteUrlData = [datas[0][this.field.props?.domain?.value]];
                     }
                     else {
                         this.autocompleteUrlData = [];
@@ -597,15 +640,17 @@ class CmatMultiCheckboxTypeComponent extends FieldType {
     get urlData$() {
         return this._urlData$;
     }
-    onChange(value, checked) {
+    onChange(optionValue, checked) {
+        const value = optionValue ?? '';
         this.formControl.markAsDirty();
         if (this.props.type === 'array') {
+            const currentValue = (this.formControl.value ?? []);
             this.formControl.patchValue(checked
-                ? [...(this.formControl.value ?? []), value]
-                : [...(this.formControl.value ?? [])].filter(o => o !== value));
+                ? [...currentValue, value]
+                : currentValue.filter(o => o !== value));
         }
         else {
-            this.formControl.patchValue({ ...this.formControl.value, [value]: checked });
+            this.formControl.patchValue({ ...(this.formControl.value ?? {}), [value]: checked });
         }
         this.formControl.markAsTouched();
     }
@@ -614,13 +659,15 @@ class CmatMultiCheckboxTypeComponent extends FieldType {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this._urlData.set(datas[0][this.field.props?.domain?.value]);
+                        this._urlData.set(datas[0][this.field.props?.domain?.value] ?? []);
                     }
                     else {
                         this._urlData.set([]);
@@ -636,18 +683,19 @@ class CmatMultiCheckboxTypeComponent extends FieldType {
         }
     }
     isChecked(option) {
-        const value = this.formControl.value;
-        return value && (this.props.type === 'array' ? value.includes(option.value) : value[option.value]);
+        const formValue = this.formControl.value;
+        const optionValue = option.value ?? '';
+        return !!formValue && (this.props.type === 'array' ? formValue.includes(optionValue) : !!formValue[optionValue]);
     }
     trackByFn(index) {
         return index;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatMultiCheckboxTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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?.toString(), $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.9", 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"] }]
+            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?.toString(), $event.checked)\">\r\n    {{ option.label }}\r\n</mat-checkbox>\r\n}\r\n}", styles: [":host{width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { checkboxes: [{
                 type: ViewChildren,
                 args: [MatCheckbox]
@@ -716,13 +764,15 @@ class CmatRadioTypeComponent extends FieldType {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this._urlData.set(datas[0][this.field.props?.domain?.value]);
+                        this._urlData.set(datas[0][this.field.props?.domain?.value] ?? []);
                     }
                     else {
                         this._urlData.set([]);
@@ -792,6 +842,7 @@ class CmatSelectTypeComponent extends FieldType {
                 showToggleAllCheckbox: false
             },
         };
+        this.optionsData = [];
         this.filteredCustomDetails = new ReplaySubject(1);
         this.filteredCache = [];
         this.isIndeterminate = false;
@@ -803,7 +854,7 @@ class CmatSelectTypeComponent extends FieldType {
     }
     get datas() {
         if (isArray(this.field.props?.options)) {
-            return this._urlData?.length > 0 ? this._urlData : this.field.props?.options || [];
+            return this._urlData?.length > 0 ? this._urlData : this.field.props?.options ?? [];
         }
         else {
             return this._urlData?.length > 0 ? this._urlData : this.optionsData || [];
@@ -819,13 +870,15 @@ class CmatSelectTypeComponent extends FieldType {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this._urlData = datas[0][this.field.props?.domain?.value];
+                        this._urlData = datas[0][this.field.props?.domain?.value] ?? [];
                     }
                     else {
                         this._urlData = [];
@@ -877,7 +930,7 @@ class CmatSelectTypeComponent extends FieldType {
         this.filteredCustomDetails.pipe(take(1), takeUntilDestroyed(this._destroyRef))
             .subscribe((val) => {
             if (selectAllValue) {
-                this.formControl.setValue(val.filter(o => !o.disabled));
+                this.formControl.setValue(val.filter((o) => !o.disabled));
             }
             else {
                 this.formControl.setValue([]);
@@ -889,26 +942,24 @@ class CmatSelectTypeComponent extends FieldType {
         if (!this.datas) {
             return;
         }
-        let search = this.multiFilterCtrl.value;
+        const search = (this.multiFilterCtrl.value ?? '').toLowerCase();
         if (!search) {
             this.filteredCache = this.datas.slice();
             this.filteredCustomDetails.next(this.filteredCache);
             return;
         }
-        else {
-            search = search.toLowerCase();
-        }
-        this.filteredCache = this.datas.filter(items => isString(items) ? items.toString().toLowerCase().includes(search) : (items?.value.toString().toLowerCase().includes(search) ?? items?.label.toString().toLowerCase().includes(search)));
+        this.filteredCache = this.datas.filter((items) => this._toSearchText(items.value).toLowerCase().includes(search) || this._toSearchText(items.label).toLowerCase().includes(search));
         this.filteredCustomDetails.next(this.filteredCache);
     }
     setToggleAllCheckboxState() {
         let filteredLength = 0;
         if (this.formControl.value && this.props.search) {
-            const cache = this.filteredCache.filter(o => !o.disabled);
-            const v = isArray(this.formControl.value) || isUndefined(this.formControl.value) ? this.formControl.value : [this.formControl.value];
+            const cache = this.filteredCache.filter((o) => !o.disabled);
+            const currentValue = this.formControl.value;
+            const v = isArray(currentValue) || isUndefined(currentValue) ? currentValue : [currentValue];
             if (v)
                 cache.forEach((el) => {
-                    if (v.findIndex((t) => isString(t) ? el === t : (t?.value === el.value && t?.label === el.label)) > -1) {
+                    if (v.findIndex(t => t != null && this._isSameSelectValue(t, el)) > -1) {
                         filteredLength++;
                     }
                 });
@@ -921,7 +972,16 @@ class CmatSelectTypeComponent extends FieldType {
         }
     }
     compareWithFn(o1, o2) {
-        return o1 && o2 ? o1?.label === o2?.label && o1?.value === o2?.value : o1 === o2;
+        if (!o1 || !o2) {
+            return o1 === o2;
+        }
+        return o1.label === o2.label && o1.value === o2.value;
+    }
+    _isSameSelectValue(left, right) {
+        return left.value === right.value && left.label === right.label;
+    }
+    _toSearchText(value) {
+        return typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean' ? String(value) : '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatSelectTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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 }); }
@@ -954,9 +1014,11 @@ class CmatSelectTreeTypeComponent extends FieldType$1 {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
@@ -1006,9 +1068,11 @@ class CmatSelectTableTypeComponent extends FieldType$1 {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
@@ -1088,18 +1152,24 @@ class CmatTableTypeComponent extends FieldArrayType {
         this._viewContainerRef = inject(ViewContainerRef);
     }
     get fieldArray() {
-        return this.field.fieldArray.fieldGroup;
+        return this._fieldModel.fieldArray?.fieldGroup ?? [];
     }
     get key() {
-        return this.field.fieldArray.fieldGroup[0].id;
+        return this._fieldModel.fieldArray?.fieldGroup?.[0]?.id ?? '';
+    }
+    get _tableProps() {
+        return this.props;
+    }
+    get _fieldModel() {
+        return this.field;
     }
     ngOnInit() {
-        this.columns = this.field.fieldArray.fieldGroup[0].fieldGroup.
-            filter(field => field.props?.showColumn).map(field => ({
-            key: field.key,
+        this.columns = (this._fieldModel.fieldArray?.fieldGroup?.[0]?.fieldGroup ?? [])
+            .filter(field => field.props?.showColumn).map(field => ({
+            key: String(field.key ?? ''),
             label: field.props?.label ?? '',
         }));
-        if (this.props.disabled) {
+        if (this._tableProps.disabled) {
             this.displayedColumns = [...this.columns.map(column => column.key)];
         }
         else {
@@ -1141,11 +1211,13 @@ class CmatTableTypeComponent extends FieldArrayType {
             this.inlineform.markAllAsTouched();
             return;
         }
-        if (this.dialogType == 'add' && this.currentMode[this.key]) {
-            this.add(this.model?.length ?? 0, this.currentMode[this.key]);
+        const model = this.model;
+        const currentValue = this.currentMode[this.key];
+        if (this.dialogType === 'add' && currentValue) {
+            this.add(model?.length ?? 0, currentValue);
         }
-        else if (this.dialogType == 'edit' && this.currentMode[this.key]) {
-            this.model[this.currentIndex] = this.currentMode[this.key];
+        else if (this.dialogType === 'edit' && currentValue && model) {
+            model[this.currentIndex] = currentValue;
         }
         this.table.renderRows();
         this.refreshVersion.update(value => value + 1);
@@ -1178,6 +1250,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 class CmatTagsTypeComponent extends FieldType {
     constructor() {
         super();
+        this.urlData = [];
+        this.optionsData = [];
         this.refreshVersion = signal(0, ...(ngDevMode ? [{ debugName: "refreshVersion" }] : /* istanbul ignore next */ []));
         this._http = inject(HttpClient);
         this._overlay = inject(Overlay);
@@ -1207,13 +1281,15 @@ class CmatTagsTypeComponent extends FieldType {
         if (url && this.field.props?.domain?.code && this.field.props?.domain?.key && this.field.props?.domain?.value) {
             this._http.get(url).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((data) => {
                 if (data) {
+                    const key = this.field.props?.domain?.key;
+                    const code = this.field.props?.domain?.code;
                     const datas = data.filter((i) => {
-                        if (this.field.props?.domain?.key)
-                            return i[this.field.props?.domain?.key] === this.field.props?.domain?.code;
+                        if (key)
+                            return i[key] === code;
                         return false;
                     });
                     if (datas && this.field.props?.domain?.value) {
-                        this.urlData = datas[0][this.field.props?.domain?.value];
+                        this.urlData = datas[0][this.field.props?.domain?.value] ?? [];
                     }
                     else {
                         this.urlData = [];
@@ -1268,8 +1344,8 @@ class CmatTagsTypeComponent extends FieldType {
         });
     }
     filterTags(event) {
-        const value = event.target.value.toLowerCase();
-        this._filteredItems.set(this.tags.filter(tag => tag.label.toString().toLowerCase().includes(value) ?? tag.value.toString().toLowerCase().includes(value)));
+        const value = (event.target?.value ?? '').toLowerCase();
+        this._filteredItems.set(this.tags.filter((tag) => this._toSearchText(tag.label).toLowerCase().includes(value) || this._toSearchText(tag.value).toLowerCase().includes(value)));
     }
     toggleTag(tag) {
         if (tag.disabled)
@@ -1286,7 +1362,10 @@ class CmatTagsTypeComponent extends FieldType {
         this.refreshVersion.update(value => value + 1);
     }
     isCheck(tag) {
-        return this.formControl.value?.filter((i) => i.value === tag.value).length > 0;
+        return (this.formControl.value?.filter((i) => i.value === tag.value).length ?? 0) > 0;
+    }
+    _toSearchText(value) {
+        return typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean' ? String(value) : '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatTagsTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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\" [attr.data-refresh]=\"refreshVersion()\" [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>\r\n", 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 }); }
@@ -1344,13 +1423,13 @@ class CmatUploadTypeComponent extends FieldType {
         }
     }
     upload(id) {
-        var rootValue = this.baseGroup.get('uploadId')?.value;
+        const rootValue = this.baseGroup.get('uploadId')?.value;
         if (rootValue && !isNil(id)) {
             this.baseGroup.get('uploadId')?.setValue([id, ...rootValue]);
         }
     }
     remove(id) {
-        var rootValue = this.baseGroup.get('removeId')?.value;
+        const rootValue = this.baseGroup.get('removeId')?.value;
         if (rootValue && !isNil(id)) {
             this.baseGroup.get('removeId')?.setValue([id, ...rootValue]);
         }
@@ -1358,12 +1437,12 @@ class CmatUploadTypeComponent extends FieldType {
     updateData(i) {
         const data = Array.isArray(i) ? i : [i];
         this.formControl.setValue(data.map((j) => {
-            if (j.id)
+            if (typeof j === 'object' && j !== null && 'id' in j && typeof j.id === 'string')
                 return {
-                    id: j.id,
-                    name: j.name,
-                    type: j.type,
-                    size: j.size
+                    id: String((j).id),
+                    name: typeof j.name === 'string' ? j.name : '',
+                    type: typeof j.type === 'string' ? j.type : '',
+                    size: Number(j.size ?? 0)
                 };
             else
                 return j;
@@ -1403,7 +1482,7 @@ class CmatQuillTypeComponent extends FieldType {
                     image: this._imgFileHandler.bind(this),
                     video: this._videoFileHandler.bind(this),
                     word: () => {
-                        this._wordFileHandler().catch(err => console.error('Word 导出失败:', err));
+                        this._wordFileHandler().catch((err) => console.error('Word 导出失败:', err));
                     },
                 },
             },
@@ -1445,6 +1524,9 @@ class CmatQuillTypeComponent extends FieldType {
         }
     }
     fileChangeEvent(file) {
+        if (!file) {
+            return;
+        }
         const fileModel = {
             id: null,
             fileName: file.name,
@@ -1461,12 +1543,16 @@ class CmatQuillTypeComponent extends FieldType {
         formData.append('fileInfo', JSON.stringify(fileModel));
         this._fileService.uploadFile(formData).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((event) => {
             if (event.type === HttpEventType.Response) {
-                this._editorInstance.insertEmbed(this._editorInstance.getSelection(true).index, this._getMediaType(file.type), `${this._config.fileUrl}/download/quill/${event.body.id}`);
+                const fileId = typeof event.body?.id === 'string' ? event.body.id : undefined;
+                if (typeof fileId !== 'string') {
+                    return;
+                }
+                this._editorInstance.insertEmbed(this._editorInstance.getSelection(true).index, this._getMediaType(file.type), `${this._config.fileUrl}/download/quill/${fileId}`);
                 this._editorInstance.setSelection(this._editorInstance.getSelection(true).index + 1);
                 this.formControl.setValue(this._editorInstance.container.innerHTML);
-                this._upload(event.body.id);
+                this._upload(fileId);
             }
-            this.refreshVersion.update(value => value + 1);
+            this.refreshVersion.update((value) => value + 1);
         });
     }
     editorCreated(editorInstance) {
@@ -1480,20 +1566,20 @@ class CmatQuillTypeComponent extends FieldType {
             }
         });
     }
-    contentChanged(editorInstance) {
+    contentChanged(contentChange) {
         const dom = document.createElement('DIV');
-        dom.innerHTML = editorInstance.editor.container.innerHTML;
+        dom.innerHTML = contentChange.editor.container.innerHTML;
         const fileDom = dom.querySelectorAll('img, video');
         const arr = [];
         fileDom.forEach((i) => {
             if (i.src.includes(this._config.fileUrl)) {
                 const id = i.src.substring(`${this._config.fileUrl}/download/quill/`.length, i.src.length);
-                this._imgIds.splice(this._imgIds.findIndex(k => k === id), 1);
+                this._imgIds.splice(this._imgIds.findIndex((k) => k === id), 1);
                 arr.push(id);
             }
         });
         this._imgIds.forEach((i) => {
-            var rootValue = this.baseGroup.get('removeId')?.value;
+            const rootValue = this.baseGroup.get('removeId')?.value;
             if (rootValue && !isNil(i)) {
                 this.baseGroup.get('removeId')?.setValue([i, ...rootValue]);
             }
@@ -1529,7 +1615,7 @@ class CmatQuillTypeComponent extends FieldType {
         let currentListLevel = 0;
         let isList = false;
         for (const op of delta.ops) {
-            if (op.insert?.image) {
+            if (typeof op.insert !== 'string' && op.insert?.image) {
                 if (currentRun.length > 0) {
                     children.push(new Paragraph({ children: currentRun }));
                     currentRun = [];
@@ -1567,7 +1653,7 @@ class CmatQuillTypeComponent extends FieldType {
             }
         }
         if (currentRun.length > 0) {
-            children.push(this._createParagraph(currentRun, null, isList, currentListLevel));
+            children.push(this._createParagraph(currentRun, undefined, isList, currentListLevel));
         }
         return children;
     }
@@ -1580,25 +1666,23 @@ class CmatQuillTypeComponent extends FieldType {
             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
+            highlight: attributes?.background ? this._mapHighlightColor(attributes.background) : undefined
         });
     }
     _createParagraph(runs, attributes, isList, listLevel) {
+        const headerLevel = attributes?.header ? (typeof attributes.header === 'number' ? attributes.header : parseInt(attributes.header)) : undefined;
         const paragraphOptions = {
             children: runs,
             alignment: this._mapAlignment(attributes?.align),
+            ...(headerLevel && headerLevel >= 1 && headerLevel <= 6 ? {
+                heading: HeadingLevel[`HEADING_${headerLevel}`]
+            } : {}),
+            ...(isList && attributes?.list ? {
+                bullet: {
+                    level: listLevel ?? 0
+                }
+            } : {})
         };
-        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) {
@@ -1710,11 +1794,47 @@ class CmatQuillTypeComponent extends FieldType {
         }
         return undefined;
     }
-    _dropFileHandler(dataUrl, type, fileData) {
+    _mapHighlightColor(color) {
+        const hex = this._parseColor(color);
+        if (!hex)
+            return HighlightColor.NONE;
+        const r = parseInt(hex.substring(0, 2), 16);
+        const g = parseInt(hex.substring(2, 4), 16);
+        const b = parseInt(hex.substring(4, 6), 16);
+        const colorMap = {
+            [HighlightColor.YELLOW]: [255, 255, 0],
+            [HighlightColor.GREEN]: [0, 128, 0],
+            [HighlightColor.CYAN]: [0, 255, 255],
+            [HighlightColor.RED]: [255, 0, 0],
+            [HighlightColor.BLUE]: [0, 0, 255],
+            [HighlightColor.MAGENTA]: [255, 0, 255],
+            [HighlightColor.DARK_BLUE]: [0, 0, 139],
+            [HighlightColor.DARK_CYAN]: [0, 139, 139],
+            [HighlightColor.DARK_GREEN]: [0, 100, 0],
+            [HighlightColor.DARK_MAGENTA]: [139, 0, 139],
+            [HighlightColor.DARK_RED]: [139, 0, 0],
+            [HighlightColor.DARK_YELLOW]: [128, 128, 0],
+            [HighlightColor.DARK_GRAY]: [169, 169, 169],
+            [HighlightColor.LIGHT_GRAY]: [211, 211, 211],
+            [HighlightColor.BLACK]: [0, 0, 0],
+            [HighlightColor.WHITE]: [255, 255, 255],
+        };
+        let closestColor = HighlightColor.NONE;
+        let minDistance = Infinity;
+        for (const [name, [cr, cg, cb]] of Object.entries(colorMap)) {
+            const distance = (r - cr) ** 2 + (g - cg) ** 2 + (b - cb) ** 2;
+            if (distance < minDistance) {
+                minDistance = distance;
+                closestColor = name;
+            }
+        }
+        return closestColor;
+    }
+    _dropFileHandler(_dataUrl, _type, fileData) {
         this.fileChangeEvent(fileData.toFile());
     }
     _upload(id) {
-        var rootValue = this.baseGroup.get('uploadId')?.value;
+        const rootValue = this.baseGroup.get('uploadId')?.value;
         if (rootValue && !isNil(id)) {
             this.baseGroup.get('uploadId')?.setValue([id, ...rootValue]);
         }
@@ -1743,11 +1863,11 @@ class CmatQuillTypeComponent extends FieldType {
         return baseControl;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatQuillTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", 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>\r\n<div class=\"cmat-quill-type\" [attr.data-refresh]=\"refreshVersion()\">\r\n", 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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", 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] ?? undefined)\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0] ?? undefined)\" />\r\n</quill-editor>\r\n<div class=\"cmat-quill-type\" [attr.data-refresh]=\"refreshVersion()\">\r\n", 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.9", 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    \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>\r\n<div class=\"cmat-quill-type\" [attr.data-refresh]=\"refreshVersion()\">\r\n", 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] ?? undefined)\" />\r\n    <input #videoInput type=\"file\" accept=\"video/mpeg,video/mp4,audio/mp4\" class=\"hidden\" (change)=\"fileChangeEvent(videoInput.files?.[0] ?? undefined)\" />\r\n</quill-editor>\r\n<div class=\"cmat-quill-type\" [attr.data-refresh]=\"refreshVersion()\">\r\n", styles: [":host{display:block;width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { imgInput: [{
                 type: ViewChild,
                 args: ['imgInput']