cmat 0.0.81 → 0.0.83

package/fesm2022/cmat.mjs

@@ -34,7 +34,7 @@ import { PortalModule, TemplatePortal, ComponentPortal } from '@angular/cdk/port
 import { MatFormFieldControl, MatFormFieldModule, MatFormField } from '@angular/material/form-field';
 import * as i1$3 from '@angular/material/input';
 import { MatInputModule, MAT_INPUT_VALUE_ACCESSOR } from '@angular/material/input';
-import { Subject, startWith, debounceTime, map as map$1, ReplaySubject, of, take, Subscription, merge, combineLatest, fromEvent, forkJoin, Observable, catchError, tap as tap$1, EMPTY, finalize, throwError } from 'rxjs';
+import { Subject, startWith, debounceTime, map as map$1, ReplaySubject, of, take, Subscription, Observable, merge, combineLatest, fromEvent, forkJoin, catchError, tap as tap$1, EMPTY, finalize, throwError } from 'rxjs';
 import { ENTER, COMMA as COMMA$1, hasModifierKey } from '@angular/cdk/keycodes';
 import * as i3 from '@angular/material/autocomplete';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
@@ -84,7 +84,7 @@ import { CmatUploadQueueComponent as CmatUploadQueueComponent$1, CmatFilesUtilSe
 import BlotFormatter from '@enzedonline/quill-blot-formatter2';
 import { CmatUrlStateConfigService as CmatUrlStateConfigService$1, CmatConfigService as CmatConfigService$1 } from 'cmat/services/config';
 import { CmatUtilsService as CmatUtilsService$1 } from 'cmat/services/utils';
-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 { saveAs } from 'file-saver-es';
 import * as i2$5 from 'ngx-quill';
@@ -262,7 +262,7 @@ const CMAT_DATETIME_FORMATS = new InjectionToken('cmat-datetime-formats');
 const DEFAULT_HOUR_NAMES = range$2(24, i => String(i));
 const DEFAULT_MINUTE_NAMES = range$2(60, i => String(i));
 function range$2(length, valueFunction) {
-    const valuesArray = Array(length);
+    const valuesArray = new Array(length);
     for (let i = 0; i < length; i++) {
         valuesArray[i] = valueFunction(i);
     }
@@ -374,13 +374,13 @@ const CMAT_NATIVE_DATETIME_FORMATS = {
         yearInput: { year: 'numeric' },
         monthYearLabel: { year: 'numeric', month: 'short' },
         dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },
-        monthYearA11yLabel: { year: 'numeric', month: 'long' },
-        popupHeaderDateLabel: { weekday: 'short', month: 'short', day: '2-digit' }
+        monthYearA11yLabel: 'MMMM yyyy',
+        popupHeaderDateLabel: 'EEE, MMM dd'
     }
 };
 
 function range$1(length, valueFunction) {
-    const valuesArray = Array(length);
+    const valuesArray = new Array(length);
     for (let i = 0; i < length; i++) {
         valuesArray[i] = valueFunction(i);
     }
@@ -390,8 +390,9 @@ class DayjsDatetimeAdapter extends DatetimeAdapter {
     constructor() {
         const matDateLocale = inject(MAT_DATE_LOCALE, { optional: true });
         const _delegate = inject(DateAdapter);
+        const locale = typeof matDateLocale === 'string' ? matDateLocale : dayjs.locale();
         super(_delegate);
-        this.setLocale(matDateLocale || dayjs.locale());
+        this.setLocale(locale);
         dayjs.extend(localeData);
     }
     setLocale(locale) {
@@ -498,7 +499,7 @@ function CMAT_DAYJS_DATE_ADAPTER_OPTIONS_FACTORY() {
     };
 }
 function range(length, valueFunction) {
-    const valuesArray = Array(length);
+    const valuesArray = new Array(length);
     for (let i = 0; i < length; i++) {
         valuesArray[i] = valueFunction(i);
     }
@@ -509,7 +510,7 @@ class DayjsDateAdapter extends DateAdapter {
         super();
         this._options = inject(CMAT_DAYJS_DATE_ADAPTER_OPTIONS, { optional: true });
         const dateLocale = inject(MAT_DATE_LOCALE, { optional: true });
-        this._initializeParser(dateLocale);
+        this._initializeParser(dateLocale ?? undefined);
     }
     get _shouldUseUtc() {
         const { useUtc } = this._options ?? {};
@@ -578,10 +579,14 @@ class DayjsDateAdapter extends DateAdapter {
         return this._dayJs();
     }
     parse(value, parseFormat) {
+        const locale = this.locale;
         if (value && typeof value === 'string') {
-            return this._dayJs(value, parseFormat, this.locale);
+            return this._dayJs(value, parseFormat, locale);
         }
-        return value ? this._dayJs(value).locale(this.locale) : null;
+        if (value instanceof Date || dayjs.isDayjs(value)) {
+            return this._dayJs(value).locale(locale);
+        }
+        return null;
     }
     format(date, displayFormat) {
         if (!this.isValid(date)) {
@@ -613,7 +618,7 @@ class DayjsDateAdapter extends DateAdapter {
             if (!value) {
                 return null;
             }
-            date = this._dayJs(value).toISOString();
+            date = this._dayJs(value);
         }
         if (date && this.isValid(date)) {
             return this._dayJs(date); // NOTE: Is this necessary since Dayjs is immutable and Moment was not?
@@ -631,9 +636,10 @@ class DayjsDateAdapter extends DateAdapter {
     }
     _dayJs(input, format, locale) {
         if (!this._shouldUseUtc) {
-            return dayjs(input, { format, locale }, locale);
+            return dayjs(input, format, locale);
         }
-        return dayjs(input, { format, locale, utc: this._shouldUseUtc }, locale).utc();
+        const utcDate = format ? dayjs.utc(input, format) : dayjs.utc(input);
+        return locale ? utcDate.locale(locale) : utcDate;
     }
     _initializeParser(dateLocale) {
         if (this._shouldUseUtc) {
@@ -642,7 +648,7 @@ class DayjsDateAdapter extends DateAdapter {
         dayjs.extend(LocalizedFormat);
         dayjs.extend(customParseFormat);
         dayjs.extend(localeData);
-        this.setLocale(dateLocale);
+        this.setLocale(dateLocale ?? dayjs.locale());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DayjsDateAdapter, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DayjsDateAdapter }); }
@@ -1103,7 +1109,7 @@ class CmatCarouselComponent {
         this._numVisible = val;
     }
     get numScroll() {
-        return this._numVisible;
+        return this._numScroll;
     }
     set numScroll(val) {
         this._numScroll = val;
@@ -1239,7 +1245,7 @@ class CmatCarouselComponent {
             let page = this._page;
             if (this.totalDots() !== 0 && page >= this.totalDots()) {
                 page = this.totalDots() - 1;
-                this._page = page;
+                this._page = page ?? 0;
                 this.pageEvent.emit({
                     page: this.page
                 });
@@ -1464,7 +1470,7 @@ class CmatCarouselComponent {
         }
     }
     _onRightKey() {
-        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]'))];
+        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]') ?? [])];
         const activeIndex = this._findFocusedIndicatorIndex();
         this._changedFocusedIndicator(activeIndex, activeIndex + 1 === indicators.length ? indicators.length - 1 : activeIndex + 1);
     }
@@ -1477,23 +1483,23 @@ class CmatCarouselComponent {
         this._changedFocusedIndicator(activeIndex, 0);
     }
     _onEndKey() {
-        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]'))];
+        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]') ?? [])];
         const activeIndex = this._findFocusedIndicatorIndex();
         this._changedFocusedIndicator(activeIndex, indicators.length - 1);
     }
     _onTabKey() {
-        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]'))];
-        const highlightedIndex = indicators.findIndex(ind => ind.getAttribute('cmat-carousel-highlight') != undefined);
+        const indicators = Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]') ?? []);
+        const highlightedIndex = indicators.findIndex((ind) => ind.getAttribute('cmat-carousel-highlight') !== undefined);
         const activeIndicator = this.indicatorContent?.nativeElement ? this.indicatorContent?.nativeElement.querySelector('[data-pc-section="indicator"] > button[tabindex="0"]') : null;
-        const activeIndex = indicators.findIndex(ind => ind === activeIndicator.parentElement);
-        indicators[activeIndex].children[0].tabIndex = '-1';
-        indicators[highlightedIndex].children[0].tabIndex = '0';
+        const activeIndex = indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
+        indicators[activeIndex]?.children[0] && (indicators[activeIndex].children[0].tabIndex = -1);
+        indicators[highlightedIndex]?.children[0] && (indicators[highlightedIndex].children[0].tabIndex = 0);
     }
     _changedFocusedIndicator(prevInd, nextInd) {
-        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]'))];
-        indicators[prevInd].children[0].tabIndex = '-1';
-        indicators[nextInd].children[0].tabIndex = '0';
-        indicators[nextInd].children[0].focus();
+        const indicators = Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]') ?? []);
+        indicators[prevInd]?.children[0] && (indicators[prevInd].children[0].tabIndex = -1);
+        indicators[nextInd]?.children[0] && (indicators[nextInd].children[0].tabIndex = 0);
+        indicators[nextInd]?.children[0]?.focus();
     }
     _step(dir, page) {
         let totalShiftedItems = this.totalShiftedItems;
@@ -1531,7 +1537,7 @@ class CmatCarouselComponent {
             this.itemsContainer.nativeElement.style.transition = 'transform 500ms ease 0s';
         }
         this.totalShiftedItems = totalShiftedItems;
-        this._page = page;
+        this._page = page ?? 0;
         this.pageEvent.emit({
             page: this.page
         });
@@ -1566,9 +1572,9 @@ class CmatCarouselComponent {
         this.refreshVersion.update(value => value + 1);
     }
     _findFocusedIndicatorIndex() {
-        const indicators = [...Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]'))];
+        const indicators = Array.from(this.indicatorContent?.nativeElement.querySelectorAll('[data-pc-section="indicator"]') ?? []);
         const activeIndicator = this.indicatorContent?.nativeElement ? this.indicatorContent?.nativeElement.querySelector('[data-pc-section="indicator"] > button[tabindex="0"]') : null;
-        return indicators.findIndex(ind => ind === activeIndicator.parentElement);
+        return indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
     }
     _createStyle() {
         if (!this.carouselStyle) {
@@ -1585,11 +1591,11 @@ class CmatCarouselComponent {
                 const value1 = data1.breakpoint;
                 const value2 = data2.breakpoint;
                 let result;
-                if (value1 == null && value2 != null)
+                if (value1 === null && value2 !== null)
                     result = -1;
-                else if (value1 != null && value2 == null)
+                else if (value1 !== null && value2 === null)
                     result = 1;
-                else if (value1 == null && value2 == null)
+                else if (value1 === null && value2 === null)
                     result = 0;
                 else if (typeof value1 === 'string' && typeof value2 === 'string')
                     result = value1.localeCompare(value2, undefined, { numeric: true });
@@ -1608,7 +1614,7 @@ class CmatCarouselComponent {
             }
         }
         if (this.carouselStyle) {
-            this.carouselStyle.innerHTML = innerHTML;
+            this.renderer.setProperty(this.carouselStyle, 'textContent', innerHTML);
         }
     }
     _calculatePosition() {
@@ -1765,11 +1771,11 @@ class CmatCascadeBottomSheetComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatCascadeBottomSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatCascadeBottomSheetComponent, isStandalone: true, selector: "cmat-cascade-bottom-sheet", exportAs: ["cmatCascadeBottomSheet"], ngImport: i0, template: "<div role=\"presentation\" class=\"cmat-cascade-bottom-sheet\" (click)=\"clickHandle($event)\">\r\n  <div class=\"sheet-header flex items-center\">\r\n    <p class=\"sheet-title\">{{root.placeholder}}</p>\r\n    <button type=\"button\" matIconButton  (click)=\"root.bottomSheetRef.dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n  <mat-tab-group [selectedIndex]=\"selected.value\" (selectedIndexChange)=\"selected.setValue($event);\">\r\n    @for (menuItem of root.steps; track step; let step = $index) {\r\n      <mat-tab\r\n        [label]=\"labels[step] || '\u9009\u62E9'\">\r\n        <mat-list class=\"menu-list overflow-y-auto scrollbar-custom\">\r\n          @for (listItem of menuItem; track i; let i = $index) {\r\n            <mat-list-item class=\"menu-item\"\r\n              [class.active]=\"listItem.active\" [class.disabled]=\"listItem.disabled\"\r\n              (click)=\"root.selectHandle($event, step, i); select(listItem.disabled,listItem.label);\">\r\n              <div matLine>{{listItem.label}}</div>\r\n            </mat-list-item>\r\n          }\r\n        </mat-list>\r\n      </mat-tab>\r\n    }\r\n  </mat-tab-group>\r\n</div>", styles: [".cmat-cascade-bottom-sheet{padding:0;margin:-8px -16px}.cmat-cascade-bottom-sheet .sheet-header{display:flex;flex:1 1 0%;align-items:center;font-size:1rem;border-bottom-width:1px;padding:12px 16px}.cmat-cascade-bottom-sheet .sheet-header .sheet-title{margin:0;padding:0;letter-spacing:.05rem;text-align:center;flex-grow:1}.cmat-cascade-bottom-sheet .menu-list{vertical-align:top;box-sizing:border-box;margin:0;padding:0;width:100%;overflow:hidden;position:relative;height:204px}.cmat-cascade-bottom-sheet .menu-item{padding:0 16px;text-overflow:ellipsis;box-sizing:border-box;cursor:pointer!important;font-size:14px;line-height:3em}.cmat-cascade-bottom-sheet .menu-item.disabled{cursor:not-allowed!important;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.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: MatListModule }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatCascadeBottomSheetComponent, isStandalone: true, selector: "cmat-cascade-bottom-sheet", exportAs: ["cmatCascadeBottomSheet"], ngImport: i0, template: "<div role=\"presentation\" class=\"cmat-cascade-bottom-sheet\" (click)=\"clickHandle($event)\">\r\n  <div class=\"sheet-header flex items-center\">\r\n    <p class=\"sheet-title\">{{root.placeholder}}</p>\r\n    <button type=\"button\" matIconButton  (click)=\"root.bottomSheetRef.dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n  <mat-tab-group [selectedIndex]=\"selected.value\" (selectedIndexChange)=\"selected.setValue($event);\">\r\n    @for (menuItem of root.steps; track step; let step = $index) {\r\n      <mat-tab\r\n        [label]=\"labels[step] || '\u9009\u62E9'\">\r\n        <mat-list class=\"menu-list overflow-y-auto scrollbar-custom\">\r\n          @for (listItem of menuItem; track i; let i = $index) {\r\n            <mat-list-item class=\"menu-item\"\r\n              [class.active]=\"listItem.active\" [class.disabled]=\"listItem.disabled\"\r\n              (click)=\"root.selectHandle($event, step, i); select(listItem.disabled ?? false, listItem.label ?? '');\">\r\n              <div matLine>{{listItem.label}}</div>\r\n            </mat-list-item>\r\n          }\r\n        </mat-list>\r\n      </mat-tab>\r\n    }\r\n  </mat-tab-group>\r\n</div>", styles: [".cmat-cascade-bottom-sheet{padding:0;margin:-8px -16px}.cmat-cascade-bottom-sheet .sheet-header{display:flex;flex:1 1 0%;align-items:center;font-size:1rem;border-bottom-width:1px;padding:12px 16px}.cmat-cascade-bottom-sheet .sheet-header .sheet-title{margin:0;padding:0;letter-spacing:.05rem;text-align:center;flex-grow:1}.cmat-cascade-bottom-sheet .menu-list{vertical-align:top;box-sizing:border-box;margin:0;padding:0;width:100%;overflow:hidden;position:relative;height:204px}.cmat-cascade-bottom-sheet .menu-item{padding:0 16px;text-overflow:ellipsis;box-sizing:border-box;cursor:pointer!important;font-size:14px;line-height:3em}.cmat-cascade-bottom-sheet .menu-item.disabled{cursor:not-allowed!important;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.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: MatListModule }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatCascadeBottomSheetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-cascade-bottom-sheet', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatCascadeBottomSheet', imports: [MatButtonModule, MatTabsModule, MatListModule, MatIconModule], template: "<div role=\"presentation\" class=\"cmat-cascade-bottom-sheet\" (click)=\"clickHandle($event)\">\r\n  <div class=\"sheet-header flex items-center\">\r\n    <p class=\"sheet-title\">{{root.placeholder}}</p>\r\n    <button type=\"button\" matIconButton  (click)=\"root.bottomSheetRef.dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n  <mat-tab-group [selectedIndex]=\"selected.value\" (selectedIndexChange)=\"selected.setValue($event);\">\r\n    @for (menuItem of root.steps; track step; let step = $index) {\r\n      <mat-tab\r\n        [label]=\"labels[step] || '\u9009\u62E9'\">\r\n        <mat-list class=\"menu-list overflow-y-auto scrollbar-custom\">\r\n          @for (listItem of menuItem; track i; let i = $index) {\r\n            <mat-list-item class=\"menu-item\"\r\n              [class.active]=\"listItem.active\" [class.disabled]=\"listItem.disabled\"\r\n              (click)=\"root.selectHandle($event, step, i); select(listItem.disabled,listItem.label);\">\r\n              <div matLine>{{listItem.label}}</div>\r\n            </mat-list-item>\r\n          }\r\n        </mat-list>\r\n      </mat-tab>\r\n    }\r\n  </mat-tab-group>\r\n</div>", styles: [".cmat-cascade-bottom-sheet{padding:0;margin:-8px -16px}.cmat-cascade-bottom-sheet .sheet-header{display:flex;flex:1 1 0%;align-items:center;font-size:1rem;border-bottom-width:1px;padding:12px 16px}.cmat-cascade-bottom-sheet .sheet-header .sheet-title{margin:0;padding:0;letter-spacing:.05rem;text-align:center;flex-grow:1}.cmat-cascade-bottom-sheet .menu-list{vertical-align:top;box-sizing:border-box;margin:0;padding:0;width:100%;overflow:hidden;position:relative;height:204px}.cmat-cascade-bottom-sheet .menu-item{padding:0 16px;text-overflow:ellipsis;box-sizing:border-box;cursor:pointer!important;font-size:14px;line-height:3em}.cmat-cascade-bottom-sheet .menu-item.disabled{cursor:not-allowed!important;pointer-events:none}\n"] }]
+            args: [{ selector: 'cmat-cascade-bottom-sheet', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatCascadeBottomSheet', imports: [MatButtonModule, MatTabsModule, MatListModule, MatIconModule], template: "<div role=\"presentation\" class=\"cmat-cascade-bottom-sheet\" (click)=\"clickHandle($event)\">\r\n  <div class=\"sheet-header flex items-center\">\r\n    <p class=\"sheet-title\">{{root.placeholder}}</p>\r\n    <button type=\"button\" matIconButton  (click)=\"root.bottomSheetRef.dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n  <mat-tab-group [selectedIndex]=\"selected.value\" (selectedIndexChange)=\"selected.setValue($event);\">\r\n    @for (menuItem of root.steps; track step; let step = $index) {\r\n      <mat-tab\r\n        [label]=\"labels[step] || '\u9009\u62E9'\">\r\n        <mat-list class=\"menu-list overflow-y-auto scrollbar-custom\">\r\n          @for (listItem of menuItem; track i; let i = $index) {\r\n            <mat-list-item class=\"menu-item\"\r\n              [class.active]=\"listItem.active\" [class.disabled]=\"listItem.disabled\"\r\n              (click)=\"root.selectHandle($event, step, i); select(listItem.disabled ?? false, listItem.label ?? '');\">\r\n              <div matLine>{{listItem.label}}</div>\r\n            </mat-list-item>\r\n          }\r\n        </mat-list>\r\n      </mat-tab>\r\n    }\r\n  </mat-tab-group>\r\n</div>", styles: [".cmat-cascade-bottom-sheet{padding:0;margin:-8px -16px}.cmat-cascade-bottom-sheet .sheet-header{display:flex;flex:1 1 0%;align-items:center;font-size:1rem;border-bottom-width:1px;padding:12px 16px}.cmat-cascade-bottom-sheet .sheet-header .sheet-title{margin:0;padding:0;letter-spacing:.05rem;text-align:center;flex-grow:1}.cmat-cascade-bottom-sheet .menu-list{vertical-align:top;box-sizing:border-box;margin:0;padding:0;width:100%;overflow:hidden;position:relative;height:204px}.cmat-cascade-bottom-sheet .menu-item{padding:0 16px;text-overflow:ellipsis;box-sizing:border-box;cursor:pointer!important;font-size:14px;line-height:3em}.cmat-cascade-bottom-sheet .menu-item.disabled{cursor:not-allowed!important;pointer-events:none}\n"] }]
         }], ctorParameters: () => [] });
 
 class CmatCascadeMenuComponent {
@@ -2000,7 +2006,8 @@ class CmatCascadeListComponent {
                 ...item,
                 active: false
             }));
-            return this.steps.push(nativeNext);
+            this.steps.push(nativeNext);
+            return;
         }
         this._changeLabels();
         if (this.overlayRef?.hasAttached()) {
@@ -2027,7 +2034,8 @@ class CmatCascadeListComponent {
     _initSteps(index, options) {
         const step = [];
         options.map((item) => {
-            if (this.value[index].value === item.value || (this.allowLabelValue && this.value[index].label === item.label)) {
+            if (this.value?.[index] &&
+                (this.value[index].value === item.value || (this.allowLabelValue && this.value[index].label === item.label))) {
                 if (!isUndefined(item.children))
                     options = item.children;
                 step.push(({
@@ -2041,7 +2049,7 @@ class CmatCascadeListComponent {
         });
         this.steps.push(step);
         index += 1;
-        if (index < this.value.length) {
+        if (this.value && index < this.value.length) {
             this._initSteps(index, options);
         }
     }
@@ -2386,6 +2394,7 @@ class CmatCodeEditorComponent {
     get editorOptions() {
         return {
             ...this.options,
+            readOnly: this.readOnly,
             theme: this.options?.theme ?? (this._isDarkTheme ? 'vs-dark' : 'vs')
         };
     }
@@ -2393,11 +2402,11 @@ class CmatCodeEditorComponent {
         return this._document.documentElement.classList.contains('dark') || this._document.body.classList.contains('dark');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatCodeEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatCodeEditorComponent, isStandalone: true, selector: "cmat-code-editor", inputs: { value: "value", language: "language", height: "height", readOnly: "readOnly", options: "options" }, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n@defer (on viewport) {\r\n    <div class=\"rounded-2xl border border-default bg-card p-2 shadow-sm\">\r\n        <ngx-monaco-editor class=\"block\" [style.height]=\"height\" [options]=\"editorOptions\" [model]=\"model\"></ngx-monaco-editor>\r\n    </div>\r\n} @placeholder {\r\n    <div class=\"flex items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\" [style.minHeight]=\"height\">\r\n        \u4EE3\u7801\u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->\r\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [EditorComponent]] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatCodeEditorComponent, isStandalone: true, selector: "cmat-code-editor", inputs: { value: "value", language: "language", height: "height", readOnly: "readOnly", options: "options" }, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n@defer (on viewport) {\r\n    <div class=\"rounded-2xl border border-default bg-card p-2 shadow-sm\">\r\n        <ngx-monaco-editor class=\"block\" [style.height]=\"height\" [options]=\"editorOptions\" [model]=\"model\"></ngx-monaco-editor>\r\n    </div>\r\n} @placeholder {\r\n    <div class=\"flex items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\" [style.minHeight]=\"height\">\r\n        \u4EE3\u7801\u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n\r\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [EditorComponent]] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatCodeEditorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-code-editor', changeDetection: ChangeDetectionStrategy.OnPush, imports: [EditorComponent], template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n@defer (on viewport) {\r\n    <div class=\"rounded-2xl border border-default bg-card p-2 shadow-sm\">\r\n        <ngx-monaco-editor class=\"block\" [style.height]=\"height\" [options]=\"editorOptions\" [model]=\"model\"></ngx-monaco-editor>\r\n    </div>\r\n} @placeholder {\r\n    <div class=\"flex items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\" [style.minHeight]=\"height\">\r\n        \u4EE3\u7801\u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->\r\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'cmat-code-editor', changeDetection: ChangeDetectionStrategy.OnPush, imports: [EditorComponent], template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n@defer (on viewport) {\r\n    <div class=\"rounded-2xl border border-default bg-card p-2 shadow-sm\">\r\n        <ngx-monaco-editor class=\"block\" [style.height]=\"height\" [options]=\"editorOptions\" [model]=\"model\"></ngx-monaco-editor>\r\n    </div>\r\n} @placeholder {\r\n    <div class=\"flex items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\" [style.minHeight]=\"height\">\r\n        \u4EE3\u7801\u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n\r\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { value: [{
                 type: Input
             }], language: [{
@@ -2411,13 +2420,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             }] } });
 
 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'];
     }
 }
@@ -2551,8 +2561,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() {
@@ -2570,9 +2583,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'
@@ -2583,14 +2607,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} }`);
@@ -2600,13 +2631,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: i1$1.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() {
@@ -2630,9 +2661,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) {
@@ -2672,6 +2705,8 @@ class CmatCheckListTypeComponent extends FieldType {
         super();
         this.isIndeterminate = false;
         this.isChecked = false;
+        this.urlData = [];
+        this.optionsData = [];
         this.checklist = [];
         this.filteredData = [];
         this._http = inject(HttpClient);
@@ -2700,13 +2735,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 = [];
@@ -2725,7 +2762,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();
         });
     }
@@ -2733,7 +2770,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();
     }
@@ -2768,7 +2807,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) {
@@ -2800,35 +2840,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$9.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: i1.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$9.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: i1.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 = [];
@@ -2933,15 +2985,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();
     }
@@ -2950,13 +3004,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([]);
@@ -2972,18 +3028,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$9.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$9.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]
@@ -3052,13 +3109,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([]);
@@ -3128,6 +3187,7 @@ class CmatSelectTypeComponent extends FieldType {
                 showToggleAllCheckbox: false
             },
         };
+        this.optionsData = [];
         this.filteredCustomDetails = new ReplaySubject(1);
         this.filteredCache = [];
         this.isIndeterminate = false;
@@ -3139,7 +3199,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 || [];
@@ -3155,13 +3215,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 = [];
@@ -3213,7 +3275,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([]);
@@ -3225,26 +3287,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++;
                     }
                 });
@@ -3257,7 +3317,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: i2$3.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: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i3.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: CmatSelectSearchComponent$1, 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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -3290,9 +3359,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) {
@@ -3342,9 +3413,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) {
@@ -3424,18 +3497,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 {
@@ -3477,11 +3556,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);
@@ -3514,6 +3595,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);
@@ -3543,13 +3626,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 = [];
@@ -3604,8 +3689,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)
@@ -3622,7 +3707,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: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$9.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 }); }
@@ -3680,13 +3768,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]);
         }
@@ -3694,12 +3782,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;
@@ -3739,7 +3827,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));
                     },
                 },
             },
@@ -3781,6 +3869,9 @@ class CmatQuillTypeComponent extends FieldType {
         }
     }
     fileChangeEvent(file) {
+        if (!file) {
+            return;
+        }
         const fileModel = {
             id: null,
             fileName: file.name,
@@ -3797,12 +3888,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) {
@@ -3816,20 +3911,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]);
             }
@@ -3865,7 +3960,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 = [];
@@ -3903,7 +3998,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;
     }
@@ -3916,25 +4011,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) {
@@ -4046,11 +4139,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]);
         }
@@ -4079,11 +4208,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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: QuillModule }, { kind: "component", type: i2$5.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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: QuillModule }, { kind: "component", type: i2$5.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']
@@ -4143,13 +4272,14 @@ class CmatDateRangeComponent {
         this.initData = true;
         this.rangeChanged = new EventEmitter();
         this.activeDates = {
-            month1: null,
-            month2: null
+            month1: dayjs(),
+            month2: dayjs().add(1, 'month')
         };
         this.refreshVersion = signal(0, ...(ngDevMode ? [{ debugName: "refreshVersion" }] : /* istanbul ignore next */ []));
         this.setWhichDate = 'start';
         this._overlay = inject(Overlay);
         this._viewContainerRef = inject(ViewContainerRef);
+        this._overlayRef = null;
         this._range = {
             start: null,
             end: null
@@ -4200,8 +4330,8 @@ class CmatDateRangeComponent {
         this._timeRange = value;
         if (!value && this._range?.start && this._range?.end) {
             this.range = {
-                start: this._range.start.clone().startOf('day'),
-                end: this._range.end.clone().endOf('day')
+                start: this._range.start.clone().startOf('day').toISOString(),
+                end: this._range.end.clone().endOf('day').toISOString()
             };
         }
     }
@@ -4265,7 +4395,7 @@ class CmatDateRangeComponent {
             };
             this.rangeChanged.emit(range);
             if (!this._programmaticChange) {
-                this._onTouched(range);
+                this._onTouched();
                 this._onChange(range);
             }
             this.activeDates = {
@@ -4296,6 +4426,10 @@ class CmatDateRangeComponent {
         this._init();
     }
     ngOnDestroy() {
+        if (this._overlayRef) {
+            this._overlayRef.dispose();
+            this._overlayRef = null;
+        }
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.writeValue = () => { };
     }
@@ -4326,6 +4460,7 @@ class CmatDateRangeComponent {
                 }
             ])
         });
+        this._overlayRef = overlayRef;
         const templatePortal = new TemplatePortal(this._pickerPanel, this._viewContainerRef);
         overlayRef.backdropClick().subscribe(() => {
             if (templatePortal?.isAttached) {
@@ -4335,14 +4470,15 @@ class CmatDateRangeComponent {
                 overlayRef.detach();
                 overlayRef.dispose();
             }
+            this._overlayRef = null;
         });
         overlayRef.attach(templatePortal);
     }
     getMonthLabel(month) {
         if (month === 1) {
-            return this.activeDates.month1?.clone().format('YYYY MMMM');
+            return this.activeDates.month1?.clone().format('YYYY MMMM') ?? '';
         }
-        return this.activeDates.month2?.clone().format('YYYY MMMM');
+        return this.activeDates.month2?.clone().format('YYYY MMMM') ?? '';
     }
     dateClass() {
         return (date) => {
@@ -4360,13 +4496,15 @@ class CmatDateRangeComponent {
             if (date.isBetween(start, end, 'day')) {
                 return ['cmat-date-range', 'cmat-date-range-mid'];
             }
-            return void 0;
+            return [];
         };
     }
     dateFilter() {
         return (date) => !(this.setWhichDate === 'end' && date.isBefore(this._range.start, 'day'));
     }
     onSelectedDateChange(date) {
+        if (!date)
+            return;
         const newRange = {
             start: dayjs().toISOString(),
             end: dayjs().toISOString(),
@@ -4392,7 +4530,7 @@ class CmatDateRangeComponent {
         this.activeDates.month2 = dayjs(this.activeDates.month2).add(1, 'month');
     }
     updateStartTime(event) {
-        const parsedTime = this._parseTime(event.target.value);
+        const parsedTime = this._parseTime(event.target?.value ?? '');
         if (this.startTimeFormControl.invalid) {
             if (this._range.start) {
                 const time = this._range.start.clone().format(this._timeFormat);
@@ -4416,7 +4554,7 @@ class CmatDateRangeComponent {
         }
     }
     updateEndTime(event) {
-        const parsedTime = this._parseTime(event.target.value);
+        const parsedTime = this._parseTime(event.target?.value ?? '');
         if (this.endTimeFormControl.invalid) {
             if (this._range.end) {
                 const time = this._range.end.clone().format(this._timeFormat);
@@ -4450,7 +4588,7 @@ class CmatDateRangeComponent {
             };
         }
         else {
-            this.range = {};
+            this.range = null;
         }
         this._programmaticChange = true;
         this.timeRange = this.timeRange ?? true;
@@ -4951,7 +5089,7 @@ class CmatFullscreenComponent {
     }
     toggleFullscreen() {
         if (!this._document.fullscreenEnabled) {
-            console.log('Fullscreen is not available in this browser.');
+            console.warn('Fullscreen is not available in this browser.');
             return;
         }
         const fullScreen = this._document.fullscreenElement;
@@ -5031,7 +5169,7 @@ class CmatHighlightComponent {
             return;
         }
         if (!this.code) {
-            this.code = this._elementRef.nativeElement.value;
+            this.code = this._elementRef.nativeElement.value ?? '';
         }
         this._highlightAndInsert();
     }
@@ -5080,8 +5218,10 @@ class CmatImageComponent {
         this.previewVisible = signal(false, ...(ngDevMode ? [{ debugName: "previewVisible" }] : /* istanbul ignore next */ []));
         this.rotate = 0;
         this.scale = 1;
+        this._animationDuration = 150;
         this._loadingPreview = false;
         this._closePreviewByEscape = false;
+        this._closePreviewTimeoutId = null;
         this._document = inject(DOCUMENT);
         this._originalOverflow = null;
         this._zoomSettings = {
@@ -5136,9 +5276,11 @@ class CmatImageComponent {
         if (this.preview) {
             this._disableBackgroundScroll();
             this.maskVisible.set(true);
-            this.previewVisible.set(true);
             this._loadingPreview = true;
-            this.previewShowChange.emit(true);
+            requestAnimationFrame(() => {
+                this.previewVisible.set(true);
+                this.previewShowChange.emit(true);
+            });
         }
     }
     onMaskKeydown(event) {
@@ -5175,10 +5317,19 @@ class CmatImageComponent {
             if (this.appendTo === 'body')
                 this._document.body.appendChild(this._mask);
             else {
-                if (typeof HTMLElement === 'object' ? this.appendTo instanceof HTMLElement : this.appendTo && typeof this.appendTo === 'object' && this.appendTo !== null)
+                if (this.appendTo instanceof HTMLElement) {
                     this.appendTo.appendChild(this._mask);
-                else if (this.appendTo?.el?.nativeElement)
-                    this.appendTo.el.nativeElement.appendChild(this.mask?.nativeElement);
+                }
+                else if (this.appendTo instanceof ElementRef) {
+                    this.appendTo.nativeElement.appendChild(this._mask);
+                }
+                else if (typeof this.appendTo === 'object' && this.appendTo !== null && 'el' in this.appendTo) {
+                    const target = this.appendTo;
+                    const nativeElement = target.el?.nativeElement;
+                    if (nativeElement) {
+                        nativeElement.appendChild(this._mask);
+                    }
+                }
             }
         }
     }
@@ -5186,14 +5337,19 @@ class CmatImageComponent {
         return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };
     }
     closePreview() {
+        if (this._closePreviewTimeoutId !== null) {
+            clearTimeout(this._closePreviewTimeoutId);
+            this._closePreviewTimeoutId = null;
+        }
         this._enableBackgroundScroll();
         this.previewVisible.set(false);
-        this.rotate = 0;
-        this.scale = this._zoomSettings.default;
-        setTimeout(() => {
+        this._closePreviewTimeoutId = window.setTimeout(() => {
             this.maskVisible.set(false);
+            this.rotate = 0;
+            this.scale = this._zoomSettings.default;
             this.previewShowChange.emit(false);
-        }, 25);
+            this._closePreviewTimeoutId = null;
+        }, this._animationDuration);
     }
     imageError(event) {
         this.imageErrorEvent.emit(event);
@@ -5208,11 +5364,11 @@ class CmatImageComponent {
         body.style.overflow = this._originalOverflow ?? '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatImageComponent, isStandalone: true, selector: "cmat-image", inputs: { imageClass: "imageClass", imageStyle: "imageStyle", src: "src", srcSet: "srcSet", previewImageSrc: "previewImageSrc", previewImageSrcSet: "previewImageSrcSet", alt: "alt", width: "width", height: "height", loading: "loading", appendTo: "appendTo", preview: ["preview", "preview", booleanAttribute] }, outputs: { previewShowChange: "previewShowChange", imageErrorEvent: "imageErrorEvent" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "previewButton", first: true, predicate: ["previewButton"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton>\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible()){\r\n    <div #mask class=\"cmat-image-mask cmat-image-overlay cmat-image-overlay-enter\" animate.leave=\"cmat-image-overlay-leave\"\r\n        role=\"dialog\" [attr.aria-modal]=\"maskVisible()\" (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible()){\r\n        <div role=\"presentation\" class=\"cmat-image-preview-enter\" animate.leave=\"cmat-image-preview-leave\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>\r\n", styles: [".cmat-image-mask{display:flex;align-items:center;justify-content:center}.cmat-image-preview-container{position:relative;display:inline-block;line-height:0}.cmat-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cmat-image-preview-container:hover>.cmat-image-preview-indicator{opacity:1;cursor:pointer;background-color:#00000080}.cmat-image-preview-container>img{cursor:pointer}.cmat-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1;padding:.5rem}.cmat-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cmat-image-preview-enter{animation:preview-enter-animation .15s cubic-bezier(0,0,.2,1)}.cmat-image-preview-leave{animation:preview-leave-animation .15s cubic-bezier(0,0,.2,1)}.cmat-image-overlay{background-color:#0006;transition-duration:.2s;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99}.cmat-image-overlay-enter{animation:image-overlay-enter-animation .15s}.cmat-image-overlay-leave{z-index:0;animation:image-overlay-leave-animation .15s}@keyframes preview-enter-animation{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes preview-leave-animation{0%{transform:scale(1);opacity:1}to{transform:scale(.7);opacity:0}}@keyframes image-overlay-enter-animation{0%{background-color:transparent}to{background-color:#000000e6}}@keyframes image-overlay-leave-animation{0%{background-color:#000000e6}to{background-color:transparent}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatImageComponent, isStandalone: true, selector: "cmat-image", inputs: { imageClass: "imageClass", imageStyle: "imageStyle", src: "src", srcSet: "srcSet", previewImageSrc: "previewImageSrc", previewImageSrcSet: "previewImageSrcSet", alt: "alt", width: "width", height: "height", loading: "loading", appendTo: "appendTo", preview: ["preview", "preview", booleanAttribute] }, outputs: { previewShowChange: "previewShowChange", imageErrorEvent: "imageErrorEvent" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "previewButton", first: true, predicate: ["previewButton"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton>\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible()){\r\n    <div #mask class=\"cmat-image-mask cmat-image-overlay cmat-image-overlay-enter\" animate.leave=\"cmat-image-overlay-leave\"\r\n        role=\"dialog\" [attr.aria-modal]=\"maskVisible()\" (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible()){\r\n        <div role=\"presentation\" class=\"cmat-image-preview-enter\" animate.leave=\"cmat-image-preview-leave\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>\r\n", styles: [".cmat-image-mask{display:flex;align-items:center;justify-content:center}.cmat-image-preview-container{position:relative;display:inline-block;line-height:0}.cmat-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;will-change:opacity,background-color;pointer-events:none;transition:opacity .3s ease}.cmat-image-preview-container:hover>.cmat-image-preview-indicator{opacity:1;cursor:pointer;background-color:#00000080;pointer-events:auto}.cmat-image-preview-container>img{cursor:pointer}.cmat-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1;padding:.5rem}.cmat-image-preview{transition:transform .18s cubic-bezier(.2,0,0,1),opacity .18s cubic-bezier(.2,0,0,1);max-width:100vw;max-height:100vh;will-change:transform,opacity;transform-origin:center center;backface-visibility:hidden;transform:translateZ(0)}.cmat-image-preview-enter{animation:preview-enter-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-preview-leave{animation:preview-leave-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-overlay{background-color:#0006;transition:background-color .18s cubic-bezier(.2,0,0,1),opacity .18s cubic-bezier(.2,0,0,1);will-change:background-color,opacity;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99}.cmat-image-overlay-enter{animation:image-overlay-enter-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-overlay-leave{z-index:0;animation:image-overlay-leave-animation .18s cubic-bezier(.2,0,0,1)}@keyframes preview-enter-animation{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes preview-leave-animation{0%{transform:scale(1);opacity:1}to{transform:scale(.7);opacity:0}}@keyframes image-overlay-enter-animation{0%{background-color:transparent}to{background-color:#000000e6}}@keyframes image-overlay-leave-animation{0%{background-color:#000000e6}to{background-color:transparent}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatImageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-image', imports: [CommonModule, MatButtonModule, MatIconModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton>\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible()){\r\n    <div #mask class=\"cmat-image-mask cmat-image-overlay cmat-image-overlay-enter\" animate.leave=\"cmat-image-overlay-leave\"\r\n        role=\"dialog\" [attr.aria-modal]=\"maskVisible()\" (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible()){\r\n        <div role=\"presentation\" class=\"cmat-image-preview-enter\" animate.leave=\"cmat-image-preview-leave\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>\r\n", styles: [".cmat-image-mask{display:flex;align-items:center;justify-content:center}.cmat-image-preview-container{position:relative;display:inline-block;line-height:0}.cmat-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cmat-image-preview-container:hover>.cmat-image-preview-indicator{opacity:1;cursor:pointer;background-color:#00000080}.cmat-image-preview-container>img{cursor:pointer}.cmat-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1;padding:.5rem}.cmat-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cmat-image-preview-enter{animation:preview-enter-animation .15s cubic-bezier(0,0,.2,1)}.cmat-image-preview-leave{animation:preview-leave-animation .15s cubic-bezier(0,0,.2,1)}.cmat-image-overlay{background-color:#0006;transition-duration:.2s;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99}.cmat-image-overlay-enter{animation:image-overlay-enter-animation .15s}.cmat-image-overlay-leave{z-index:0;animation:image-overlay-leave-animation .15s}@keyframes preview-enter-animation{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes preview-leave-animation{0%{transform:scale(1);opacity:1}to{transform:scale(.7);opacity:0}}@keyframes image-overlay-enter-animation{0%{background-color:transparent}to{background-color:#000000e6}}@keyframes image-overlay-leave-animation{0%{background-color:#000000e6}to{background-color:transparent}}\n"] }]
+            args: [{ selector: 'cmat-image', imports: [CommonModule, MatButtonModule, MatIconModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton>\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible()){\r\n    <div #mask class=\"cmat-image-mask cmat-image-overlay cmat-image-overlay-enter\" animate.leave=\"cmat-image-overlay-leave\"\r\n        role=\"dialog\" [attr.aria-modal]=\"maskVisible()\" (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible()){\r\n        <div role=\"presentation\" class=\"cmat-image-preview-enter\" animate.leave=\"cmat-image-preview-leave\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>\r\n", styles: [".cmat-image-mask{display:flex;align-items:center;justify-content:center}.cmat-image-preview-container{position:relative;display:inline-block;line-height:0}.cmat-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;will-change:opacity,background-color;pointer-events:none;transition:opacity .3s ease}.cmat-image-preview-container:hover>.cmat-image-preview-indicator{opacity:1;cursor:pointer;background-color:#00000080;pointer-events:auto}.cmat-image-preview-container>img{cursor:pointer}.cmat-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1;padding:.5rem}.cmat-image-preview{transition:transform .18s cubic-bezier(.2,0,0,1),opacity .18s cubic-bezier(.2,0,0,1);max-width:100vw;max-height:100vh;will-change:transform,opacity;transform-origin:center center;backface-visibility:hidden;transform:translateZ(0)}.cmat-image-preview-enter{animation:preview-enter-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-preview-leave{animation:preview-leave-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-overlay{background-color:#0006;transition:background-color .18s cubic-bezier(.2,0,0,1),opacity .18s cubic-bezier(.2,0,0,1);will-change:background-color,opacity;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99}.cmat-image-overlay-enter{animation:image-overlay-enter-animation .18s cubic-bezier(.2,0,0,1)}.cmat-image-overlay-leave{z-index:0;animation:image-overlay-leave-animation .18s cubic-bezier(.2,0,0,1)}@keyframes preview-enter-animation{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes preview-leave-animation{0%{transform:scale(1);opacity:1}to{transform:scale(.7);opacity:0}}@keyframes image-overlay-enter-animation{0%{background-color:transparent}to{background-color:#000000e6}}@keyframes image-overlay-leave-animation{0%{background-color:#000000e6}to{background-color:transparent}}\n"] }]
         }], propDecorators: { imageClass: [{
                 type: Input
             }], imageStyle: [{
@@ -5278,9 +5434,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 
 class CmatJsonEditorComponent {
     constructor() {
+        this.options = {};
         this.contentChanged = new EventEmitter();
         this.pathChanged = new EventEmitter();
-        this.id = 'cmatjsoneditor' + Math.floor(Math.random() * 1000000);
+        this.id = 'cmatjsoneditor-' + crypto.randomUUID().slice(0, 8);
         this.content = {
             text: undefined,
             json: {}
@@ -5288,12 +5445,6 @@ class CmatJsonEditorComponent {
         this._destroyed = false;
         this._document = inject(DOCUMENT$1);
     }
-    get darkTheme() {
-        return this._isDarkTheme;
-    }
-    get _isDarkTheme() {
-        return this._document.documentElement.classList.contains('dark') || this._document.body.classList.contains('dark');
-    }
     set jsonEditorContainer(value) {
         this._jsonEditorContainer = value;
         this._initializeEditor();
@@ -5322,7 +5473,7 @@ class CmatJsonEditorComponent {
         void this._editor?.destroy();
     }
     setSchema(schema) {
-        const validator = createAjvValidator({ schema });
+        const validator = createAjvValidator({ schema: schema });
         void this._editor?.updateProps({ validator: validator });
     }
     setSelectionToPath(pathString) {
@@ -5340,11 +5491,12 @@ class CmatJsonEditorComponent {
         if (this._editor) {
             const content = this._editor.get();
             if (isJSONContent(content)) {
-                const j = this._editor.get().json;
+                const j = content.json;
                 return j;
             }
             else {
-                const t = this._editor.get().text;
+                const textContent = content;
+                const t = String(textContent.text ?? '');
                 const j = JSON.parse(t);
                 return j;
             }
@@ -5374,13 +5526,10 @@ class CmatJsonEditorComponent {
             props: {
                 ...this.options,
                 content: this.content,
-                onChange: (updatedContent, previousContent, { contentErrors, patchResult }) => {
-                    console.log('onChange', {
-                        updatedContent,
-                        previousContent,
-                        contentErrors,
-                        patchResult,
-                    });
+                onChange: (updatedContent, _previousContent, { contentErrors }) => {
+                    if (contentErrors) {
+                        console.error('JSON Editor content errors:', contentErrors);
+                    }
                     this.content = updatedContent;
                     this.contentChanged.emit(updatedContent);
                 },
@@ -5388,9 +5537,9 @@ class CmatJsonEditorComponent {
                 onRenderMenu(items, 
                 // eslint-disable-next-line @typescript-eslint/no-unused-vars
                 context) {
-                    items.splice(items.findIndex(i => i['text'] === 'table'), 1);
-                    items.splice(items.findIndex(i => i['className'] === 'jse-sort'), 1);
-                    items.splice(items.findIndex(i => i['className'] === 'jse-transform'), 1);
+                    items.splice(items.findIndex((i) => i['text'] === 'table'), 1);
+                    items.splice(items.findIndex((i) => i['className'] === 'jse-sort'), 1);
+                    items.splice(items.findIndex((i) => i['className'] === 'jse-transform'), 1);
                     items.forEach((item) => {
                         const button = item;
                         switch (button['title']) {
@@ -5442,11 +5591,11 @@ class CmatJsonEditorComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatJsonEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatJsonEditorComponent, isStandalone: true, selector: "cmat-json-editor", inputs: { options: "options", data: "data" }, outputs: { contentChanged: "contentChanged", pathChanged: "pathChanged" }, host: { properties: { "class.jse-theme-dark": "this.darkTheme" } }, viewQueries: [{ propertyName: "jsonEditorContainer", first: true, predicate: ["jsonEditorContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@defer (on viewport) {\r\n    <div #jsonEditorContainer class=\"cmat-jsoneditor\" [id]=\"id\"></div>\r\n} @placeholder {\r\n    <div class=\"flex min-h-64 items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\">\r\n        JSON \u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n", styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatJsonEditorComponent, isStandalone: true, selector: "cmat-json-editor", inputs: { options: "options", data: "data" }, outputs: { contentChanged: "contentChanged", pathChanged: "pathChanged" }, viewQueries: [{ propertyName: "jsonEditorContainer", first: true, predicate: ["jsonEditorContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@defer (on viewport) {\r\n    <div #jsonEditorContainer class=\"cmat-jsoneditor\" [id]=\"id\"></div>\r\n} @placeholder {\r\n    <div class=\"flex min-h-64 items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\">\r\n        JSON \u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n", styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}.cmat-jsoneditor{--jse-background-color: rgba(var(--cmat-bg-card-rgb), 1);--jse-text-color: var(--cmat-text-default);--jse-key-color: var(--cmat-text-default);--jse-delimiter-color: var(--cmat-text-hint);--jse-hover-background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatJsonEditorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-json-editor', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [], template: "@defer (on viewport) {\r\n    <div #jsonEditorContainer class=\"cmat-jsoneditor\" [id]=\"id\"></div>\r\n} @placeholder {\r\n    <div class=\"flex min-h-64 items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\">\r\n        JSON \u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n", styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"] }]
+            args: [{ selector: 'cmat-json-editor', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [], template: "@defer (on viewport) {\r\n    <div #jsonEditorContainer class=\"cmat-jsoneditor\" [id]=\"id\"></div>\r\n} @placeholder {\r\n    <div class=\"flex min-h-64 items-center justify-center rounded-2xl border border-dashed border-default bg-card px-4 py-6 text-sm text-secondary shadow-sm\">\r\n        JSON \u7F16\u8F91\u5668\u52A0\u8F7D\u4E2D...\r\n    </div>\r\n}\r\n", styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}.cmat-jsoneditor{--jse-background-color: rgba(var(--cmat-bg-card-rgb), 1);--jse-text-color: var(--cmat-text-default);--jse-key-color: var(--cmat-text-default);--jse-delimiter-color: var(--cmat-text-hint);--jse-hover-background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}\n"] }]
         }], propDecorators: { options: [{
                 type: Input
             }], data: [{
@@ -5455,9 +5604,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 type: Output
             }], pathChanged: [{
                 type: Output
-            }], darkTheme: [{
-                type: HostBinding,
-                args: ['class.jse-theme-dark']
             }], jsonEditorContainer: [{
                 type: ViewChild,
                 args: ['jsonEditorContainer']
@@ -5495,8 +5641,9 @@ class CmatKnobInputComponent {
         this._placeholder = '';
         this._required = false;
         this._disabled = false;
-        // eslint-disable-next-line @typescript-eslint/no-empty-function
-        this._onModelChange = () => { };
+        this._onModelChange = () => {
+            // Intentionally left blank
+        };
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this._onTouchedChange = () => { };
         if (this.ngControl != null) {
@@ -5702,9 +5849,9 @@ class CmatKnobInputComponent {
     }
     onTouchMove(event) {
         if (!this.disabled && event instanceof TouchEvent && event.touches.length === 1) {
-            const rect = this._el.nativeElement.children[0].getBoundingClientRect();
+            const rect = this._el.nativeElement.firstElementChild?.getBoundingClientRect();
             const touch = event.targetTouches.item(0);
-            if (touch) {
+            if (touch && rect) {
                 const offsetX = touch.clientX - rect.left;
                 const offsetY = touch.clientY - rect.top;
                 this.updateValue(offsetX, offsetY);
@@ -5723,7 +5870,7 @@ class CmatKnobInputComponent {
         this.valueChange.emit(this.value);
     }
     writeValue(value) {
-        this.value = value;
+        this.value = value ?? this.min;
         this.refreshVersion.update(value => value + 1);
     }
     registerOnChange(fn) {
@@ -5787,13 +5934,13 @@ class CmatKnobInputComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatKnobInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatKnobInputComponent, isStandalone: true, selector: "cmat-knob-input", inputs: { id: "id", valueColor: "valueColor", rangeColor: "rangeColor", textColor: "textColor", valueTemplate: "valueTemplate", name: "name", size: "size", step: "step", min: "min", max: "max", strokeWidth: "strokeWidth", showValue: "showValue", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "keydown": "onKeyDown($event)", "mousedown": "onMouseDown($event)", "mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd($event)" }, properties: { "attr.id": "this.id" } }, providers: [
             { provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }
-        ], viewQueries: [{ propertyName: "_knobElementRef", first: true, predicate: ["knob"], descendants: true }], exportAs: ["cmatKnobInput"], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [attr.data-refresh]=\"refreshVersion()\" [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n    <svg  viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n        [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n        [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\" (keydown.enter)=\"onKeyDown($event)\" (keydown.space)=\"onKeyDown($event)\">\r\n        <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n        </path>\r\n        <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n        </path>\r\n        @if(showValue){\r\n        <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n            [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n        }\r\n    </svg>\r\n</div>\r\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->\r\n", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "_knobElementRef", first: true, predicate: ["knob"], descendants: true }], exportAs: ["cmatKnobInput"], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [attr.data-refresh]=\"refreshVersion()\" [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n    <svg  viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n        [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n        [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\" (keydown.enter)=\"onKeyDown($event)\" (keydown.space)=\"onKeyDown($event)\">\r\n        <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n        </path>\r\n        <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n        </path>\r\n        @if(showValue){\r\n        <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n            [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n        }\r\n    </svg>\r\n</div>\r\n\r\n", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatKnobInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-knob-input', providers: [
                         { provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }
-                    ], exportAs: 'cmatKnobInput', imports: [NgStyle], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [attr.data-refresh]=\"refreshVersion()\" [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n    <svg  viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n        [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n        [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\" (keydown.enter)=\"onKeyDown($event)\" (keydown.space)=\"onKeyDown($event)\">\r\n        <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n        </path>\r\n        <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n        </path>\r\n        @if(showValue){\r\n        <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n            [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n        }\r\n    </svg>\r\n</div>\r\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->\r\n", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"] }]
+                    ], exportAs: 'cmatKnobInput', imports: [NgStyle], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [attr.data-refresh]=\"refreshVersion()\" [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n    <svg  viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n        [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n        [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\" (keydown.enter)=\"onKeyDown($event)\" (keydown.space)=\"onKeyDown($event)\">\r\n        <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n        </path>\r\n        <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n        </path>\r\n        @if(showValue){\r\n        <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n            [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n        }\r\n    </svg>\r\n</div>\r\n\r\n", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"] }]
         }], ctorParameters: () => [], propDecorators: { _knobElementRef: [{
                 type: ViewChild,
                 args: ['knob', { static: false }]
@@ -5929,8 +6076,8 @@ const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR = {
 };
 class CmatMaterialColorPickerComponent {
     constructor() {
-        this.selectedColor = signal({ palette: 'bg-indigo', hue: '500', color: 'bg-indigo-500' }, ...(ngDevMode ? [{ debugName: "selectedColor" }] : /* istanbul ignore next */ []));
         this.colorChanged = new EventEmitter();
+        this.selectedColor = signal({ palette: 'bg-indigo', hue: '500', color: 'bg-indigo-500' }, ...(ngDevMode ? [{ debugName: "selectedColor" }] : /* istanbul ignore next */ []));
         this.palettes = baseColors;
         this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900'];
         this.selectedHue = '500';
@@ -6006,7 +6153,7 @@ class CmatMaterialColorPickerComponent {
             color: this.selectedPalette + '-' + this.selectedHue
         });
         this._color = this.selectedColor().color;
-        this.colorChanged.emit(this.selectedColor());
+        this.colorChanged.emit(this.selectedColor().color);
         this._modelTouched(this.selectedColor().color);
         this._modelChange(this.selectedColor().color);
     }
@@ -6736,7 +6883,7 @@ class CmatDatetimepickerTimeInputDirective {
         });
     }
     get hasFocus() {
-        return this._element.nativeElement && this._element?.nativeElement === document?.activeElement;
+        return !!this._element.nativeElement && this._element?.nativeElement === document?.activeElement;
     }
     get inputElement() {
         return this._element.nativeElement;
@@ -8058,10 +8205,11 @@ class CmatDatetimepickerComponent {
                     this._closeAnimationTimeoutId = null;
                 }
                 const activeElement = this._document.activeElement;
+                const overlayElement = location.nativeElement;
                 if (canRestoreFocus &&
                     (!activeElement ||
                         activeElement === this._document.activeElement ||
-                        location.nativeElement.contains(activeElement))) {
+                        overlayElement.contains(activeElement))) {
                     this._focusedElementBeforeOpen?.focus();
                 }
                 this._focusedElementBeforeOpen = null;
@@ -8114,12 +8262,7 @@ class CmatDatetimepickerComponent {
         if (isDialog) {
             overlayElement.setAttribute('aria-modal', 'true');
         }
-        this._getCloseStream(overlayRef).subscribe((event) => {
-            if (event) {
-                event.preventDefault();
-            }
-            this.close();
-        });
+        this._getCloseStream(overlayRef).subscribe(() => this.close());
         this._componentRef = overlayRef.attach(portal);
         this._forwardContentValues(this._componentRef.instance);
         if (!isDialog) {
@@ -8180,10 +8323,27 @@ class CmatDatetimepickerComponent {
         ]);
     }
     _getCloseStream(overlayRef) {
-        return merge(overlayRef.backdropClick(), overlayRef.detachments(), overlayRef.keydownEvents().pipe(filter(event => ((event.code === 'Escape' && !hasModifierKey(event)) ||
-            (this.datetimepickerInput &&
-                hasModifierKey(event, 'altKey') &&
-                event.code === 'ArrowUp')))));
+        return new Observable((subscriber) => {
+            const subscriptions = new Subscription();
+            subscriptions.add(overlayRef.backdropClick().subscribe(() => {
+                subscriber.next();
+                subscriber.complete();
+            }));
+            subscriptions.add(overlayRef.detachments().subscribe(() => {
+                subscriber.next();
+                subscriber.complete();
+            }));
+            subscriptions.add(overlayRef.keydownEvents().pipe(filter(event => ((event.code === 'Escape' && !hasModifierKey(event)) ||
+                (this.datetimepickerInput &&
+                    hasModifierKey(event, 'altKey') &&
+                    event.code === 'ArrowUp')))).subscribe(() => {
+                subscriber.next();
+                subscriber.complete();
+            }));
+            return () => {
+                subscriptions.unsubscribe();
+            };
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatDatetimepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: CmatDatetimepickerComponent, isStandalone: true, selector: "cmat-datetimepicker", inputs: { startView: "startView", mode: "mode", timeInterval: "timeInterval", preventSameDateTimeSelection: "preventSameDateTimeSelection", xPosition: "xPosition", yPosition: "yPosition", multiYearSelector: "multiYearSelector", twelvehour: "twelvehour", panelClass: "panelClass", opened: "opened", color: "color", startAt: "startAt", type: "type", timeInput: "timeInput", touchUi: "touchUi", disabled: "disabled", restoreFocus: "restoreFocus" }, outputs: { selectedChanged: "selectedChanged", openedStream: "openedStream", closedStream: "closedStream", viewChanged: "viewChanged" }, exportAs: ["cmatDatetimepicker"], ngImport: i0, template: '', isInline: true, styles: [".cmat-datetimepicker-calendar-header,.cmat-datetimepicker-calendar-body-cell-content.cmat-datetimepicker-calendar-body-selected{color:#fff!important}.cmat-datetimepicker-calendar-body-cell-content:not(.cmat-datetimepicker-calendar-body-selected).cmat-datetimepicker-calendar-body-today{border-color:var(--cmat-text-hint)}.cmat-datetimepicker-calendar-body-cell:not(.cmat-datetimepicker-calendar-body-disabled):hover>.cmat-datetimepicker-calendar-body-cell-content:not(.cmat-datetimepicker-calendar-body-selected),.cmat-datetimepicker-calendar-body-active>.cmat-datetimepicker-calendar-body-cell-content:not(.cmat-datetimepicker-calendar-body-selected){background-color:rgba(var(--cmat-primary-rgb),.3)}.cmat-datetimepicker-calendar-body-disabled>.cmat-datetimepicker-calendar-body-cell-content:not(.cmat-datetimepicker-calendar-body-selected){color:var(--cmat-text-disabled)}.cmat-datetimepicker-calendar-body-disabled>.cmat-datetimepicker-calendar-body-today:not(.cmat-datetimepicker-calendar-body-selected){border-color:rgba(var(--cmat-text-disabled),.8)}.cmat-datetimepicker-calendar-body-disabled>.cmat-datetimepicker-calendar-body-selected{background-color:rgba(var(--cmat-primary-rgb),.4)}.cmat-datetimepicker-calendar-previous-button.disabled,.cmat-datetimepicker-calendar-next-button.disabled{color:var(--cmat-text-disabled)}.cmat-datetimepicker-clock-wrapper{background-color:var(--cmat-divider)}.cmat-datetimepicker-clock-cell.cmat-datetimepicker-clock-cell-selected{color:#fff!important}.cmat-datetimepicker-clock-cell.cmat-datetimepicker-clock-cell-disabled{color:var(--cmat-text-disabled)}.cmat-datetimepicker-time-input{background-color:var(--cmat-text-disabled)}.cmat-datetimepicker-time-input.cmat-datetimepicker-time-input-active{background-color:rgba(var(--cmat-primary-rgb),.2)}.cmat-datetimepicker-time-input.cmat-datetimepicker-time-input-active:focus{border-color:var(--cmat-primary);background-color:var(--cmat-divider)}.cmat-datetimepicker-time-input.cmat-datetimepicker-time-input-active:focus::placeholder{color:rgba(var(--cmat-primary-rgb),.6)}.cmat-datetimepicker-time-input.cmat-datetimepicker-time-input-warning{border-color:var(--cmat-warn)}.cmat-datetimepicker-time-am.mat-mdc-button,.cmat-datetimepicker-time-pm.mat-mdc-button{color:var(--cmat-text-hint);border-color:var(--cmat-text-hint)}.cmat-datetimepicker-time-am.mat-mdc-button.cmat-datetimepicker-time-ampm-active,.cmat-datetimepicker-time-pm.mat-mdc-button.cmat-datetimepicker-time-ampm-active{background-color:rgba(var(--cmat-accent-rgb),.2)}.cmat-datetimepicker-content{display:block;border-radius:4px;overflow:hidden}.cmat-datetimepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.cmat-datetimepicker-content .cmat-calendar{width:296px;height:424px}.cmat-datetimepicker-content .cmat-calendar.cmat-datetimepicker-calendar-with-time-input{height:490px}.cmat-datetimepicker-content-touch{display:block;position:relative;overflow:visible}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container{min-height:300px;max-height:850px;min-width:250px;max-width:750px}.cmat-datetimepicker-content-touch .cmat-datetimepicker-calendar{width:100%;height:auto}@media all and (orientation:landscape){.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=auto],.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=landscape]{width:120vh;height:100%;min-height:80vh}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=auto] .cmat-datetimepicker-calendar,.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=landscape] .cmat-datetimepicker-calendar{width:auto;height:100%}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=portrait]{width:64vh;height:90vh}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=portrait] .cmat-datetimepicker-calendar{width:100%;height:auto}}@media all and (orientation:portrait){.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=auto],.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=portrait]{width:80vw;height:120vw}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=auto] .cmat-datetimepicker-calendar,.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=portrait] .cmat-datetimepicker-calendar{width:100%;height:auto}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=landscape]{width:90vw;height:64vw}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container[mode=landscape] .cmat-datetimepicker-calendar{width:auto;height:100%}.cmat-datetimepicker-content-touch .cmat-datetimepicker-content-container-with-actions{height:135vw}}.cmat-datetimepicker-transform-panel.enter-dropdown{animation:panel-dropdown-enter .12s cubic-bezier(0,0,.2,1)}.cmat-datetimepicker-transform-panel.enter-dialog{animation:panel-dialog-enter .15s cubic-bezier(0,0,.2,1)}.cmat-datetimepicker-transform-panel.leave{animation:panel-leave .1s linear}@keyframes panel-dropdown-enter{0%{opacity:0;transform:scaleY(.8)}to{opacity:1;transform:scale(1)}}@keyframes panel-dialog-enter{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}@keyframes panel-leave{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
@@ -8390,7 +8550,7 @@ class CmatDatetimepickerInputDirective {
     }
     getOverlayLabelId() {
         if (this._formField) {
-            return this._formField.getLabelId();
+            return this._formField.getLabelId() ?? null;
         }
         return this._elementRef.nativeElement.getAttribute('aria-labelledby');
     }
@@ -8454,7 +8614,7 @@ class CmatDatetimepickerInputDirective {
         }
     }
     _getParseFormat() {
-        let parseFormat;
+        let parseFormat = this._dateFormats.parse.dateInput;
         switch (this.datetimepicker.type) {
             case 'date':
                 parseFormat = this._dateFormats.parse.dateInput;
@@ -8472,7 +8632,6 @@ class CmatDatetimepickerInputDirective {
                 parseFormat = this._dateFormats.parse.yearInput;
                 break;
         }
-        parseFormat ??= this._dateFormats.parse.dateInput;
         return parseFormat;
     }
     _formatValue(value) {
@@ -9236,14 +9395,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 class CmatVerticalNavigationComponent {
     constructor() {
         /* eslint-enable @typescript-eslint/naming-convention */
-        this.classList = '';
-        this.styleList = 'visibility: visible;';
+        this.classList = signal('', ...(ngDevMode ? [{ debugName: "classList" }] : /* istanbul ignore next */ []));
+        this.styleList = signal('visibility: visible;', ...(ngDevMode ? [{ debugName: "styleList" }] : /* istanbul ignore next */ []));
         this.appearance = 'default';
         this.autoCollapse = true;
         this.editState = false;
         this.inner = false;
         this.mode = 'side';
         this.name = '';
+        this.navigation = [];
         this.opened = true;
         this.position = 'left';
         this.transparentOverlay = false;
@@ -9606,7 +9766,7 @@ class CmatVerticalNavigationComponent {
         }
     }
     _syncHostBindings() {
-        this.classList = [
+        this.classList.set([
             this._animationsEnabled ? 'cmat-vertical-navigation-animations-enabled' : '',
             `cmat-vertical-navigation-appearance-${this.appearance}`,
             this._hovered ? 'cmat-vertical-navigation-hover' : '',
@@ -9616,24 +9776,23 @@ class CmatVerticalNavigationComponent {
             this.opened ? 'cmat-vertical-navigation-opened' : '',
             this.position === 'left' ? 'cmat-vertical-navigation-position-left' : '',
             this.position === 'right' ? 'cmat-vertical-navigation-position-right' : ''
-        ].filter(Boolean).join(' ');
-        this.styleList = `visibility: ${this.opened ? 'visible' : 'hidden'};`;
+        ].filter(Boolean).join(' '));
+        this.styleList.set(`visibility: ${this.opened ? 'visible' : 'hidden'};`);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatVerticalNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatVerticalNavigationComponent, isStandalone: true, selector: "cmat-vertical-navigation", inputs: { appearance: "appearance", autoCollapse: "autoCollapse", editState: "editState", inner: "inner", mode: "mode", name: "name", navigation: "navigation", opened: "opened", position: "position", transparentOverlay: "transparentOverlay", hasRouteReuseStrategy: "hasRouteReuseStrategy" }, outputs: { routeReuseStrategyEmitUrl: "routeReuseStrategyEmitUrl", appearanceChanged: "appearanceChanged", modeChanged: "modeChanged", openedChanged: "openedChanged", positionChanged: "positionChanged", editSelectedItemChanged: "editSelectedItemChanged" }, host: { listeners: { "mouseenter": "onMouseenter()", "mouseleave": "onMouseleave()" }, properties: { "class": "this.classList", "style": "this.styleList" } }, viewQueries: [{ propertyName: "_navigationContentEl", first: true, predicate: ["navigationContent"], descendants: true }], exportAs: ["cmatVerticalNavigation"], usesOnChanges: true, ngImport: i0, template: "<div class=\"cmat-vertical-navigation-wrapper\" [attr.data-refresh]=\"refreshToken()\">\r\n\r\n  \r\n  <div class=\"cmat-vertical-navigation-header\">\r\n    <ng-content select=\"[cmatVerticalNavigationHeader]\"></ng-content>\r\n  </div>\r\n\r\n  \r\n  <div #navigationContent class=\"cmat-vertical-navigation-content py-2 overflow-y-auto scrollbar-custom\">\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-header\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentHeader]\"></ng-content>\r\n    </div>\r\n\r\n    \r\n    @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @switch (item.type) {\r\n    @case ('aside') {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [activeItemId]=\"activeAsideItemId()\"\r\n      [autoCollapse]=\"autoCollapse\" [skipChildren]=\"true\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (click)=\"toggleAside(item)\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n    }\r\n    @case ('basic') {\r\n    <cmat-vertical-navigation-basic-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-basic-item>\r\n    }\r\n    @case ('collapsable') {\r\n    <cmat-vertical-navigation-collapsable-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [autoCollapse]=\"autoCollapse\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\"></cmat-vertical-navigation-collapsable-item>\r\n    }\r\n    @case ('divider') {\r\n    <cmat-vertical-navigation-divider-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-divider-item>\r\n    }\r\n    @case ('group') {\r\n    <cmat-vertical-navigation-group-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [editState]=\"editState\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-group-item>\r\n    }\r\n    @case ('spacer') {\r\n    <cmat-vertical-navigation-spacer-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-spacer-item>\r\n    }\r\n    }\r\n    }\r\n    }\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-footer\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentFooter]\"></ng-content>\r\n    </div>\r\n\r\n  </div>\r\n  \r\n  <div class=\"cmat-vertical-navigation-footer\">\r\n    <ng-content select=\"[cmatVerticalNavigationFooter]\"></ng-content>\r\n  </div>\r\n\r\n</div>\r\n\r\n\r\n@if (activeAsideItemId()) {\r\n<div class=\"cmat-vertical-navigation-aside-wrapper overflow-y-auto scrollbar-custom\"\r\n  [animate.enter]=\"position === 'left'?'fade-in-left-animation':'fade-in-right-animation'\"\r\n  [animate.leave]=\"position === 'left'?'fade-out-left-animation':'fade-out-right-animation'\">\r\n  \r\n  @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @if (item.type === 'aside' && item.id === activeAsideItemId()) {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n  }\r\n  }\r\n  }\r\n</div>\r\n}", styles: ["cmat-vertical-navigation{position:sticky;display:flex;flex-direction:column;flex:1 0 auto;top:0;width:280px;min-width:280px;max-width:280px;height:100%;z-index:200}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:visibility,margin-left,margin-right,transform,width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled .cmat-vertical-navigation-wrapper{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-mode-over{position:fixed;top:0;bottom:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over{left:0;transform:translate3d(-100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left .cmat-vertical-navigation-wrapper{left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over{right:0;transform:translate3d(100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-wrapper{right:0}cmat-vertical-navigation.cmat-vertical-navigation-inner{position:relative;width:auto;min-width:0;max-width:none;height:auto;min-height:0;max-height:none;box-shadow:none}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper{position:relative;overflow:visible;height:auto}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{overflow:visible!important}cmat-vertical-navigation .cmat-vertical-navigation-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;width:100%;height:100%;overflow:hidden;z-index:10;background:inherit;box-shadow:inset -1px 0 0 var(--cmat-border)}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{flex:1 1 auto;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-divider-item{margin:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item{margin-top:24px}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;left:280px;width:280px;height:100%;z-index:5;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:inherit}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item{padding:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item,cmat-vertical-navigation cmat-vertical-navigation-group-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item{display:flex;flex-direction:column;flex:1 0 auto;-webkit-user-select:none;user-select:none}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{position:relative;display:flex;align-items:center;justify-content:flex-start;padding:10px 16px;font-size:13px;font-weight:500;line-height:20px;text-decoration:none;border-radius:6px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled{cursor:default;opacity:.4}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:16px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{font-size:11px;line-height:1.5}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{margin-left:auto}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content{display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;white-space:nowrap;height:20px}cmat-vertical-navigation cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-basic-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{margin:0 12px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item{margin-bottom:4px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item{cursor:pointer}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge+.cmat-vertical-navigation-item-arrow{margin-left:8px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{height:20px;line-height:20px;margin-left:auto;transition:transform .3s cubic-bezier(.25,.8,.25,1),color 375ms cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item.cmat-vertical-navigation-item-expanded>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{transform:rotate(90deg)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children{margin-top:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:0}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{overflow:hidden}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:56px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:72px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:88px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:104px}cmat-vertical-navigation cmat-vertical-navigation-divider-item{margin:12px 0}cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper{height:1px;box-shadow:0 1px}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{display:none!important}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}cmat-vertical-navigation cmat-vertical-navigation-spacer-item{margin:6px 0}.cmat-vertical-navigation-overlay{position:absolute;inset:0;z-index:170;background-color:#0009}.cmat-vertical-navigation-overlay+.cmat-vertical-navigation-aside-overlay{background-color:transparent}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay{position:absolute;inset:0;z-index:169;background-color:#0000004d}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}@keyframes vertical-navigation-overlay-enter{0%{opacity:0}to{opacity:1}}@keyframes vertical-navigation-overlay-leave{0%{opacity:1}to{opacity:0}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact{width:112px;min-width:112px;max-width:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{margin:4px 8px 0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{flex-direction:column;justify-content:center;padding:12px;border-radius:6px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{margin-top:8px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:500;text-align:center;line-height:16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{position:absolute;top:12px;left:64px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-aside-wrapper{left:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over){width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{width:280px-24px;min-width:280px-24px;max-width:280px-24px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{transition:opacity .4s cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item:first-of-type{margin-top:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;opacity:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item:before{content:\"\";position:absolute;top:20px;width:23px;border-top-width:2px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-aside-wrapper{left:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper{width:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;animation:removeWhiteSpaceNoWrap 1ms linear .35s;animation-fill-mode:forwards}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:280px}@keyframes removeWhiteSpaceNoWrap{0%{white-space:nowrap}99%{white-space:nowrap}to{white-space:normal}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin{width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item{flex-direction:column;justify-content:center;height:64px;min-height:64px;max-height:64px;padding:0 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{display:flex;align-items:center;justify-content:center}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{justify-content:center;padding:12px;border-radius:4px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-aside-wrapper{left:80px}.fade-in-animation{opacity:1;transition:opacity 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-animation{opacity:0}}.fade-in-top-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-top-animation{opacity:0;transform:translate3d(0,-100%,0)}}.fade-in-bottom-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-bottom-animation{opacity:0;transform:translate3d(0,100%,0)}}.fade-in-left-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-left-animation{opacity:0;transform:translate3d(-100%,0,0)}}.fade-in-right-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-right-animation{opacity:0;transform:translate3d(100%,0,0)}}.fade-out-animation{opacity:0;transition:opacity 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-animation{opacity:1}}.fade-out-top-animation{opacity:0;transform:translate3d(0,-100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-top-animation{opacity:1;transform:translateZ(0)}}.fade-out-bottom-animation{opacity:0;transform:translate3d(0,100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-bottom-animation{opacity:1;transform:translateZ(0)}}.fade-out-left-animation{opacity:0;transform:translate3d(-100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-left-animation{opacity:1;transform:translateZ(0)}}.fade-out-right-animation{opacity:0;transform:translate3d(100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-right-animation{opacity:1;transform:translateZ(0)}}\n"], dependencies: [{ kind: "component", type: CmatVerticalNavigationAsideItemComponent, selector: "cmat-vertical-navigation-aside-item", inputs: ["activeItemId", "autoCollapse", "item", "name", "skipChildren", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationBasicItemComponent, selector: "cmat-vertical-navigation-basic-item", inputs: ["item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationCollapsableItemComponent, selector: "cmat-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationDividerItemComponent, selector: "cmat-vertical-navigation-divider-item", inputs: ["item", "name", "editState"], outputs: ["editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationGroupItemComponent, selector: "cmat-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationSpacerItemComponent, selector: "cmat-vertical-navigation-spacer-item", inputs: ["item", "name", "editState"], outputs: ["editSelectedItemChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatVerticalNavigationComponent, isStandalone: true, selector: "cmat-vertical-navigation", inputs: { appearance: "appearance", autoCollapse: "autoCollapse", editState: "editState", inner: "inner", mode: "mode", name: "name", navigation: "navigation", opened: "opened", position: "position", transparentOverlay: "transparentOverlay", hasRouteReuseStrategy: "hasRouteReuseStrategy" }, outputs: { routeReuseStrategyEmitUrl: "routeReuseStrategyEmitUrl", appearanceChanged: "appearanceChanged", modeChanged: "modeChanged", openedChanged: "openedChanged", positionChanged: "positionChanged", editSelectedItemChanged: "editSelectedItemChanged" }, host: { listeners: { "mouseenter": "onMouseenter()", "mouseleave": "onMouseleave()" }, properties: { "class": "classList()", "style": "styleList()" } }, viewQueries: [{ propertyName: "_navigationContentEl", first: true, predicate: ["navigationContent"], descendants: true }], exportAs: ["cmatVerticalNavigation"], usesOnChanges: true, ngImport: i0, template: "<div class=\"cmat-vertical-navigation-wrapper\" [attr.data-refresh]=\"refreshToken()\">\r\n\r\n  \r\n  <div class=\"cmat-vertical-navigation-header\">\r\n    <ng-content select=\"[cmatVerticalNavigationHeader]\"></ng-content>\r\n  </div>\r\n\r\n  \r\n  <div #navigationContent class=\"cmat-vertical-navigation-content py-2 overflow-y-auto scrollbar-custom\">\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-header\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentHeader]\"></ng-content>\r\n    </div>\r\n\r\n    \r\n    @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @switch (item.type) {\r\n    @case ('aside') {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [activeItemId]=\"activeAsideItemId()\"\r\n      [autoCollapse]=\"autoCollapse\" [skipChildren]=\"true\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (click)=\"toggleAside(item)\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n    }\r\n    @case ('basic') {\r\n    <cmat-vertical-navigation-basic-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-basic-item>\r\n    }\r\n    @case ('collapsable') {\r\n    <cmat-vertical-navigation-collapsable-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [autoCollapse]=\"autoCollapse\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\"></cmat-vertical-navigation-collapsable-item>\r\n    }\r\n    @case ('divider') {\r\n    <cmat-vertical-navigation-divider-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-divider-item>\r\n    }\r\n    @case ('group') {\r\n    <cmat-vertical-navigation-group-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [editState]=\"editState\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-group-item>\r\n    }\r\n    @case ('spacer') {\r\n    <cmat-vertical-navigation-spacer-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-spacer-item>\r\n    }\r\n    }\r\n    }\r\n    }\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-footer\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentFooter]\"></ng-content>\r\n    </div>\r\n\r\n  </div>\r\n  \r\n  <div class=\"cmat-vertical-navigation-footer\">\r\n    <ng-content select=\"[cmatVerticalNavigationFooter]\"></ng-content>\r\n  </div>\r\n\r\n</div>\r\n\r\n\r\n@if (activeAsideItemId()) {\r\n<div class=\"cmat-vertical-navigation-aside-wrapper overflow-y-auto scrollbar-custom\"\r\n  [animate.enter]=\"position === 'left'?'fade-in-left-animation':'fade-in-right-animation'\"\r\n  [animate.leave]=\"position === 'left'?'fade-out-left-animation':'fade-out-right-animation'\">\r\n  \r\n  @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @if (item.type === 'aside' && item.id === activeAsideItemId()) {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n  }\r\n  }\r\n  }\r\n</div>\r\n}", styles: ["cmat-vertical-navigation{position:sticky;display:flex;flex-direction:column;flex:1 0 auto;top:0;width:280px;min-width:280px;max-width:280px;height:100%;z-index:200}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:visibility,margin-left,margin-right,transform,width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled .cmat-vertical-navigation-wrapper{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-mode-over{position:fixed;top:0;bottom:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over{left:0;transform:translate3d(-100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left .cmat-vertical-navigation-wrapper{left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over{right:0;transform:translate3d(100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-wrapper{right:0}cmat-vertical-navigation.cmat-vertical-navigation-inner{position:relative;width:auto;min-width:0;max-width:none;height:auto;min-height:0;max-height:none;box-shadow:none}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper{position:relative;overflow:visible;height:auto}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{overflow:visible!important}cmat-vertical-navigation .cmat-vertical-navigation-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;width:100%;height:100%;overflow:hidden;z-index:10;background:inherit;box-shadow:inset -1px 0 0 var(--cmat-border)}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{flex:1 1 auto;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-divider-item{margin:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item{margin-top:24px}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;left:280px;width:280px;height:100%;z-index:5;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:inherit}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item{padding:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item,cmat-vertical-navigation cmat-vertical-navigation-group-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item{display:flex;flex-direction:column;flex:1 0 auto;-webkit-user-select:none;user-select:none}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{position:relative;display:flex;align-items:center;justify-content:flex-start;padding:10px 16px;font-size:13px;font-weight:500;line-height:20px;text-decoration:none;border-radius:6px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled{cursor:default;opacity:.4}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:16px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{font-size:11px;line-height:1.5}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{margin-left:auto}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content{display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;white-space:nowrap;height:20px}cmat-vertical-navigation cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-basic-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{margin:0 12px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item{margin-bottom:4px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item{cursor:pointer}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge+.cmat-vertical-navigation-item-arrow{margin-left:8px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{height:20px;line-height:20px;margin-left:auto;transition:transform .3s cubic-bezier(.25,.8,.25,1),color 375ms cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item.cmat-vertical-navigation-item-expanded>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{transform:rotate(90deg)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children{margin-top:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:0}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{overflow:hidden}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:56px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:72px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:88px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:104px}cmat-vertical-navigation cmat-vertical-navigation-divider-item{margin:12px 0}cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper{height:1px;box-shadow:0 1px}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{display:none!important}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}cmat-vertical-navigation cmat-vertical-navigation-spacer-item{margin:6px 0}.cmat-vertical-navigation-overlay{position:absolute;inset:0;z-index:170;background-color:#0009}.cmat-vertical-navigation-overlay+.cmat-vertical-navigation-aside-overlay{background-color:transparent}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay{position:absolute;inset:0;z-index:169;background-color:#0000004d}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}@keyframes vertical-navigation-overlay-enter{0%{opacity:0}to{opacity:1}}@keyframes vertical-navigation-overlay-leave{0%{opacity:1}to{opacity:0}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact{width:112px;min-width:112px;max-width:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{margin:4px 8px 0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{flex-direction:column;justify-content:center;padding:12px;border-radius:6px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{margin-top:8px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:500;text-align:center;line-height:16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{position:absolute;top:12px;left:64px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-aside-wrapper{left:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over){width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{width:280px-24px;min-width:280px-24px;max-width:280px-24px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{transition:opacity .4s cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item:first-of-type{margin-top:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;opacity:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item:before{content:\"\";position:absolute;top:20px;width:23px;border-top-width:2px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-aside-wrapper{left:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper{width:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;animation:removeWhiteSpaceNoWrap 1ms linear .35s;animation-fill-mode:forwards}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:280px}@keyframes removeWhiteSpaceNoWrap{0%{white-space:nowrap}99%{white-space:nowrap}to{white-space:normal}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin{width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item{flex-direction:column;justify-content:center;height:64px;min-height:64px;max-height:64px;padding:0 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{display:flex;align-items:center;justify-content:center}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{justify-content:center;padding:12px;border-radius:4px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-aside-wrapper{left:80px}.fade-in-animation{opacity:1;transition:opacity 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-animation{opacity:0}}.fade-in-top-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-top-animation{opacity:0;transform:translate3d(0,-100%,0)}}.fade-in-bottom-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-bottom-animation{opacity:0;transform:translate3d(0,100%,0)}}.fade-in-left-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-left-animation{opacity:0;transform:translate3d(-100%,0,0)}}.fade-in-right-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-right-animation{opacity:0;transform:translate3d(100%,0,0)}}.fade-out-animation{opacity:0;transition:opacity 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-animation{opacity:1}}.fade-out-top-animation{opacity:0;transform:translate3d(0,-100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-top-animation{opacity:1;transform:translateZ(0)}}.fade-out-bottom-animation{opacity:0;transform:translate3d(0,100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-bottom-animation{opacity:1;transform:translateZ(0)}}.fade-out-left-animation{opacity:0;transform:translate3d(-100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-left-animation{opacity:1;transform:translateZ(0)}}.fade-out-right-animation{opacity:0;transform:translate3d(100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-right-animation{opacity:1;transform:translateZ(0)}}\n"], dependencies: [{ kind: "component", type: CmatVerticalNavigationAsideItemComponent, selector: "cmat-vertical-navigation-aside-item", inputs: ["activeItemId", "autoCollapse", "item", "name", "skipChildren", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationBasicItemComponent, selector: "cmat-vertical-navigation-basic-item", inputs: ["item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationCollapsableItemComponent, selector: "cmat-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationDividerItemComponent, selector: "cmat-vertical-navigation-divider-item", inputs: ["item", "name", "editState"], outputs: ["editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationGroupItemComponent, selector: "cmat-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "editState", "hasRouteReuseStrategy"], outputs: ["routeReuseStrategyEmitUrl", "editSelectedItemChanged"] }, { kind: "component", type: CmatVerticalNavigationSpacerItemComponent, selector: "cmat-vertical-navigation-spacer-item", inputs: ["item", "name", "editState"], outputs: ["editSelectedItemChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatVerticalNavigationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-vertical-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatVerticalNavigation', imports: [CmatVerticalNavigationAsideItemComponent, CmatVerticalNavigationBasicItemComponent,
+            args: [{ selector: 'cmat-vertical-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatVerticalNavigation', host: {
+                        // eslint-disable-next-line @typescript-eslint/naming-convention
+                        '[class]': 'classList()',
+                        // eslint-disable-next-line @typescript-eslint/naming-convention
+                        '[style]': 'styleList()'
+                    }, imports: [CmatVerticalNavigationAsideItemComponent, CmatVerticalNavigationBasicItemComponent,
                         CmatVerticalNavigationCollapsableItemComponent, CmatVerticalNavigationDividerItemComponent,
                         CmatVerticalNavigationGroupItemComponent, CmatVerticalNavigationSpacerItemComponent], template: "<div class=\"cmat-vertical-navigation-wrapper\" [attr.data-refresh]=\"refreshToken()\">\r\n\r\n  \r\n  <div class=\"cmat-vertical-navigation-header\">\r\n    <ng-content select=\"[cmatVerticalNavigationHeader]\"></ng-content>\r\n  </div>\r\n\r\n  \r\n  <div #navigationContent class=\"cmat-vertical-navigation-content py-2 overflow-y-auto scrollbar-custom\">\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-header\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentHeader]\"></ng-content>\r\n    </div>\r\n\r\n    \r\n    @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @switch (item.type) {\r\n    @case ('aside') {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [activeItemId]=\"activeAsideItemId()\"\r\n      [autoCollapse]=\"autoCollapse\" [skipChildren]=\"true\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (click)=\"toggleAside(item)\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n    }\r\n    @case ('basic') {\r\n    <cmat-vertical-navigation-basic-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-basic-item>\r\n    }\r\n    @case ('collapsable') {\r\n    <cmat-vertical-navigation-collapsable-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      [autoCollapse]=\"autoCollapse\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\"\r\n      (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\"></cmat-vertical-navigation-collapsable-item>\r\n    }\r\n    @case ('divider') {\r\n    <cmat-vertical-navigation-divider-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-divider-item>\r\n    }\r\n    @case ('group') {\r\n    <cmat-vertical-navigation-group-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [editState]=\"editState\" [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-group-item>\r\n    }\r\n    @case ('spacer') {\r\n    <cmat-vertical-navigation-spacer-item [item]=\"item\" [name]=\"name\" [editState]=\"editState\"\r\n      (editSelectedItemChanged)=\"selectItem($event)\">\r\n    </cmat-vertical-navigation-spacer-item>\r\n    }\r\n    }\r\n    }\r\n    }\r\n\r\n    \r\n    <div class=\"cmat-vertical-navigation-content-footer\">\r\n      <ng-content select=\"[cmatVerticalNavigationContentFooter]\"></ng-content>\r\n    </div>\r\n\r\n  </div>\r\n  \r\n  <div class=\"cmat-vertical-navigation-footer\">\r\n    <ng-content select=\"[cmatVerticalNavigationFooter]\"></ng-content>\r\n  </div>\r\n\r\n</div>\r\n\r\n\r\n@if (activeAsideItemId()) {\r\n<div class=\"cmat-vertical-navigation-aside-wrapper overflow-y-auto scrollbar-custom\"\r\n  [animate.enter]=\"position === 'left'?'fade-in-left-animation':'fade-in-right-animation'\"\r\n  [animate.leave]=\"position === 'left'?'fade-out-left-animation':'fade-out-right-animation'\">\r\n  \r\n  @for (item of navigation; track trackByFn($index, item)) {\r\n    @let isVisible = isItemVisible(item);\r\n    @if (isVisible) {\r\n    @if (item.type === 'aside' && item.id === activeAsideItemId()) {\r\n    <cmat-vertical-navigation-aside-item [item]=\"item\" [name]=\"name\" [autoCollapse]=\"autoCollapse\"\r\n      [hasRouteReuseStrategy]=\"hasRouteReuseStrategy\" (routeReuseStrategyEmitUrl)=\"goToRouterLink($event)\">\r\n    </cmat-vertical-navigation-aside-item>\r\n  }\r\n  }\r\n  }\r\n</div>\r\n}", styles: ["cmat-vertical-navigation{position:sticky;display:flex;flex-direction:column;flex:1 0 auto;top:0;width:280px;min-width:280px;max-width:280px;height:100%;z-index:200}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:visibility,margin-left,margin-right,transform,width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-animations-enabled .cmat-vertical-navigation-wrapper{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:width,max-width,min-width}cmat-vertical-navigation.cmat-vertical-navigation-mode-over{position:fixed;top:0;bottom:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over{left:0;transform:translate3d(-100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-left .cmat-vertical-navigation-wrapper{left:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-280px}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over{right:0;transform:translate3d(100%,0,0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-over.cmat-vertical-navigation-opened{transform:translateZ(0)}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-wrapper{right:0}cmat-vertical-navigation.cmat-vertical-navigation-inner{position:relative;width:auto;min-width:0;max-width:none;height:auto;min-height:0;max-height:none;box-shadow:none}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper{position:relative;overflow:visible;height:auto}cmat-vertical-navigation.cmat-vertical-navigation-inner .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{overflow:visible!important}cmat-vertical-navigation .cmat-vertical-navigation-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;width:100%;height:100%;overflow:hidden;z-index:10;background:inherit;box-shadow:inset -1px 0 0 var(--cmat-border)}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content{flex:1 1 auto;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-divider-item{margin:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item{margin-top:24px}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper{position:absolute;display:flex;flex:1 1 auto;flex-direction:column;top:0;bottom:0;left:280px;width:280px;height:100%;z-index:5;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:inherit}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item{padding:24px 0}cmat-vertical-navigation .cmat-vertical-navigation-aside-wrapper>cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item,cmat-vertical-navigation cmat-vertical-navigation-group-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item{display:flex;flex-direction:column;flex:1 0 auto;-webkit-user-select:none;user-select:none}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{position:relative;display:flex;align-items:center;justify-content:flex-start;padding:10px 16px;font-size:13px;font-weight:500;line-height:20px;text-decoration:none;border-radius:6px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item.cmat-vertical-navigation-item-disabled{cursor:default;opacity:.4}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:16px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{font-size:11px;line-height:1.5}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{margin-left:auto}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation cmat-vertical-navigation-spacer-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge .cmat-vertical-navigation-item-badge-content{display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;white-space:nowrap;height:20px}cmat-vertical-navigation cmat-vertical-navigation-aside-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-basic-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{margin:0 12px}cmat-vertical-navigation cmat-vertical-navigation-aside-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item{margin-bottom:4px}cmat-vertical-navigation cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item,cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item{cursor:pointer}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge+.cmat-vertical-navigation-item-arrow{margin-left:8px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{height:20px;line-height:20px;margin-left:auto;transition:transform .3s cubic-bezier(.25,.8,.25,1),color 375ms cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item.cmat-vertical-navigation-item-expanded>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow{transform:rotate(90deg)}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children{margin-top:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:6px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children>*:last-child>.cmat-vertical-navigation-item-children>*:last-child{padding-bottom:0}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item>.cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{overflow:hidden}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:56px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:72px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:88px}cmat-vertical-navigation cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item-children .cmat-vertical-navigation-item{padding-left:104px}cmat-vertical-navigation cmat-vertical-navigation-divider-item{margin:12px 0}cmat-vertical-navigation cmat-vertical-navigation-divider-item .cmat-vertical-navigation-item-wrapper{height:1px;box-shadow:0 1px}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{display:none!important}cmat-vertical-navigation cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}cmat-vertical-navigation cmat-vertical-navigation-spacer-item{margin:6px 0}.cmat-vertical-navigation-overlay{position:absolute;inset:0;z-index:170;background-color:#0009}.cmat-vertical-navigation-overlay+.cmat-vertical-navigation-aside-overlay{background-color:transparent}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-overlay.cmat-vertical-navigation-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay{position:absolute;inset:0;z-index:169;background-color:#0000004d}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-enter{animation:vertical-navigation-overlay-enter .3s cubic-bezier(.25,.8,.25,1)}.cmat-vertical-navigation-aside-overlay.cmat-vertical-navigation-aside-overlay-leave{animation:vertical-navigation-overlay-leave .3s cubic-bezier(.25,.8,.25,1)}@keyframes vertical-navigation-overlay-enter{0%{opacity:0}to{opacity:1}}@keyframes vertical-navigation-overlay-leave{0%{opacity:1}to{opacity:0}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact{width:112px;min-width:112px;max-width:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{margin:4px 8px 0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{flex-direction:column;justify-content:center;padding:12px;border-radius:6px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{margin-top:8px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-title{font-size:12px;font-weight:500;text-align:center;line-height:16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper .cmat-vertical-navigation-item-subtitle{display:none!important}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge{position:absolute;top:12px;left:64px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-collapsable-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-compact .cmat-vertical-navigation-aside-wrapper{left:112px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over){width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-mode-over).cmat-vertical-navigation-position-right.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:auto;right:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{width:280px-24px;min-width:280px-24px;max-width:280px-24px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{transition:opacity .4s cubic-bezier(.25,.8,.25,1)}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item:first-of-type{margin-top:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{padding:10px 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;opacity:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-collapsable-item .cmat-vertical-navigation-item-children{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense:not(.cmat-vertical-navigation-hover):not(.cmat-vertical-navigation-mode-over) .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item:before{content:\"\";position:absolute;top:20px;width:23px;border-top-width:2px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense .cmat-vertical-navigation-aside-wrapper{left:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper{width:280px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge,cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{white-space:nowrap;animation:removeWhiteSpaceNoWrap 1ms linear .35s;animation-fill-mode:forwards}cmat-vertical-navigation.cmat-vertical-navigation-appearance-dense.cmat-vertical-navigation-hover .cmat-vertical-navigation-aside-wrapper{left:280px}@keyframes removeWhiteSpaceNoWrap{0%{white-space:nowrap}99%{white-space:nowrap}to{white-space:normal}}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin{width:80px;min-width:80px;max-width:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-mode-side{margin-left:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-left.cmat-vertical-navigation-opened{margin-left:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-mode-side{margin-right:-80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right.cmat-vertical-navigation-opened{margin-right:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin.cmat-vertical-navigation-position-right .cmat-vertical-navigation-aside-wrapper{left:auto;right:80px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item{flex-direction:column;justify-content:center;height:64px;min-height:64px;max-height:64px;padding:0 16px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper{display:flex;align-items:center;justify-content:center}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item{justify-content:center;padding:12px;border-radius:4px}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-icon{margin:0}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-aside-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-arrow,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-badge-content,cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-basic-item .cmat-vertical-navigation-item-wrapper .cmat-vertical-navigation-item .cmat-vertical-navigation-item-title-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-collapsable-item{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-wrapper .cmat-vertical-navigation-content>cmat-vertical-navigation-group-item>.cmat-vertical-navigation-item-wrapper{display:none}cmat-vertical-navigation.cmat-vertical-navigation-appearance-thin .cmat-vertical-navigation-aside-wrapper{left:80px}.fade-in-animation{opacity:1;transition:opacity 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-animation{opacity:0}}.fade-in-top-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-top-animation{opacity:0;transform:translate3d(0,-100%,0)}}.fade-in-bottom-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-bottom-animation{opacity:0;transform:translate3d(0,100%,0)}}.fade-in-left-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-left-animation{opacity:0;transform:translate3d(-100%,0,0)}}.fade-in-right-animation{opacity:1;transform:translateZ(0);transition:all 225ms cubic-bezier(0,0,.2,1)}@starting-style{.fade-in-right-animation{opacity:0;transform:translate3d(100%,0,0)}}.fade-out-animation{opacity:0;transition:opacity 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-animation{opacity:1}}.fade-out-top-animation{opacity:0;transform:translate3d(0,-100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-top-animation{opacity:1;transform:translateZ(0)}}.fade-out-bottom-animation{opacity:0;transform:translate3d(0,100%,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-bottom-animation{opacity:1;transform:translateZ(0)}}.fade-out-left-animation{opacity:0;transform:translate3d(-100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-left-animation{opacity:1;transform:translateZ(0)}}.fade-out-right-animation{opacity:0;transform:translate3d(100%,0,0);transition:all 195ms cubic-bezier(.4,0,1,1)}@starting-style{.fade-out-right-animation{opacity:1;transform:translateZ(0)}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { classList: [{
-                type: HostBinding,
-                args: ['class']
-            }], styleList: [{
-                type: HostBinding,
-                args: ['style']
-            }], _navigationContentEl: [{
+        }], ctorParameters: () => [], propDecorators: { _navigationContentEl: [{
                 type: ViewChild,
                 args: ['navigationContent']
             }], appearance: [{
@@ -9763,7 +9922,7 @@ class CmatOtpInputComponent {
                 this._valueChangesSub = this.otpForm.valueChanges.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => {
                     Object.keys(this.otpForm.controls).forEach((k) => {
                         const val = this.otpForm.controls[k].value;
-                        if (val && val.length > 1) {
+                        if (typeof val === 'string' && val.length > 1) {
                             if (val.length >= this.config.length) {
                                 this.setValue(val);
                             }
@@ -10072,7 +10231,7 @@ class CmatOtpInputComponent {
         let val = null;
         Object.keys(this.otpForm.controls).forEach((k) => {
             let ctrlVal = this.otpForm.controls[k].value;
-            if (ctrlVal) {
+            if (typeof ctrlVal === 'string' && ctrlVal) {
                 const isLengthExceed = ctrlVal.length > 1;
                 ctrlVal = ctrlVal[0];
                 const letterCase = this.config.letterCase?.toLocaleLowerCase();
@@ -10742,17 +10901,19 @@ var Criteria;
 
 class CmatPasswordStrengthValidator {
     isUndefinedOrEmpty(control) {
-        if (!control?.value || control.value.length === 0) {
+        const value = typeof control.value === 'string' ? control.value : '';
+        if (!value || value.length === 0) {
             return void 0;
         }
     }
     validate(criteria, regex) {
         return (control) => {
             this.isUndefinedOrEmpty(control);
-            if (!regex.test(control.value)) {
+            const value = typeof control.value === 'string' ? control.value : '';
+            if (!regex.test(value)) {
                 const failed = {};
                 failed[criteria] = {
-                    actualValue: control.value,
+                    actualValue: value,
                     requiredPattern: regex
                 };
                 return failed;
@@ -10763,11 +10924,12 @@ class CmatPasswordStrengthValidator {
     confirm(password) {
         return (control) => {
             this.isUndefinedOrEmpty(control);
-            if (control.value !== password) {
+            const value = typeof control.value === 'string' ? control.value : '';
+            if (value !== password) {
                 return {
                     notConfirmed: {
                         password: password,
-                        passwordConfirmation: control.value
+                        passwordConfirmation: value
                     }
                 };
             }
@@ -11103,8 +11265,8 @@ class CmatPopoverComponent {
         this.closeDisabled = false;
         this.classList = {};
         this._onAnimationStateChange = new EventEmitter();
+        this._hostElementRef = inject(ElementRef);
         this._dir = inject(Directionality, { optional: true });
-        this._elementRef = inject(ElementRef);
         this._position = ['below', 'after'];
         this._triggerEvent = 'hover';
         this._scrollStrategy = 'reposition';
@@ -11247,7 +11409,7 @@ class CmatPopoverComponent {
                 obj[className] = true;
                 return obj;
             }, {});
-            this._elementRef.nativeElement.className = '';
+            this._hostElementRef.nativeElement.setAttribute('class', '');
             this.setPositionClasses();
         }
     }
@@ -11822,6 +11984,7 @@ class CmatQRCodeComponent {
         this._renderer = inject(Renderer2);
         this._sanitizer = inject(DomSanitizer);
         this._currentOperationId = 0;
+        this._previousObjectUrl = null;
     }
     ngOnChanges() {
         this._createQRCode();
@@ -11837,11 +12000,16 @@ class CmatQRCodeComponent {
         return new Blob([uInt8Array], { type: imageType });
     }
     emitQRCodeURL(element) {
+        if (this._previousObjectUrl) {
+            URL.revokeObjectURL(this._previousObjectUrl);
+            this._previousObjectUrl = null;
+        }
         const className = element.constructor.name;
         if (className === SVGSVGElement.name) {
             const svgHTML = element.outerHTML;
             const blob = new Blob([svgHTML], { type: 'image/svg+xml' });
             const urlSvg = URL.createObjectURL(blob);
+            this._previousObjectUrl = urlSvg;
             const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlSvg);
             this.qrCodeURL.emit(urlSanitized);
             return;
@@ -11855,6 +12023,7 @@ class CmatQRCodeComponent {
         }
         const blobData = this.convertBase64ImageUrlToBlob(urlImage);
         const urlBlob = URL.createObjectURL(blobData);
+        this._previousObjectUrl = urlBlob;
         const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlBlob);
         this.qrCodeURL.emit(urlSanitized);
     }
@@ -11904,7 +12073,7 @@ class CmatQRCodeComponent {
         });
     }
     _renderElement(element) {
-        for (const node of this.qrcElement.nativeElement.childNodes) {
+        for (const node of Array.from(this.qrcElement.nativeElement.childNodes)) {
             this._renderer.removeChild(this.qrcElement.nativeElement, node);
         }
         this._renderer.appendChild(this.qrcElement.nativeElement, element);
@@ -12019,7 +12188,7 @@ class CmatQRCodeComponent {
             }
         }
         catch (e) {
-            console.error('鐢熸垚QRCode閿欒:', e.message);
+            console.error('生成QRCode错误:', e instanceof Error ? e.message : String(e));
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatQRCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
@@ -12156,7 +12325,7 @@ class CmatRatingComponent {
         }
     }
     writeValue(value) {
-        if (value) {
+        if (value !== null && value !== undefined) {
             this.value = value;
             this.currentValue.set(value);
         }
@@ -12354,15 +12523,16 @@ class CmatSelectSearchComponent {
         this._options$ = signal(null, ...(ngDevMode ? [{ debugName: "_options$" }] : /* istanbul ignore next */ []));
         this._optionsList$ = toObservable(this._options$).pipe(switchMap((_options) => _options ?
             _options.changes.pipe(map((options) => options.toArray()), startWith$1(_options.toArray())) : of(null)));
-        this._optionsLength$ = this._optionsList$.pipe(map(options => options ? options.length : 0));
+        this._optionsLength$ = this._optionsList$.pipe(map((options) => options ? options.length : 0));
+        this._previousSelectedValues = [];
         // eslint-disable-next-line @typescript-eslint/member-ordering
         this.showNoEntriesFound = signal(false, ...(ngDevMode ? [{ debugName: "showNoEntriesFound" }] : /* istanbul ignore next */ []));
         // eslint-disable-next-line @typescript-eslint/member-ordering
         this.showNoEntriesFound$ = combineLatest([
             this.formControl.valueChanges,
             this._optionsLength$
-        ]).pipe(map(([value, optionsLength]) => this.noEntriesFoundLabel && value
-            && optionsLength === this._getOptionsLengthOffset()), tap(showNoEntriesFound => this.showNoEntriesFound.set(!!showNoEntriesFound)));
+        ]).pipe(map(([value, optionsLength]) => !!this.noEntriesFoundLabel && !!value
+            && optionsLength === this._getOptionsLengthOffset()), tap((showNoEntriesFound) => this.showNoEntriesFound.set(!!showNoEntriesFound)));
         this.onTouched = () => { };
         this._applyDefaultOptions(this._defaultOptions);
     }
@@ -12370,7 +12540,7 @@ class CmatSelectSearchComponent {
         return !!this._matOption;
     }
     get value() {
-        return this.formControl.value;
+        return this.formControl.value ?? '';
     }
     get _options() {
         return this._options$();
@@ -12388,7 +12558,7 @@ class CmatSelectSearchComponent {
                 this.matSelect.panelClass = [this.matSelect.panelClass, panelClass];
             }
             else if (typeof this.matSelect.panelClass === 'object') {
-                this.matSelect.panelClass.entries[panelClass] = true;
+                this.matSelect.panelClass[panelClass] = true;
             }
         }
         else {
@@ -12426,7 +12596,7 @@ class CmatSelectSearchComponent {
                     .subscribe(() => this._adjustScrollTopToFitActiveOptionIntoView());
             }
             else {
-                console.log('_keyManager was not initialized.');
+                console.warn('_keyManager was not initialized.');
             }
             this._options = this.matSelect.options;
             let previousFirstOption = this._options.toArray()[this._getOptionsLengthOffset()];
@@ -12442,7 +12612,7 @@ class CmatSelectSearchComponent {
                             const firstOptionIsChanged = !this.matSelect.compareWith(previousFirstOption, currentFirstOption);
                             if (firstOptionIsChanged
                                 || !keyManager.activeItem
-                                || !options.find(option => this.matSelect.compareWith(option, keyManager.activeItem))) {
+                                || !options.find((option) => this.matSelect.compareWith(option, keyManager.activeItem))) {
                                 keyManager.setFirstItemActive();
                             }
                             setTimeout(() => {
@@ -12501,12 +12671,17 @@ class CmatSelectSearchComponent {
         // 方向键切换时同步当前高亮项
         if (event.code === 'ArrowUp' || event.code === 'ArrowDown') {
             const ariaActiveDescendantId = this.matSelect._getAriaActiveDescendant();
-            const index = this._options?.toArray().findIndex(item => item.id === ariaActiveDescendantId) ?? -1;
+            const index = this._options?.toArray().findIndex((item) => item.id === ariaActiveDescendantId) ?? -1;
             if (index >= 0) {
                 this._unselectActiveDescendant();
                 this._activeDescendant = this._options?.toArray()[index]._getHostElement();
                 this._activeDescendant?.setAttribute('aria-selected', 'true');
-                this.searchSelectInput.nativeElement.setAttribute('aria-activedescendant', ariaActiveDescendantId);
+                if (ariaActiveDescendantId) {
+                    this.searchSelectInput.nativeElement.setAttribute('aria-activedescendant', ariaActiveDescendantId);
+                }
+                else {
+                    this.searchSelectInput.nativeElement.removeAttribute('aria-activedescendant');
+                }
             }
         }
     }
@@ -12521,7 +12696,7 @@ class CmatSelectSearchComponent {
         this.onTouched();
     }
     registerOnChange(fn) {
-        this.formControl.valueChanges.pipe(filter(value => value !== this._lastExternalInputValue), tap(() => this._lastExternalInputValue = undefined), takeUntilDestroyed(this._destroyRef)).subscribe(fn);
+        this.formControl.valueChanges.pipe(filter((value) => value !== this._lastExternalInputValue), tap(() => this._lastExternalInputValue = undefined), takeUntilDestroyed(this._destroyRef)).subscribe(fn);
     }
     registerOnTouched(fn) {
         this.onTouched = fn;
@@ -12587,11 +12762,8 @@ class CmatSelectSearchComponent {
         if (!defaultOptions) {
             return;
         }
-        for (const key of configurableDefaultOptions) {
-            if (Object.prototype.hasOwnProperty.call(defaultOptions, key)) {
-                this[key] = defaultOptions[key];
-            }
-        }
+        const options = defaultOptions;
+        Object.assign(this, options);
     }
     _initMultipleHandling() {
         // 初始化多选场景下的已选值保留逻辑
@@ -12606,25 +12778,23 @@ class CmatSelectSearchComponent {
         this.matSelect.ngControl.valueChanges?.pipe(takeUntilDestroyed(this._destroyRef))
             .subscribe((values) => {
             let restoreSelectedValues = false;
+            let currentValues = Array.isArray(values) ? values : [];
             if (this.matSelect.multiple) {
                 if ((this.alwaysRestoreSelectedOptionsMulti || (this.formControl.value?.length))
                     && this._previousSelectedValues && Array.isArray(this._previousSelectedValues)) {
-                    if (!values || !Array.isArray(values)) {
-                        values = [];
-                    }
-                    const optionValues = this.matSelect.options.map(option => option.value);
+                    const optionValues = this.matSelect.options.map((option) => option.value);
                     this._previousSelectedValues.forEach((previousValue) => {
-                        if (!values.some((v) => this.matSelect.compareWith(v, previousValue))
-                            && !optionValues.some(v => this.matSelect.compareWith(v, previousValue))) {
-                            values.push(previousValue);
+                        if (!currentValues.some((v) => this.matSelect.compareWith(v, previousValue))
+                            && !optionValues.some((v) => this.matSelect.compareWith(v, previousValue))) {
+                            currentValues.push(previousValue);
                             restoreSelectedValues = true;
                         }
                     });
                 }
             }
-            this._previousSelectedValues = values;
+            this._previousSelectedValues = currentValues;
             if (restoreSelectedValues) {
-                this.matSelect._onChange(values);
+                this.matSelect._onChange(currentValues);
             }
         });
     }
@@ -12754,6 +12924,7 @@ class CmatSelectTableComponent {
         this._nullRow = { id: null };
         this._completeValueList = [];
         this._placeholder = '';
+        this._value = null;
         this._required = false;
         this._disabled = false;
         // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -12790,8 +12961,9 @@ class CmatSelectTableComponent {
                 this._matSelect.panelClass = [this._matSelect.panelClass, ...panelClass];
             }
             else if (typeof this._matSelect.panelClass === 'object') {
+                const panelClassObject = this._matSelect.panelClass;
                 panelClass.forEach((i) => {
-                    this._matSelect.panelClass.entries[i] = true;
+                    panelClassObject[i] = true;
                 });
             }
         }
@@ -12827,7 +12999,10 @@ class CmatSelectTableComponent {
             this._matOptions
                 .toArray()
                 .filter(option => !isNil(option) && !isNil(option.value) && !option._getHostElement().classList.contains('contains-cmat-select-search'))
-                .forEach(option => options[`${option.value.id}`] = option);
+                .forEach((option) => {
+                const row = option.value;
+                options[`${row.id}`] = option;
+            });
             const tableOptions = this._buildTableOptions(options);
             this._matSelect?.options.reset(this._matSelectSearch ? [this._matOptions.first, ...tableOptions] : tableOptions);
             try {
@@ -12931,11 +13106,13 @@ class CmatSelectTableComponent {
         if (!isNil(changes.resetFiltersOnOpen) && changes.resetFiltersOnOpen.currentValue !== false) {
             this._resetFilters();
         }
-        if (!isNil(changes.dataSource)
-            && !isNil(changes.dataSource.currentValue)
-            && isArray(changes.dataSource.currentValue.data)) {
-            const columns = changes.dataSource.currentValue.columns;
-            const data = changes.dataSource.currentValue.data;
+        if (!isNil(changes.dataSource) && !isNil(changes.dataSource.currentValue)) {
+            const currentDataSource = changes.dataSource.currentValue;
+            if (!isArray(currentDataSource.data)) {
+                return;
+            }
+            const columns = currentDataSource.columns;
+            const data = currentDataSource.data;
             this._rowById.clear();
             this._columnKeys = columns.map((column) => column.key);
             this.tableDataSource.set([...data]);
@@ -12984,8 +13161,9 @@ class CmatSelectTableComponent {
             this.completeRowList.splice(0);
             this._completeValueList.splice(0);
             if (option.value) {
-                this.completeRowList.push(option.value);
-                this._completeValueList.push(option.value.id);
+                const row = option.value;
+                this.completeRowList.push(row);
+                this._completeValueList.push(row.id);
             }
         }
     }
@@ -13008,7 +13186,8 @@ class CmatSelectTableComponent {
             this.closed.emit(!opened);
             return;
         }
-        this._table._headerRowDefChanged = true;
+        const table = this._table;
+        table._headerRowDefChanged = true;
         setTimeout(() => this._expandPanelForTableRows(), 1);
     }
     filterFormControl(key) {
@@ -13129,7 +13308,7 @@ class CmatSelectTableComponent {
         if (isNil(this.overallFilterControl.value)) {
             return;
         }
-        const filterValueLC = this.overallFilterControl.value.toLowerCase();
+        const filterValueLC = (this.overallFilterControl.value ?? '').toLowerCase();
         if (filterValueLC.trim().length === 0) {
             return;
         }
@@ -13227,7 +13406,19 @@ class CmatSelectTableComponent {
         const columnFilter = filter.filter;
         const comparator = columnFilter?.comparator;
         const filterValue = filter.value;
-        const normalizedFilterValue = columnFilter?.type === 'number' ? Number(filterValue) : filterValue;
+        let normalizedFilterValue;
+        if (columnFilter?.type === 'number') {
+            normalizedFilterValue = Number(filterValue);
+        }
+        else if (filterValue === null || filterValue === undefined) {
+            normalizedFilterValue = '';
+        }
+        else if (typeof filterValue === 'object') {
+            normalizedFilterValue = '';
+        }
+        else {
+            normalizedFilterValue = filterValue;
+        }
         if (typeof columnFilter?.comparatorFn === 'function') {
             return columnFilter.comparatorFn.call(null, cellValue, normalizedFilterValue, row);
         }
@@ -13269,6 +13460,12 @@ class CmatSelectTableComponent {
     _getMatOptionById(id) {
         return this._matOptions.find(option => option.id === id);
     }
+    getFilterContext(column) {
+        return { column };
+    }
+    getCellValue(row, key) {
+        return row[key];
+    }
     _expandPanelForTableRows() {
         let tableAdditionalHeight = 0;
         this._table._getRenderedRows(this._table._headerRowOutlet).forEach(row => tableAdditionalHeight += row.getBoundingClientRect().height);
@@ -13303,7 +13500,7 @@ class CmatSelectTableComponent {
         const rowRecord = row;
         let hasMatch = false;
         const substitution = template.replace(/[$]{1}[{]{1}([^}]+)[}]{1}?/g, (_, key) => {
-            const value = rowRecord[key];
+            const value = rowRecord[String(key)];
             if (isNil(value)) {
                 return '';
             }
@@ -13322,13 +13519,13 @@ class CmatSelectTableComponent {
         return this._sortData([...value], this.triggerLabelSort.active, this.triggerLabelSort.direction);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatSelectTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatSelectTableComponent, isStandalone: true, selector: "cmat-select-table", inputs: { id: "id", dataSource: "dataSource", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", isPhone: "isPhone", multiple: "multiple", overallSearchEnabled: "overallSearchEnabled", overallSearchVisible: "overallSearchVisible", resetSortOnOpen: "resetSortOnOpen", resetFiltersOnOpen: "resetFiltersOnOpen", customTriggerLabelFn: "customTriggerLabelFn", triggerLabelSort: "triggerLabelSort", customTriggerLabelTemplate: "customTriggerLabelTemplate", canNull: "canNull", defaultSort: "defaultSort", resetOptionAction: "resetOptionAction", keyParam: "keyParam", compareWith: "compareWith", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { closed: "closed" }, host: { listeners: { "document:click": "clickedOut()" }, properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], viewQueries: [{ propertyName: "_matSelectSearch", first: true, predicate: CmatSelectSearchComponent$1, descendants: true }, { propertyName: "_sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "_table", first: true, predicate: MatTable, descendants: true }, { propertyName: "matSelect", first: true, predicate: ["componentSelect"], descendants: true }, { propertyName: "_matOptions", predicate: MatOption$1, descendants: true }], exportAs: ["cmatSelectTable"], usesOnChanges: true, ngImport: i0, template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n    @let triggerLabel = getTriggerLabel();\r\n    {{ triggerLabel }}\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{row[columnKey]}}\r\n                    </div>\r\n\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                    <mat-option></mat-option>\r\n                    }@else {\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                    }\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"hasNullRow && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: hasNullRow && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                       {{hasNullRow && row.id === null && $index === 1 ? '\u7A7A' : row[columnKey]}}\r\n                    </div>                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"], dependencies: [{ kind: "component", type: CmatSelectSearchComponent$1, 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: MatFormFieldModule }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.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: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.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: MatInputModule }, { kind: "directive", type: i1$3.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: MatSortModule }, { kind: "directive", type: i8.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i8.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: CmatDigitOnlyDirective$1, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatSelectTableComponent, isStandalone: true, selector: "cmat-select-table", inputs: { id: "id", dataSource: "dataSource", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", isPhone: "isPhone", multiple: "multiple", overallSearchEnabled: "overallSearchEnabled", overallSearchVisible: "overallSearchVisible", resetSortOnOpen: "resetSortOnOpen", resetFiltersOnOpen: "resetFiltersOnOpen", customTriggerLabelFn: "customTriggerLabelFn", triggerLabelSort: "triggerLabelSort", customTriggerLabelTemplate: "customTriggerLabelTemplate", canNull: "canNull", defaultSort: "defaultSort", resetOptionAction: "resetOptionAction", keyParam: "keyParam", compareWith: "compareWith", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { closed: "closed" }, host: { listeners: { "document:click": "clickedOut()" }, properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], viewQueries: [{ propertyName: "_matSelectSearch", first: true, predicate: CmatSelectSearchComponent$1, descendants: true }, { propertyName: "_sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "_table", first: true, predicate: MatTable, descendants: true }, { propertyName: "matSelect", first: true, predicate: ["componentSelect"], descendants: true }, { propertyName: "_matOptions", predicate: MatOption$1, descendants: true }], exportAs: ["cmatSelectTable"], usesOnChanges: true, ngImport: i0, template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n    @let triggerLabel = getTriggerLabel();\r\n    {{ triggerLabel }}\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{getCellValue(row, columnKey)}}\r\n                    </div>\r\n\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                    <mat-option></mat-option>\r\n                    }@else {\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                    }\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"hasNullRow && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: hasNullRow && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{hasNullRow && row.id === null && $index === 1 ? '\u7A7A' : getCellValue(row, columnKey)}}\r\n                    </div>                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"], dependencies: [{ kind: "component", type: CmatSelectSearchComponent$1, 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: MatFormFieldModule }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.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: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.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: MatInputModule }, { kind: "directive", type: i1$3.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: MatSortModule }, { kind: "directive", type: i8.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i8.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: CmatDigitOnlyDirective$1, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatSelectTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-table', exportAs: 'cmatSelectTable', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], imports: [CmatSelectSearchComponent$1, MatFormFieldModule, MatSelectModule, ReactiveFormsModule, CommonModule,
                         MatIconModule, MatTableModule, MatInputModule, MatSortModule, CmatDigitOnlyDirective$1
-                    ], template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n    @let triggerLabel = getTriggerLabel();\r\n    {{ triggerLabel }}\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{row[columnKey]}}\r\n                    </div>\r\n\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                    <mat-option></mat-option>\r\n                    }@else {\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                    }\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: column}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"hasNullRow && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: hasNullRow && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                       {{hasNullRow && row.id === null && $index === 1 ? '\u7A7A' : row[columnKey]}}\r\n                    </div>                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"] }]
+                    ], template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n    @let triggerLabel = getTriggerLabel();\r\n    {{ triggerLabel }}\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{getCellValue(row, columnKey)}}\r\n                    </div>\r\n\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple \r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareWith\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState()}\"\r\n        (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState() === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        @if(!isPhone){\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState() ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }@else{\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState() ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\" [svgIcon]=\"'mat_outline:search'\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource()\">\r\n            @for (columnKey of tableColumns(); track $index) {\r\n            @let column = tableColumnsMap.get(columnKey);\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                    <mat-option></mat-option>\r\n                    }@else {\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                    }\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!column?.sortable\">\r\n                    @if(!column?.sortable){\r\n                    <div>{{column?.name}}</div>\r\n                    }@else {\r\n                    @switch (column?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"getFilterContext(column)\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{column?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"hasNullRow && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: hasNullRow && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    <div class=\" has-label-on-mobile\" [attr.data-label]=\"column?.name+':'\">\r\n                        {{hasNullRow && row.id === null && $index === 1 ? '\u7A7A' : getCellValue(row, columnKey)}}\r\n                    </div>                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns(); sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns();\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"] }]
         }], ctorParameters: () => [], propDecorators: { id: [{
                 type: HostBinding,
                 args: ['attr.id']
@@ -13607,7 +13804,9 @@ class CmatSelectTreeComponent {
         }
     }
     onFocusOut(event) {
-        if (!this._matSelect.panel.nativeElement.contains(event.relatedTarget)) {
+        const relatedTarget = event.relatedTarget;
+        const panelElement = this._matSelect.panel.nativeElement;
+        if (!(relatedTarget instanceof Element) || !panelElement.contains(relatedTarget)) {
             this.touched = true;
             this.focused = false;
             this._onTouchedChange();
@@ -14159,6 +14358,8 @@ class CmatSpeedDialComponent {
         this._animationMode = 'fling';
         this._fixed = false;
         this._documentClickUnlistener = null;
+        this._openChangeTimeoutId = null;
+        this._dialOpened = signal(false, ...(ngDevMode ? [{ debugName: "_dialOpened" }] : /* istanbul ignore next */ []));
     }
     get fixed() {
         return this._fixed;
@@ -14168,14 +14369,25 @@ class CmatSpeedDialComponent {
         this._processOutsideClickState();
     }
     // eslint-disable-next-line @typescript-eslint/member-ordering
+    get dialOpened() {
+        return this._dialOpened();
+    }
+    // eslint-disable-next-line @typescript-eslint/member-ordering
     get open() {
         return this._open;
     }
     set open(open) {
         const previousOpen = this._open;
         this._open = open;
+        this._dialOpened.set(this._open);
         if (previousOpen !== this._open) {
-            this.openChange.emit(this._open);
+            if (this._openChangeTimeoutId !== null) {
+                clearTimeout(this._openChangeTimeoutId);
+            }
+            this._openChangeTimeoutId = window.setTimeout(() => {
+                this._openChangeTimeoutId = null;
+                this.openChange.emit(this._open);
+            });
             if (this._isInitialized) {
                 this.setActionsVisibility();
             }
@@ -14207,7 +14419,9 @@ class CmatSpeedDialComponent {
             this._setElementClass(previousAnimationMode, false);
             this._setElementClass(this.animationMode, true);
             if (this._isInitialized) {
-                void Promise.resolve(null).then(() => (this.open = false));
+                window.setTimeout(() => {
+                    this.open = false;
+                });
             }
         }
     }
@@ -14219,6 +14433,10 @@ class CmatSpeedDialComponent {
     }
     ngOnDestroy() {
         this._unsetDocumentClickListener();
+        if (this._openChangeTimeoutId !== null) {
+            clearTimeout(this._openChangeTimeoutId);
+            this._openChangeTimeoutId = null;
+        }
     }
     toggle() {
         this.open = !this.open;
@@ -14270,7 +14488,7 @@ class CmatSpeedDialComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatSpeedDialComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: CmatSpeedDialComponent, isStandalone: true, selector: "cmat-speed-dial", inputs: { fixed: "fixed", open: "open", direction: "direction", animationMode: "animationMode" }, outputs: { openChange: "openChange" }, host: { listeners: { "click": "onClick()" }, properties: { "class.dial-opened": "this.open" } }, queries: [{ propertyName: "_childActions", first: true, predicate: CmatSpeedDialActionsComponent, descendants: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: CmatSpeedDialComponent, isStandalone: true, selector: "cmat-speed-dial", inputs: { fixed: "fixed", open: "open", direction: "direction", animationMode: "animationMode" }, outputs: { openChange: "openChange" }, host: { listeners: { "click": "onClick()" }, properties: { "class.dial-opened": "this.dialOpened" } }, queries: [{ propertyName: "_childActions", first: true, predicate: CmatSpeedDialActionsComponent, descendants: true }], ngImport: i0, template: `
         <div class="cmat-speed-dial-container">
             <ng-content select="cmat-speed-dial-trigger" />
             <ng-content select="cmat-speed-dial-actions" />
@@ -14292,10 +14510,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 args: [CmatSpeedDialActionsComponent]
             }], fixed: [{
                 type: Input
-            }], open: [{
+            }], dialOpened: [{
                 type: HostBinding,
                 args: ['class.dial-opened']
-            }, {
+            }], open: [{
                 type: Input
             }], direction: [{
                 type: Input
@@ -14616,7 +14834,7 @@ class CmatToastModalComponent {
         if (this.leaving())
             return;
         this.leaving.set(true);
-        const el = this._elementRef.nativeElement?.querySelector('.toast') ?? null;
+        const el = this._elementRef.nativeElement.querySelector('.toast');
         if (el) {
             const onEnd = () => {
                 cleanup();
@@ -14739,22 +14957,29 @@ class CmatToastService {
     }
     _setGlobalValues(toast) {
         if (this._globalConfigs) {
-            for (const [key, value] of Object.entries(this._globalConfigs)) {
-                toast = {
-                    ...toast,
-                    [key]: value,
-                };
+            const globalConfigs = this._globalConfigs;
+            if (globalConfigs.title) {
+                toast.title = globalConfigs.title;
+            }
+            if (globalConfigs.timeout !== undefined) {
+                toast.timeout = globalConfigs.timeout;
+            }
+            if (globalConfigs.limit !== undefined) {
+                toast.limit = globalConfigs.limit;
+            }
+            if (globalConfigs.isCountdown !== undefined) {
+                toast.isCountdown = globalConfigs.isCountdown;
             }
-            if (this._globalConfigs.theme) {
-                toast.theme = `toasta-theme-${this._globalConfigs.theme}`;
+            if (globalConfigs.theme) {
+                toast.theme = `toasta-theme-${globalConfigs.theme}`;
             }
-            if (this._globalConfigs.position) {
-                toast.position = `toasta-position-${this._globalConfigs.position}`;
+            if (globalConfigs.position) {
+                toast.position = `toasta-position-${globalConfigs.position}`;
             }
-            if (this._globalConfigs.showClose === false) {
+            if (globalConfigs.showClose === false) {
                 toast.showClose = false;
             }
-            if (this._globalConfigs.showDuration === false) {
+            if (globalConfigs.showDuration === false) {
                 toast.showDuration = false;
             }
         }
@@ -14769,7 +14994,7 @@ class CmatToastService {
             ...toast,
             id: this._counter++,
         };
-        if (this.toasts.length >= toast.limit) {
+        if (this.toasts.length >= (toast.limit ?? 0)) {
             this.toasts.shift();
         }
         this.toasts.push(latestToast);
@@ -14829,7 +15054,7 @@ class CmatTransferPickerService {
             ['2', (a, b) => a > b],
             ['3', (a, b) => a < b],
             ['0,2', (a, b) => a >= b],
-            ['0,2', (a, b) => a <= b]
+            ['0,3', (a, b) => a <= b]
         ]);
         this._conditionMap = new Map([
             // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
@@ -14933,7 +15158,7 @@ class CmatTransferPickerService {
                         this._filteredDataSource.push(data);
                     }
                     else {
-                        compareResultArr.push(compare);
+                        compareResultArr.push(compare ?? false);
                     }
                 }
             });
@@ -15009,12 +15234,12 @@ class CmatTransferPickerFilterComponent {
     }
     onFilterClick(filter) {
         filter.selected = !filter.selected;
-        const existFilter = this.filterData.filters.find(item => item.value === filter.value);
+        const existFilter = this.filterData.filters.find((item) => item.value === filter.value);
         if (!existFilter) {
             this.filterData.filters.push(filter);
         }
         else if (!filter.selected) {
-            this.filterData.filters.splice(this.filterData.filters.findIndex(j => j === filter), 1);
+            this.filterData.filters.splice(this.filterData.filters.findIndex((j) => j === filter), 1);
         }
         this.changeFilterData();
     }
@@ -15025,6 +15250,11 @@ class CmatTransferPickerFilterComponent {
     changeFilterData() {
         this._service.filterDataSource({ filterData: this.filterData });
     }
+    ngOnDestroy() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatTransferPickerFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CmatTransferPickerFilterComponent, isStandalone: true, selector: "cmat-transfer-picker-filter", inputs: { filters: "filters" }, viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }], exportAs: ["cmatTransferPickerFilter"], ngImport: i0, template: "<button type=\"button\" class=\"mr-2 mt-1\" matIconButton  cdk-overlay-origin (click)=\"toggleFilter()\">\r\n  <mat-icon svgIcon=\"mat_outline:filter_list\"></mat-icon>\r\n</button>\r\n<ng-template #filterTemplate=\"cdkPortal\" cdkPortal>\r\n  <div\r\n    class=\"transfer-picker-filter-panel bg-card flex flex-col flex-nowrap place-content-start box-border items-start w-full shadow\">\r\n    <mat-button-toggle-group name=\"condition\" [hideSingleSelectionIndicator]=\"true\" (change)=\"onConditionChange($event.value)\">\r\n      <mat-button-toggle value=\"or\" [checked]=\"filterData.condition === 'or'\">\u6216</mat-button-toggle>\r\n      <mat-button-toggle value=\"and\" [checked]=\"filterData.condition === 'and'\">\u4E14</mat-button-toggle>\r\n    </mat-button-toggle-group>\r\n\r\n    <div class=\"chip-list\">\r\n      @for (item of filters; track $index) {\r\n        <div class=\"chip-wrapper\" role=\"presentation\"\r\n          (click)=\"onFilterClick(item)\">\r\n          <span class=\"chip\" [ngClass]=\"{selected: item?.selected}\">{{item.label}}</span>\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n</ng-template>", styles: [".transfer-picker-filter-panel{min-width:276px;padding:10px 0;border-width:1px}.transfer-picker-filter-panel .mat-button-toggle-group{font-size:12px;margin-right:15px;margin-bottom:20px;align-self:flex-end}.transfer-picker-filter-panel .mat-button-toggle-group .mat-button-toggle-label-content{line-height:1.8}.transfer-picker-filter-panel .chip-list{width:276px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;box-sizing:border-box}.transfer-picker-filter-panel .chip-list:after{content:\"\";flex:1 1 0%;max-width:33.333333%}.transfer-picker-filter-panel .chip-list .chip-wrapper{flex:1 1 0%;box-sizing:border-box;max-width:33.333333%;text-align:center;margin-bottom:20px}.transfer-picker-filter-panel .chip-list .chip-wrapper .chip{display:inline-block;min-width:50%;cursor:pointer;padding:5px 10px;font-size:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$h.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$h.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i4.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i6.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
@@ -15050,7 +15280,7 @@ class CmatTransferPickerSearchComponent {
         this.keyword
             .valueChanges
             .pipe(debounceTime$1(200), distinctUntilChanged())
-            .subscribe((keyword) => this._service.filterDataSource({ keyword }));
+            .subscribe((keyword) => this._service.filterDataSource({ keyword: keyword ?? '' }));
     }
     reset() {
         this.keyword.setValue('');
@@ -15107,7 +15337,7 @@ class CmatTransferPickerSourceComponent {
                 : new CmatTransferItemFlatNode();
             flatNode.label = node.label;
             flatNode.value = node.value;
-            flatNode.disabled = node.disabled;
+            flatNode.disabled = !!node.disabled;
             flatNode.level = level;
             flatNode.expandable = !!node.children;
             this.nestedNodeMap.set(node, flatNode);
@@ -15415,7 +15645,8 @@ class CmatTreeTableComponent {
             if (this.data) {
                 this._treeTable = this._getFlattenNodes(this.data);
                 this.dataSource.set(this._generateDataSource());
-                this.displayedColumns.set([...Object.keys(this.data[0]).filter(x => typeof this.data[0][x] !== 'object' && this.data[0].showHeader?.includes(x)), 'operate']);
+                const first = this.data[0];
+                this.displayedColumns.set([...Object.keys(first).filter(x => typeof first[x] !== 'object' && first.showHeader?.includes(x)), 'operate']);
             }
             else {
                 this._treeTable = [];
@@ -15442,10 +15673,10 @@ class CmatTreeTableComponent {
     _switchNodeVisible(node, visible) {
         if (node.children) {
             node.children.forEach((el) => {
-                visible == null ? el.isVisible = !el.isVisible : el.isVisible = visible;
+                el.isVisible = visible ?? !el.isVisible;
                 if (visible !== false)
                     el.isExpanded = true;
-                this._switchNodeVisible(el, el.isVisible);
+                this._switchNodeVisible(el, el.isVisible === undefined ? null : !!el.isVisible);
             });
         }
     }
@@ -15527,7 +15758,7 @@ class CmatFilesUtilService {
             observe: 'events',
             reportProgress: true,
             responseType: 'json'
-        }).pipe(tap$1((res) => res), catchError(CmatUtilsService$1.handleError));
+        }).pipe(catchError(CmatUtilsService$1.handleError));
     }
     uploadFileToProcessed(file) {
         return this._http.post(`${this._config.fileUrl}/upload/finish`, file, {
@@ -15535,7 +15766,7 @@ class CmatFilesUtilService {
             observe: 'events',
             reportProgress: true,
             responseType: 'json'
-        }).pipe(tap$1((res) => res), catchError(CmatUtilsService$1.handleError));
+        }).pipe(catchError(CmatUtilsService$1.handleError));
     }
     switchPublic(fileId, isPublic) {
         return this._http.patch(`${this._config.fileUrl}/switch-public/${fileId}`, {
@@ -15543,12 +15774,12 @@ class CmatFilesUtilService {
             isPublic
         }, {
             headers: CmatUtilsService$1.getRequestCryptoHeaders('files-switch-public')
-        }).pipe(catchError(err => CmatUtilsService$1.handleError(err)));
+        }).pipe(catchError((err) => CmatUtilsService$1.handleError(err)));
     }
     deleteFile(fileId) {
         return this._http.delete(`${this._config.fileUrl}/${fileId}`, {
             headers: CmatUtilsService$1.getRequestCryptoHeaders(fileId)
-        }).pipe(catchError(err => CmatUtilsService$1.handleError(err)));
+        }).pipe(catchError((err) => CmatUtilsService$1.handleError(err)));
     }
     getFileList(queryData, pageIndex = -1, pageSize = -1) {
         if (this._config.enableDataProtect) {
@@ -15584,6 +15815,7 @@ class CmatUploadComponent {
         this.isPublic = false;
         this.editMode = false;
         this.autoUpload = true;
+        this.id = null;
         this.removeEvent = new EventEmitter();
         this.uploadEvent = new EventEmitter();
         this.progressPercentage = signal(0, ...(ngDevMode ? [{ debugName: "progressPercentage" }] : /* istanbul ignore next */ []));
@@ -15626,22 +15858,29 @@ class CmatUploadComponent {
         formData.set('fileData', this._file, this._file.name);
         formData.append('fileInfo', JSON.stringify(fileModel));
         this._fileService.uploadFile(formData).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((event) => {
-            if (event.type === HttpEventType.UploadProgress) {
+            if (event.type === HttpEventType.UploadProgress && typeof event.total === 'number') {
                 this.progressPercentage.set(Math.floor(event.loaded * 100 / event.total));
                 this.loaded.set(event.loaded);
                 this.total.set(event.total);
             }
             if (event.type === HttpEventType.Response) {
-                this.id = event.body.id;
-                this.file.id = event.body.id;
+                const fileId = typeof event.body?.id === 'string' ? event.body.id : undefined;
+                if (!fileId) {
+                    this.isUploading.set(false);
+                    return;
+                }
+                this.id = fileId;
+                this.file.id = fileId;
                 this.isUploading.set(false);
                 this.uploadEvent.emit(this.file);
             }
         });
     }
     download() {
+        if (!this.id)
+            return;
         this._fileService.downloadFile(this.id).pipe(takeUntilDestroyed(this._destroyRef)).subscribe((file) => {
-            saveAs(new Blob([file.body], { type: 'text/plain;charset=utf-8' }), this.file.name);
+            saveAs(new Blob([file.body ?? new Blob()], { type: 'text/plain;charset=utf-8' }), this.file.name);
         });
     }
     remove() {
@@ -15690,7 +15929,7 @@ class CmatUploadQueueComponent {
         this.outputRemoveIdEvent = new EventEmitter();
         this.outputUploadIdEvent = new EventEmitter();
         this.outputFilesDataEvent = new EventEmitter();
-        this.id = 'cmatupload-' + Math.floor(Math.random() * 1000000);
+        this.id = 'cmatupload-' + crypto.randomUUID().slice(0, 8);
         this.isHandSet = signal(false, ...(ngDevMode ? [{ debugName: "isHandSet" }] : /* istanbul ignore next */ []));
         this._cmatMediaWatcherService = inject(CmatMediaWatcherService$1);
         this._elementRef = inject(ElementRef);
@@ -15702,7 +15941,9 @@ class CmatUploadQueueComponent {
         });
     }
     onDrop(event) {
-        const files = event.dataTransfer.files;
+        const files = event.dataTransfer?.files;
+        if (!files)
+            return;
         for (const file of files) {
             if (this.accept?.includes(file.type))
                 this.add(file);
@@ -15714,7 +15955,10 @@ class CmatUploadQueueComponent {
         event.preventDefault();
     }
     ngAfterViewInit() {
-        const fileUpload = this._elementRef.nativeElement.querySelector('#' + this.id);
+        const fileUpload = this._elementRef.nativeElement.querySelector(`#${this.id}`);
+        if (!(fileUpload instanceof HTMLInputElement)) {
+            return;
+        }
         fileUpload.onchange = () => {
             for (let index = 0; index < (fileUpload.files?.length ?? 0); index++) {
                 const file = fileUpload.files[index];
@@ -15738,12 +15982,13 @@ class CmatUploadQueueComponent {
         }
     }
     upload(event) {
-        this.outputUploadIdEvent.emit(event.id);
+        const uploadId = event instanceof CmatUploadComponent ? event.id : event.id;
+        this.outputUploadIdEvent.emit(uploadId ?? '');
         this.outputFilesDataEvent.emit(this.filesData);
     }
     remove(event) {
         if (this.filesData) {
-            const index = this.filesData.findIndex(j => j === event.file);
+            const index = this.filesData.findIndex((j) => j === event.file);
             if (index > -1) {
                 this.filesData.splice(index, 1);
                 if (event.file.id) {
@@ -15764,7 +16009,7 @@ class CmatUploadQueueComponent {
         this.fileUploads.forEach((fileUpload) => { fileUpload.remove(); });
     }
     choose() {
-        this._elementRef.nativeElement.querySelector('#' + this.id).click();
+        this._elementRef.nativeElement.querySelector(`#${this.id}`)?.dispatchEvent(new MouseEvent('click'));
     }
     isFileTypeAccepted(fileType) {
         if (!this.accept || this.accept === '') {
@@ -15964,8 +16209,8 @@ class AngularShapeView extends NodeView {
         return container;
     }
     getNgArguments() {
-        const input = this.cell.data?.ngArguments || {};
-        return input;
+        const cell = this.cell;
+        return cell.data?.ngArguments ?? {};
     }
     setInstanceInput(content, ref) {
         const ngArguments = this.getNgArguments();
@@ -16415,7 +16660,7 @@ class WorksheetExporter extends FileExporter {
     }
     async createContent(rows, options) {
         const workSheet = (await import('xlsx')).utils.json_to_sheet(rows, {
-            skipHeader: true // we don't want to see object properties as our headers
+            skipHeader: true
         });
         return await this.workSheetToContent(workSheet, options);
     }
@@ -16775,7 +17020,7 @@ class CmatDigitOnlyDirective {
     }
     onInputChange(event) {
         const reg = /^-?(0|[1-9][0-9]*)(\.[0-9]*)?$/;
-        const value = event.target.value;
+        const value = event.target?.value ?? '';
         if ((!isNaN(+value) && reg.test(value)) || value === '' || value === '-') {
             this.value = value;
         }
@@ -16841,8 +17086,9 @@ class CmatDigitOnlyDirective {
     onPaste(event) {
         if (this.allowPaste === true) {
             let pastedInput = '';
-            if (window['clipboardData']) {
-                pastedInput = window['clipboardData'].getData('text');
+            const legacyWindow = window;
+            if (legacyWindow.clipboardData) {
+                pastedInput = legacyWindow.clipboardData.getData('text');
             }
             else if (event.clipboardData?.getData) {
                 pastedInput = event.clipboardData.getData('text/plain');
@@ -16881,20 +17127,13 @@ class CmatDigitOnlyDirective {
             !this._getSelection().includes(this.negativeSign)) {
             return;
         }
-        // eslint-disable-next-line @typescript-eslint/no-deprecated
-        const pasted = document.execCommand('insertText', false, sanitizedContent);
-        if (!pasted) {
-            if (this.inputElement.setRangeText) {
-                const { selectionStart: start, selectionEnd: end } = this.inputElement;
-                this.inputElement.setRangeText(sanitizedContent, start ?? 0, end ?? 0, 'end');
-                if (typeof window['InstallTrigger'] !==
-                    'undefined') {
-                    this.inputElement.dispatchEvent(new Event('input', { cancelable: true }));
-                }
-            }
-            else {
-                this._insertAtCursor(this.inputElement, sanitizedContent);
-            }
+        if (this.inputElement.setRangeText) {
+            const { selectionStart: start, selectionEnd: end } = this.inputElement;
+            this.inputElement.setRangeText(sanitizedContent, start ?? 0, end ?? 0, 'end');
+            this.inputElement.dispatchEvent(new Event('input', { cancelable: true }));
+        }
+        else {
+            this._insertAtCursor(this.inputElement, sanitizedContent);
         }
         if (this.decimal) {
             this._hasDecimalPoint =
@@ -17037,7 +17276,7 @@ class CmatMaskDirective {
         this.inputElement = el.nativeElement;
     }
     onInputChange(event) {
-        const value = event.target.value;
+        const value = event.target?.value ?? '';
         if (this.regex.test(value)) {
             this.value = value;
         }
@@ -17172,8 +17411,9 @@ class CmatSeamlessAutoScrollDirective {
         }
     }
     _checkScrollCondition() {
-        this._containerElement = this._viewContainer.element.nativeElement.parentElement?.parentElement;
-        this._contentElement = this._viewContainer.element.nativeElement.parentElement;
+        const hostElement = this._viewContainer.element.nativeElement;
+        this._containerElement = hostElement.parentElement?.parentElement ?? null;
+        this._contentElement = hostElement.parentElement ?? null;
         if (!this._containerElement || !this._contentElement)
             return;
         const containerSize = this.direction === 'up' || this.direction === 'down'
@@ -17301,7 +17541,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 class CmatFindByKeyPipe {
     transform(value, key, source) {
         if (Array.isArray(value)) {
-            return value.map(item => source.find(sourceItem => sourceItem[key] === item));
+            return value.map(item => source.find(sourceItem => sourceItem[key] === item)).filter((item) => !!item);
         }
         return source.find(sourceItem => sourceItem[key] === value);
     }
@@ -17319,18 +17559,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 class CmatGroupByPipe {
     transform(value, field) {
         if (!value) {
-            return value;
+            return [];
         }
         const groupedObj = value.reduce((prev, cur) => {
-            if (!prev[cur[field]]) {
-                prev[cur[field]] = [cur];
+            const rawValue = cur[field];
+            const groupKey = typeof rawValue === 'string' || typeof rawValue === 'number' || typeof rawValue === 'boolean' || typeof rawValue === 'bigint'
+                ? String(rawValue)
+                : '';
+            if (!prev[groupKey]) {
+                prev[groupKey] = [cur];
             }
             else {
-                prev[cur[field]].push(cur);
+                prev[groupKey].push(cur);
             }
             return prev;
         }, {});
-        return Object.keys(groupedObj).map(key => ({ key, value: groupedObj[key] }));
+        return Object.keys(groupedObj).map((key) => ({ key, value: groupedObj[key] }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatGroupByPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: CmatGroupByPipe, isStandalone: true, name: "cmatGroupBy" }); }
@@ -17371,6 +17615,7 @@ class CmatSecurePipe {
         this._sanitizer = inject(DomSanitizer);
         this._urlStateConfigService = inject(CmatUrlStateConfigService$1);
         this._destroyRef = inject(DestroyRef);
+        this._previousObjectUrl = null;
         this._urlStateConfigService.config$
             .pipe(takeUntilDestroyed(this._destroyRef))
             .subscribe((config) => {
@@ -17386,7 +17631,14 @@ class CmatSecurePipe {
                 isStream: false
             }
         })
-            .pipe(map((val) => this._sanitizer.bypassSecurityTrustUrl(URL.createObjectURL(val))));
+            .pipe(map((val) => {
+            if (this._previousObjectUrl) {
+                URL.revokeObjectURL(this._previousObjectUrl);
+            }
+            const objectUrl = URL.createObjectURL(val);
+            this._previousObjectUrl = objectUrl;
+            return this._sanitizer.bypassSecurityTrustUrl(objectUrl);
+        }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatSecurePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: CmatSecurePipe, isStandalone: true, name: "cmatSecure" }); }
@@ -17454,6 +17706,7 @@ class CmatAlertService {
         this._stickyMessages = new Subject();
         this._dialogs = new Subject();
         this._isLoading = new Subject();
+        this._loadingMessageId = null;
     }
     get dialogEvent$() {
         return this._dialogs.asObservable();
@@ -17528,8 +17781,9 @@ class CmatAlertService {
                 if (this.isApiResult(error)) {
                     separatorOrDetail += error.msg;
                 }
+                const serializedError = CmatUtilsService$1.safeStringify(error);
                 const msg = `Message.Severity: "${CmatMessageSeverity[severity]}", Message.Summary: "${data}", 
-                Message.Detail: "${separatorOrDetail}", Message.Error: "${CmatUtilsService$1.safeStringify(error)}"`;
+                Message.Detail: "${separatorOrDetail}", Message.Error: "${serializedError}"`;
                 switch (severity) {
                     case CmatMessageSeverity.info:
                         this.logInfo(msg);
@@ -17553,14 +17807,14 @@ class CmatAlertService {
     }
     startLoadingMessage(message = '载入中...', caption = '') {
         this._isLoading.next(true);
-        clearTimeout(this._loadingMessageId);
+        this._clearLoadingMessageTimer();
         this._loadingMessageId = setTimeout(() => {
             this.showStickyMessage(caption, message, CmatMessageSeverity.wait);
         }, 1000);
     }
     stopLoadingMessage() {
         this._isLoading.next(false);
-        clearTimeout(this._loadingMessageId);
+        this._clearLoadingMessageTimer();
         this.resetStickyMessage();
     }
     logDebug(msg) {
@@ -17593,10 +17847,17 @@ class CmatAlertService {
         }
     }
     isApiResult(obj) {
-        return (obj &&
-            typeof obj.success === 'boolean' &&
-            typeof obj.msg === 'string' &&
-            typeof obj.type === 'number');
+        const result = obj;
+        return typeof result === 'object' && result !== null
+            && typeof result.success === 'boolean'
+            && typeof result.msg === 'string'
+            && typeof result.type === 'number';
+    }
+    _clearLoadingMessageTimer() {
+        if (this._loadingMessageId !== null) {
+            clearTimeout(this._loadingMessageId);
+            this._loadingMessageId = null;
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatAlertService, providedIn: 'root' }); }
@@ -17917,13 +18178,13 @@ class CmatExportAsService {
     _getCSV(config) {
         return new Observable((observer) => {
             const element = document.getElementById(config.elementIdOrContent);
-            let csv = [];
+            const csv = [];
             const rows = element?.querySelectorAll('table tr');
-            rows.forEach((rowElement) => {
-                let row = [];
+            rows?.forEach((rowElement) => {
+                const row = [];
                 const cols = rowElement.querySelectorAll('td, th');
-                cols.array.forEach((col) => {
-                    row.push('"' + col.innerText + '"');
+                Array.from(cols).forEach((col) => {
+                    row.push('"' + (col.textContent ?? col.innerText) + '"');
                 });
                 csv.push(row.join(','));
             });
@@ -17966,17 +18227,17 @@ class CmatExportAsService {
     }
     _getJSON(config) {
         return new Observable((observer) => {
-            const data = []; // first row needs fto be headers
+            const data = [];
             const headers = [];
             const table = document.getElementById(config.elementIdOrContent);
             for (let index = 0; index < table.rows[0].cells.length; index++) {
-                headers[index] = table.rows[0].cells[index].innerHTML.toLowerCase().replace(/ /gi, '');
+                headers[index] = (table.rows[0].cells[index].textContent ?? '').toLowerCase().replace(/ /gi, '');
             }
             for (let i = 1; i < table.rows.length; i++) {
                 const tableRow = table.rows[i];
-                let rowData = {};
+                const rowData = {};
                 for (let j = 0; j < tableRow.cells.length; j++) {
-                    rowData[headers[j]] = tableRow.cells[j].innerHTML;
+                    rowData[headers[j]] = tableRow.cells[j].textContent ?? '';
                 }
                 data.push(rowData);
             }
@@ -18021,7 +18282,8 @@ class CmatExportAsService {
         });
     }
     _btoa(content) {
-        return Buffer.from(content.toString(), 'utf-8').toString('base64');
+        // eslint-disable-next-line @typescript-eslint/no-deprecated
+        return btoa(unescape(encodeURIComponent(content)));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatExportAsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatExportAsService, providedIn: 'root' }); }
@@ -18136,14 +18398,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         }] });
 
 class CmatLocalStorageService {
-    getItem(key) {
-        return localStorage.getItem(key);
+    constructor() {
+        this._encryptionPrefix = '__enc__';
+    }
+    getItem(key, options) {
+        const raw = localStorage.getItem(key);
+        if (raw === null) {
+            return null;
+        }
+        let entry;
+        try {
+            entry = JSON.parse(raw);
+        }
+        catch {
+            return raw;
+        }
+        if (entry.expiry && Date.now() > entry.expiry) {
+            this.removeItem(key);
+            return null;
+        }
+        let data = entry.data ?? raw;
+        if (options?.encrypt || key.startsWith(this._encryptionPrefix)) {
+            data = this._decrypt(data);
+        }
+        return data;
     }
-    setItem(key, item) {
-        localStorage.setItem(key, item);
+    setItem(key, item, options) {
+        let data = item;
+        const storageKey = options?.encrypt ? this._encryptionPrefix + key : key;
+        if (options?.encrypt) {
+            data = this._encrypt(item);
+        }
+        const entry = {
+            data,
+            ...(options?.ttl ? { expiry: Date.now() + options.ttl } : {})
+        };
+        localStorage.setItem(storageKey, JSON.stringify(entry));
     }
     removeItem(key) {
         localStorage.removeItem(key);
+        localStorage.removeItem(this._encryptionPrefix + key);
+    }
+    _encrypt(value) {
+        return btoa(encodeURIComponent(value));
+    }
+    _decrypt(value) {
+        return decodeURIComponent(atob(value));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatLocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CmatLocalStorageService, providedIn: 'root' }); }
@@ -18274,11 +18574,11 @@ class CmatTitleService {
             return route;
         }), mergeMap(route => route.data))
             .subscribe((data) => {
-            let title = data['title'];
+            let title = typeof data['title'] === 'string' ? data['title'] : '';
             if (title) {
                 const fragment = this._router.url.split('#')[1];
                 if (fragment) {
-                    title += ' | ' + CmatUtilsService$1.toTitleCase(fragment);
+                    title += ` | ${CmatUtilsService$1.toTitleCase(fragment)}`;
                 }
             }
             if (title) {
@@ -18354,14 +18654,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+const CMAT_CRYPTO_CONFIG = new InjectionToken('CMAT_CRYPTO_CONFIG', {
+    factory: () => ({
+        key: '14789632236987411478963223698741',
+        iv: '1478963223698741',
+        specialParam: 'partymanageApi'
+    })
+});
+function initializeCmatUtilsConfig(config) {
+    CmatUtilsService.setCryptoConfig(config);
+}
 class CmatUtilsService {
     static { this.captionAndMessageSeparator = ':'; }
     static { this.noNetworkMessageCaption = '无网络'; }
     static { this.noNetworkMessageDetail = '无法连接服务器'; }
     static { this.accessDeniedMessageCaption = '拒绝访问!'; }
     static { this.accessDeniedMessageDetail = ''; }
-    static { this.key = UTF8.parse('14789632236987411478963223698741'); } // 32位
-    static { this.iv = UTF8.parse('1478963223698741'); } // 16位
+    static { this._key = null; }
+    static { this._iv = null; }
+    static { this._specialParam = null; }
+    static get key() {
+        return this._key;
+    }
+    static get iv() {
+        return this._iv;
+    }
+    static get specialParam() {
+        return this._specialParam;
+    }
     get exactMatchOptions() {
         return {
             paths: 'exact',
@@ -18378,16 +18698,19 @@ class CmatUtilsService {
             queryParams: 'subset'
         };
     }
+    static setCryptoConfig(config) {
+        this._key = UTF8.parse(config.key);
+        this._iv = UTF8.parse(config.iv);
+        this._specialParam = UTF8.parse(config.specialParam);
+    }
     static getRequestHeaders() {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Content-Type', 'application/json')
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
             .append('App-Version', CMAT_VERSION);
     }
     static getRequestIdempotentHeaders() {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Content-Type', 'application/json')
             .append('X-Request-ID', CmatUtilsService.newGuid())
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
@@ -18395,7 +18718,6 @@ class CmatUtilsService {
     }
     static getRequestBypassHeaders() {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Content-Type', 'application/json')
             .append('bypass', 'true')
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
@@ -18403,7 +18725,6 @@ class CmatUtilsService {
     }
     static getRequestIdempotentBypassHeaders() {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Content-Type', 'application/json')
             .append('X-Request-ID', CmatUtilsService.newGuid())
             .append('bypass', 'true')
@@ -18412,34 +18733,30 @@ class CmatUtilsService {
     }
     static getRequestCryptoHeaders(params) {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
-            .append('App-Version', this.getEncryptData('partymanageApi' + params).toString());
+            .append('App-Version', this.getEncryptData(params).toString());
     }
     static getRequestCryptoBypassHeaders(params) {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
             .append('bypass', 'true')
-            .append('App-Version', this.getEncryptData('partymanageApi' + params).toString());
+            .append('App-Version', this.getEncryptData(params).toString());
     }
     static getRequestCryptoIdempotentHeaders(params) {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('X-Request-ID', CmatUtilsService.newGuid())
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
-            .append('App-Version', this.getEncryptData('partymanageApi' + params).toString());
+            .append('App-Version', this.getEncryptData(params).toString());
     }
     static getRequestCryptoIdempotentBypassHeaders(params) {
         return new HttpHeaders()
-            .append('Access-Control-Allow-Origin', '*')
             .append('X-Request-ID', CmatUtilsService.newGuid())
             .append('Accept', `application/vnd.iman.v${CMAT_VERSION}+json, application/json, text/plain, */*`)
             .append('bypass', 'true')
-            .append('App-Version', this.getEncryptData('partymanageApi' + params).toString());
+            .append('App-Version', this.getEncryptData(params).toString());
     }
     static getEncryptData(data) {
-        const src = UTF8.parse(data);
+        const src = UTF8.parse(this.specialParam.toString() + data);
         return AES.encrypt(src, this.key, {
             iv: this.iv,
             mode: CryptoJSCore.mode.CBC,
@@ -18455,14 +18772,17 @@ class CmatUtilsService {
         }).toString(UTF8).toString();
     }
     static handleError(error) {
-        if (error.error instanceof ErrorEvent) {
+        if (error instanceof ErrorEvent) {
             console.error('Client side network error occurred:', error.message);
         }
-        else {
+        else if (typeof error === 'object' && error !== null && 'status' in error) {
+            const httpError = error;
             console.error('Backend - ' +
-                `status: ${error.status}, ` +
-                `statusText: ${error.statusText}, ` +
-                `message: ${error.error}`);
+                `status: ${String(httpError.status)}, ` +
+                `message: ${String(httpError.error)}`);
+        }
+        else {
+            console.error('Unknown error occurred:', String(error));
         }
         return throwError(() => error ?? 'server error');
     }
@@ -18474,27 +18794,35 @@ class CmatUtilsService {
             }
             else {
                 const responseObject = this.getResponseBody(data);
-                if (responseObject && (typeof responseObject === 'object' || responseObject instanceof Object)) {
+                if (responseObject && typeof responseObject === 'object') {
                     for (const key in responseObject) {
                         if (Object.prototype.hasOwnProperty.call(responseObject, key)) {
+                            const value = responseObject[key];
+                            const stringValue = typeof value === 'object' && value !== null ? JSON.stringify(value) : String(value);
                             if (key) {
-                                responses.push(`${key}${this.captionAndMessageSeparator} ${responseObject[key]}`);
+                                responses.push(`${key}${this.captionAndMessageSeparator} ${stringValue}`);
                             }
-                            else if (responseObject[key]) {
-                                responses.push(responseObject[key].toString());
+                            else if (value) {
+                                responses.push(stringValue);
                             }
                         }
                     }
                 }
             }
-            if (!responses.length && this.getResponseBody(data)) {
-                responses.push(`${this.getResponseBody(data).toString()}`);
+            const responseBody = this.getResponseBody(data);
+            if (!responses.length && responseBody != null) {
+                if (typeof responseBody === 'object') {
+                    responses.push(JSON.stringify(responseBody));
+                }
+                else {
+                    responses.push(String(responseBody));
+                }
             }
         }
         if (!responses.length) {
-            responses.push(data.toString());
+            responses.push(typeof data === 'object' ? JSON.stringify(data) : String(data));
         }
-        if (this.checkAccessDenied(data)) {
+        if (data instanceof HttpResponseBase && this.checkAccessDenied(data)) {
             responses.splice(0, 0, `${this.accessDeniedMessageCaption}${this.captionAndMessageSeparator} ${this.accessDeniedMessageDetail}`);
         }
         return responses;
@@ -18530,7 +18858,7 @@ class CmatUtilsService {
         if (response instanceof HttpErrorResponse) {
             return response.error ?? response.message;
         }
-        return response;
+        return null;
     }
     static checkNoNetwork(response) {
         if (response instanceof HttpResponseBase) {
@@ -18569,7 +18897,7 @@ class CmatUtilsService {
         return params;
     }
     static splitInTwo(text, separator) {
-        const separatorIndex = separator ? text.indexOf(separator) : -1;
+        const separatorIndex = separator && text.includes(separator) ? text.indexOf(separator) : -1;
         if (separatorIndex === -1) {
             return { firstPart: text, secondPart: null };
         }
@@ -18589,13 +18917,14 @@ class CmatUtilsService {
             if (!Object.prototype.hasOwnProperty.call(object, prop)) {
                 continue;
             }
-            if (typeof (object[prop]) == 'object') {
+            const value = object[prop];
+            if (typeof value === 'object') {
                 continue;
             }
-            if (typeof (object[prop]) == 'function') {
+            if (typeof value === 'function') {
                 continue;
             }
-            simpleObject[prop] = object[prop];
+            simpleObject[prop] = value;
         }
         result = '[***Sanitized Object***]: ' + JSON.stringify(simpleObject);
         return result;
@@ -18620,17 +18949,14 @@ class CmatUtilsService {
         }
     }
     static toTitleCase(text) {
-        return text.replace(/\w\S*/g, subString => subString.charAt(0).toUpperCase() + subString.substring(1).toLowerCase());
+        return text.replace(/\w\S*/g, (subString) => subString.charAt(0).toUpperCase() + subString.substring(1).toLowerCase());
     }
     static toLowerCase(items) {
         if (items instanceof Array) {
-            const loweredRoles = [];
-            for (let i = 0; i < items.length; i++) {
-                loweredRoles[i] = items[i].toLowerCase();
-            }
+            const loweredRoles = items.map((item) => item.toLowerCase());
             return loweredRoles;
         }
-        else if (typeof items === 'string' || items instanceof String) {
+        else if (typeof items === 'string') {
             return items.toLowerCase();
         }
         return void 0;
@@ -18652,11 +18978,7 @@ class CmatUtilsService {
         return base.replace(/\/$/, '');
     }
     static newGuid() {
-        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
-            const r = (Math.random() * 16) | 0;
-            const v = c === 'x' ? r : (r & 0x3) | 0x8;
-            return v.toString(16);
-        });
+        return crypto.randomUUID();
     }
     static testIsAbsoluteUrl(url) {
         const r = new RegExp('^(?:[a-z]+:)?//', 'i');
@@ -18698,8 +19020,8 @@ class CmatUtilsService {
         if (!Object.prototype.hasOwnProperty.call(decoded, 'exp')) {
             return null;
         }
-        const date = new Date(0); // The 0 here is the key, which sets the date to the epoch
-        date.setUTCSeconds(decoded.exp);
+        const date = new Date(0);
+        date.setUTCSeconds(Number(decoded.exp));
         return date;
     }
     static isTokenExpired(token, offsetSeconds) {
@@ -18716,9 +19038,8 @@ class CmatUtilsService {
             reader.onload = () => {
                 resolve(reader.result);
             };
-            reader.onerror = (e) => {
-                // eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors
-                reject(e);
+            reader.onerror = () => {
+                reject(new Error('Failed to read file as Data URL'));
             };
             reader.readAsDataURL(file);
         });
@@ -18728,8 +19049,8 @@ class CmatUtilsService {
         const byteString = splitDataURI[0].includes('base64') ? atob(splitDataURI[1]) : decodeURI(splitDataURI[1]);
         const mimeString = splitDataURI[0].split(':')[1].split(';')[0];
         const ia = new Uint8Array(byteString.length);
-        for (let i = 0; i < byteString.length; i++) {
-            ia[i] = byteString.charCodeAt(i);
+        for (const [i, char] of [...byteString].entries()) {
+            ia[i] = char.charCodeAt(0);
         }
         return new Blob([ia], { type: mimeString });
     }
@@ -18755,7 +19076,7 @@ class CmatUtilsService {
                 break;
             case 'application/vnd.ms-excel':
             case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
-                fileType = 'word';
+                fileType = 'excel';
                 break;
             case 'application/pdf':
                 fileType = 'pdf';
@@ -18772,7 +19093,7 @@ class CmatUtilsService {
             case 'audio/mp4':
                 fileType = 'video';
                 break;
-            case 'aplication/zip':
+            case 'application/zip':
                 fileType = 'zip';
                 break;
         }
@@ -18800,14 +19121,14 @@ class CmatUtilsService {
                 const lastPart = parts.pop();
                 let currentValue = jsonObject;
                 parts.forEach((part) => {
-                    if (Object.prototype.hasOwnProperty.call(currentValue, part)) {
+                    if (typeof currentValue === 'object' && currentValue !== null && Object.prototype.hasOwnProperty.call(currentValue, part)) {
                         currentValue = currentValue[part];
                     }
                     else {
                         currentValue = undefined;
                     }
                 });
-                result[info.code] = currentValue ? (Object.prototype.hasOwnProperty.call(currentValue, lastPart) ? currentValue[lastPart] : '') : '';
+                result[info.code] = currentValue && typeof currentValue === 'object' && Object.prototype.hasOwnProperty.call(currentValue, lastPart) ? currentValue[lastPart] : '';
             });
             return result;
         });
@@ -18837,5 +19158,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AngularShape, AngularShapeView, CLOCK_INNER_RADIUS, CLOCK_OUTER_RADIUS, CLOCK_RADIUS, CLOCK_TICK_RADIUS, CMAT_APP_CONFIG, CMAT_DATETIMEPICKER_SCROLL_STRATEGY, CMAT_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY, CMAT_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER, CMAT_DATETIMEPICKER_VALIDATORS, CMAT_DATETIMEPICKER_VALUE_ACCESSOR, CMAT_DATETIME_FORMATS, CMAT_DAYJS_DATETIME_FORMATS, CMAT_DAYJS_DATE_ADAPTER_OPTIONS, CMAT_DAYJS_DATE_ADAPTER_OPTIONS_FACTORY, CMAT_DAYJS_DATE_FORMATS, CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR, CMAT_NATIVE_DATETIME_FORMATS, CNativeDatetimeAdapter, ChartNode, CmatAddonsWrapperComponent, CmatAlertDialog, CmatAlertMessage, CmatAlertService, CmatAnimationOnScrollDirective, CmatArrowCursorDirective, CmatAutofocusDirective, CmatBreadcrumbComponent, CmatBreadcrumbItemDirective, CmatBreadcrumbService, CmatButtonTypeComponent, CmatBytesPipe, CmatCardComponent, CmatCardWrapperComponent, CmatCarouselComponent, CmatCarouselFooterComponent, CmatCarouselHeaderComponent, CmatCarouselTemplateDirective, CmatCascadeBottomSheetComponent, CmatCascadeListComponent, CmatCascadeTypeComponent, CmatCheckListTypeComponent, CmatChipInputComponent, CmatChipsInputTypeComponent, CmatCodeEditorComponent, CmatColorPickerTypeComponent, CmatConfigService, CmatConfirmationService, CmatDataExporterDirective, CmatDataService, CmatDateFormatPipe, CmatDateRangeComponent, CmatDateRangeTypeComponent, CmatDateTimeDisplayComponent, CmatDatepickerTypeComponent, CmatDatetimepickerCalendarBodyComponent, CmatDatetimepickerCalendarCellComponent, CmatDatetimepickerCalendarComponent, CmatDatetimepickerClockComponent, CmatDatetimepickerComponent, CmatDatetimepickerContentComponent, CmatDatetimepickerFilterType, CmatDatetimepickerInputDirective, CmatDatetimepickerInputEvent, CmatDatetimepickerMonthViewComponent, CmatDatetimepickerToggleComponent, CmatDatetimepickerToggleIconDirective, CmatDatetimepickerYearViewComponent, CmatDebounceClickDirective, CmatDebounceKeyupDirective, CmatDialogType, CmatDigitOnlyDirective, CmatDrawerComponent, CmatDrawerService, CmatEmptyStateComponent, CmatEqualValidatorDirective, CmatExpansionWrapperComponent, CmatExportAsService, CmatFilePreviewComponent, CmatFilesUtilService, CmatFilterToolbarComponent, CmatFindByKeyPipe, CmatFormActionsComponent, CmatFormFieldWrapperComponent, CmatFullscreenComponent, CmatGroupByPipe, CmatHighlightComponent, CmatHighlightService, CmatHorizontalNavigationComponent, CmatImageComponent, CmatInlineLoadingComponent, CmatJsonEditorComponent, CmatKeysPipe, CmatKnobInputComponent, CmatKnobTypeComponent, CmatLoadingInterceptor, CmatLoadingService, CmatLocalStorageService, CmatMaskDirective, CmatMasonryComponent, CmatMaterialColorPickerComponent, CmatMediaWatcherService, CmatMessageSeverity, CmatMultiCheckboxTypeComponent, CmatNavigationItem, CmatNavigationService, CmatNumberTypeComponent, CmatOrgChartComponent, CmatOtpInputComponent, CmatPageHeaderComponent, CmatPaginatePipe, CmatPaginationComponent, CmatPaginationDirective, CmatPaginationService, CmatPanelWrapperComponent, CmatPassToggleVisibilityComponent, CmatPasswordStrengthComponent, CmatPasswordStrengthInfoComponent, CmatPlatformService, CmatPopoverComponent, CmatPopoverTargetDirective, CmatPopoverTriggerDirective, CmatProgressBarComponent, CmatQRCodeComponent, CmatQuillTypeComponent, CmatRadioTypeComponent, CmatRatingComponent, CmatRatingTypeComponent, CmatRepeatTypeComponent, CmatRichTextEditorComponent, CmatSeamlessAutoScrollDirective, CmatSecurePipe, CmatSelectSearchComponent, CmatSelectTableComponent, CmatSelectTableTypeComponent, CmatSelectTreeComponent, CmatSelectTreeFlatNode, CmatSelectTreeNode, CmatSelectTreeTypeComponent, CmatSelectTypeComponent, CmatSelectedColor, CmatSliderTypeComponent, CmatSpeedDialActionsComponent, CmatSpeedDialComponent, CmatSpeedDialTriggerComponent, CmatSplashScreenService, CmatStatusTagComponent, CmatStepperHorizontalTypeComponent, CmatStepperVerticalTypeComponent, CmatTabTypeComponent, CmatTableToolbarComponent, CmatTableTypeComponent, CmatTagsTypeComponent, CmatTextareaTypeComponent, CmatTimelineComponent, CmatTimelineItemComponent, CmatTimelineItemIconDirective, CmatTimelineItemLabelDirective, CmatTitleService, CmatToastComponent, CmatToastModalComponent, CmatToastService, CmatTransferFilterCondition, CmatTransferItemFlatNode, CmatTransferItemNode, CmatTransferPickerComponent, CmatTransferPickerFilterComponent, CmatTransferPickerSearchComponent, CmatTransferPickerService, CmatTransferPickerSourceComponent, CmatTransferPickerTargetComponent, CmatTranslationService, CmatTreeTableColumnDirective, CmatTreeTableComponent, CmatTreeTableNode, CmatUploadComponent, CmatUploadQueueComponent, CmatUploadTypeComponent, CmatUppercasePipe, CmatUrlStateConfigService, CmatUtilsService, CmatVerticalNavigationComponent, DatetimeAdapter, DayjsDateAdapter, DayjsDatetimeAdapter, ExportType, MAT_SELECTSEARCH_DEFAULT_OPTIONS, addonsExtension, configurableDefaultOptions, register, registerInfo };
+export { AngularShape, AngularShapeView, CLOCK_INNER_RADIUS, CLOCK_OUTER_RADIUS, CLOCK_RADIUS, CLOCK_TICK_RADIUS, CMAT_APP_CONFIG, CMAT_CRYPTO_CONFIG, CMAT_DATETIMEPICKER_SCROLL_STRATEGY, CMAT_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY, CMAT_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER, CMAT_DATETIMEPICKER_VALIDATORS, CMAT_DATETIMEPICKER_VALUE_ACCESSOR, CMAT_DATETIME_FORMATS, CMAT_DAYJS_DATETIME_FORMATS, CMAT_DAYJS_DATE_ADAPTER_OPTIONS, CMAT_DAYJS_DATE_ADAPTER_OPTIONS_FACTORY, CMAT_DAYJS_DATE_FORMATS, CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR, CMAT_NATIVE_DATETIME_FORMATS, CNativeDatetimeAdapter, ChartNode, CmatAddonsWrapperComponent, CmatAlertDialog, CmatAlertMessage, CmatAlertService, CmatAnimationOnScrollDirective, CmatArrowCursorDirective, CmatAutofocusDirective, CmatBreadcrumbComponent, CmatBreadcrumbItemDirective, CmatBreadcrumbService, CmatButtonTypeComponent, CmatBytesPipe, CmatCardComponent, CmatCardWrapperComponent, CmatCarouselComponent, CmatCarouselFooterComponent, CmatCarouselHeaderComponent, CmatCarouselTemplateDirective, CmatCascadeBottomSheetComponent, CmatCascadeListComponent, CmatCascadeTypeComponent, CmatCheckListTypeComponent, CmatChipInputComponent, CmatChipsInputTypeComponent, CmatCodeEditorComponent, CmatColorPickerTypeComponent, CmatConfigService, CmatConfirmationService, CmatDataExporterDirective, CmatDataService, CmatDateFormatPipe, CmatDateRangeComponent, CmatDateRangeTypeComponent, CmatDateTimeDisplayComponent, CmatDatepickerTypeComponent, CmatDatetimepickerCalendarBodyComponent, CmatDatetimepickerCalendarCellComponent, CmatDatetimepickerCalendarComponent, CmatDatetimepickerClockComponent, CmatDatetimepickerComponent, CmatDatetimepickerContentComponent, CmatDatetimepickerFilterType, CmatDatetimepickerInputDirective, CmatDatetimepickerInputEvent, CmatDatetimepickerMonthViewComponent, CmatDatetimepickerToggleComponent, CmatDatetimepickerToggleIconDirective, CmatDatetimepickerYearViewComponent, CmatDebounceClickDirective, CmatDebounceKeyupDirective, CmatDialogType, CmatDigitOnlyDirective, CmatDrawerComponent, CmatDrawerService, CmatEmptyStateComponent, CmatEqualValidatorDirective, CmatExpansionWrapperComponent, CmatExportAsService, CmatFilePreviewComponent, CmatFilesUtilService, CmatFilterToolbarComponent, CmatFindByKeyPipe, CmatFormActionsComponent, CmatFormFieldWrapperComponent, CmatFullscreenComponent, CmatGroupByPipe, CmatHighlightComponent, CmatHighlightService, CmatHorizontalNavigationComponent, CmatImageComponent, CmatInlineLoadingComponent, CmatJsonEditorComponent, CmatKeysPipe, CmatKnobInputComponent, CmatKnobTypeComponent, CmatLoadingInterceptor, CmatLoadingService, CmatLocalStorageService, CmatMaskDirective, CmatMasonryComponent, CmatMaterialColorPickerComponent, CmatMediaWatcherService, CmatMessageSeverity, CmatMultiCheckboxTypeComponent, CmatNavigationItem, CmatNavigationService, CmatNumberTypeComponent, CmatOrgChartComponent, CmatOtpInputComponent, CmatPageHeaderComponent, CmatPaginatePipe, CmatPaginationComponent, CmatPaginationDirective, CmatPaginationService, CmatPanelWrapperComponent, CmatPassToggleVisibilityComponent, CmatPasswordStrengthComponent, CmatPasswordStrengthInfoComponent, CmatPlatformService, CmatPopoverComponent, CmatPopoverTargetDirective, CmatPopoverTriggerDirective, CmatProgressBarComponent, CmatQRCodeComponent, CmatQuillTypeComponent, CmatRadioTypeComponent, CmatRatingComponent, CmatRatingTypeComponent, CmatRepeatTypeComponent, CmatRichTextEditorComponent, CmatSeamlessAutoScrollDirective, CmatSecurePipe, CmatSelectSearchComponent, CmatSelectTableComponent, CmatSelectTableTypeComponent, CmatSelectTreeComponent, CmatSelectTreeFlatNode, CmatSelectTreeNode, CmatSelectTreeTypeComponent, CmatSelectTypeComponent, CmatSelectedColor, CmatSliderTypeComponent, CmatSpeedDialActionsComponent, CmatSpeedDialComponent, CmatSpeedDialTriggerComponent, CmatSplashScreenService, CmatStatusTagComponent, CmatStepperHorizontalTypeComponent, CmatStepperVerticalTypeComponent, CmatTabTypeComponent, CmatTableToolbarComponent, CmatTableTypeComponent, CmatTagsTypeComponent, CmatTextareaTypeComponent, CmatTimelineComponent, CmatTimelineItemComponent, CmatTimelineItemIconDirective, CmatTimelineItemLabelDirective, CmatTitleService, CmatToastComponent, CmatToastModalComponent, CmatToastService, CmatTransferFilterCondition, CmatTransferItemFlatNode, CmatTransferItemNode, CmatTransferPickerComponent, CmatTransferPickerFilterComponent, CmatTransferPickerSearchComponent, CmatTransferPickerService, CmatTransferPickerSourceComponent, CmatTransferPickerTargetComponent, CmatTranslationService, CmatTreeTableColumnDirective, CmatTreeTableComponent, CmatTreeTableNode, CmatUploadComponent, CmatUploadQueueComponent, CmatUploadTypeComponent, CmatUppercasePipe, CmatUrlStateConfigService, CmatUtilsService, CmatVerticalNavigationComponent, DatetimeAdapter, DayjsDateAdapter, DayjsDatetimeAdapter, ExportType, MAT_SELECTSEARCH_DEFAULT_OPTIONS, addonsExtension, configurableDefaultOptions, initializeCmatUtilsConfig, register, registerInfo };
 //# sourceMappingURL=cmat.mjs.map