cmat 0.0.88 → 0.0.90

package/fesm2022/cmat-components-data-picker.mjs

@@ -371,10 +371,10 @@ class CmatDataPickerListComponent {
         const keys = new Set(this.selectedItems().keys());
         this.selectionChange.emit(keys);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: CmatDataPickerListComponent, isStandalone: true, selector: "cmat-data-picker-list", inputs: { dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, paginationId: { classPropertyName: "paginationId", publicName: "paginationId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\">\r\n  <!-- \u641C\u7D22\u6846 -->\r\n  @if (searchable()) {\r\n  <div class=\"px-4 py-3 border-b\">\r\n    <mat-form-field class=\"w-full\">\r\n      <mat-icon matPrefix [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n      <input matInput [formControl]=\"searchControl\" [placeholder]=\"searchPlaceholder()\" />\r\n    </mat-form-field>\r\n  </div>\r\n  }\r\n\r\n  <!-- \u6570\u636E\u8868\u683C -->\r\n  <div class=\"flex-1 overflow-y-auto scrollbar-custom\">\r\n    @if (loading()) {\r\n    <div class=\"flex items-center justify-center h-full min-h-30\">\r\n      <mat-progress-spinner mode=\"indeterminate\" diameter=\"40\"></mat-progress-spinner>\r\n    </div>\r\n    } @else if (items().length === 0) {\r\n    <div class=\"flex flex-col items-center justify-center h-full py-8\">\r\n      <mat-icon class=\"icon-size-16 text-hint\" [svgIcon]=\"'heroicons_outline:inbox'\"></mat-icon>\r\n      <p class=\"mt-2 text-secondary\">{{ emptyText() }}</p>\r\n    </div>\r\n    } @else {\r\n    <table mat-table matSort class=\"w-full\"\r\n      [dataSource]=\"items() | paginate: {id:paginationId(),currentPage: pagination().currentPage, itemsPerPage: pagination().itemsPerPage, totalItems: pagination().totalItems}\"\r\n      (matSortChange)=\"onSortChange($event)\">\r\n\r\n      <!-- \u9009\u62E9\u5217 -->\r\n      <ng-container matColumnDef=\"_selection\">\r\n        <th *matHeaderCellDef mat-header-cell class=\"w-12\">\r\n          @if (multiple()) {\r\n          <mat-checkbox [checked]=\"isAllSelected()\" [indeterminate]=\"isIndeterminate()\"\r\n            (change)=\"toggleSelectAll($event.checked)\">\r\n          </mat-checkbox>\r\n          }\r\n        </th>\r\n        <td *matCellDef=\"let item\" mat-cell class=\"w-12\">\r\n          @if (multiple()) {\r\n          <mat-checkbox [checked]=\"isSelected(item)\" (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleSelection(item, $event.checked)\">\r\n          </mat-checkbox>\r\n          } @else {\r\n          <mat-radio-button [checked]=\"isSelected(item)\" (click)=\"$event.stopPropagation()\"\r\n            (change)=\"selectSingle(item)\">\r\n          </mat-radio-button>\r\n          }\r\n        </td>\r\n      </ng-container>\r\n\r\n      <!-- \u6570\u636E\u5217 -->\r\n      @for (column of columns(); track column.key) {\r\n      <ng-container [matColumnDef]=\"column.key\">\r\n        <th *matHeaderCellDef mat-header-cell \r\n          [mat-sort-header]=\"column.sortable ? column.key : ''\"\r\n          [disabled]=\"!column.sortable\"\r\n          [start]=\"column.sortable ? 'asc' : ''\">\r\n          {{ column.name }}\r\n        </th>\r\n        <td *matCellDef=\"let item\" mat-cell>\r\n          <div class=\"has-label-on-mobile\" [attr.data-label]=\"column.name + ':'\">\r\n            {{ item[column.key] }}\r\n          </div>\r\n        </td>\r\n      </ng-container>\r\n      }\r\n\r\n      <tr *matHeaderRowDef=\"displayedColumns(); sticky: true\" mat-header-row></tr>\r\n      <tr *matRowDef=\"let item; columns: displayedColumns()\" mat-row class=\"cursor-pointer\" (click)=\"onRowClick(item)\">\r\n      </tr>\r\n    </table>\r\n    }\r\n  </div>\r\n\r\n  <!-- \u5206\u9875\u5668 -->\r\n  <div class=\"border-t\">\r\n    <cmat-pagination class=\"bg-slate-50 dark:bg-transparent\" [id]=\"paginationId()\" [initPerPage]=\"pageSize()\"\r\n      [ngClass]=\"{'pointer-events-none': loading()}\" [hidden]=\"pagination().totalItems=== 0\" (pageChange)=\"onPageChange($event)\"\r\n      (perPageCountChange)=\"onPageSizeChange($event)\">\r\n    </cmat-pagination>\r\n  </div>\r\n\r\n</div>", styles: ["cmat-data-picker-list{display:flex;flex-direction:column;width:100%}cmat-data-picker-list .mat-mdc-row{border-width:1px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.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: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i6.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: 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: "ngmodule", type: MatTableModule }, { kind: "component", type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i9.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: CmatPaginationComponent, selector: "cmat-pagination", inputs: ["id", "maxSize", "itemsPerPages", "initPerPage", "autoHide"], outputs: ["pageChange", "pageBoundsCorrection", "perPageCountChange"], exportAs: ["cmatPagination"] }, { kind: "pipe", type: CmatPaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: CmatDataPickerListComponent, isStandalone: true, selector: "cmat-data-picker-list", inputs: { dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, paginationId: { classPropertyName: "paginationId", publicName: "paginationId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\">\r\n  <!-- \u641C\u7D22\u6846 -->\r\n  @if (searchable()) {\r\n  <div class=\"px-4 py-3 border-b\">\r\n    <mat-form-field class=\"w-full\">\r\n      <mat-icon matPrefix [svgIcon]=\"'heroicons_outline:magnifying-glass'\"></mat-icon>\r\n      <input matInput [formControl]=\"searchControl\" [placeholder]=\"searchPlaceholder()\" />\r\n    </mat-form-field>\r\n  </div>\r\n  }\r\n\r\n  <!-- \u6570\u636E\u8868\u683C -->\r\n  <div class=\"flex-1 overflow-y-auto scrollbar-custom\">\r\n    @if (loading()) {\r\n    <div class=\"flex items-center justify-center h-full min-h-30\">\r\n      <mat-progress-spinner mode=\"indeterminate\" diameter=\"40\"></mat-progress-spinner>\r\n    </div>\r\n    } @else if (items().length === 0) {\r\n    <div class=\"flex flex-col items-center justify-center h-full py-8\">\r\n      <mat-icon class=\"icon-size-16 text-hint\" [svgIcon]=\"'heroicons_outline:inbox'\"></mat-icon>\r\n      <p class=\"mt-2 text-secondary\">{{ emptyText() }}</p>\r\n    </div>\r\n    } @else {\r\n    <table mat-table matSort class=\"w-full\"\r\n      [dataSource]=\"items() | paginate: {id:paginationId(),currentPage: pagination().currentPage, itemsPerPage: pagination().itemsPerPage, totalItems: pagination().totalItems}\"\r\n      (matSortChange)=\"onSortChange($event)\">\r\n\r\n      <!-- \u9009\u62E9\u5217 -->\r\n      <ng-container matColumnDef=\"_selection\">\r\n        <th *matHeaderCellDef mat-header-cell class=\"w-12\">\r\n          @if (multiple()) {\r\n          <mat-checkbox [checked]=\"isAllSelected()\" [indeterminate]=\"isIndeterminate()\"\r\n            (change)=\"toggleSelectAll($event.checked)\">\r\n          </mat-checkbox>\r\n          }\r\n        </th>\r\n        <td *matCellDef=\"let item\" mat-cell class=\"w-12\">\r\n          @if (multiple()) {\r\n          <mat-checkbox [checked]=\"isSelected(item)\" (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleSelection(item, $event.checked)\">\r\n          </mat-checkbox>\r\n          } @else {\r\n          <mat-radio-button [checked]=\"isSelected(item)\" (click)=\"$event.stopPropagation()\"\r\n            (change)=\"selectSingle(item)\">\r\n          </mat-radio-button>\r\n          }\r\n        </td>\r\n      </ng-container>\r\n\r\n      <!-- \u6570\u636E\u5217 -->\r\n      @for (column of columns(); track column.key) {\r\n      <ng-container [matColumnDef]=\"column.key\">\r\n        <th *matHeaderCellDef mat-header-cell \r\n          [mat-sort-header]=\"column.sortable ? column.key : ''\"\r\n          [disabled]=\"!column.sortable\"\r\n          [start]=\"column.sortable ? 'asc' : ''\">\r\n          {{ column.name }}\r\n        </th>\r\n        <td *matCellDef=\"let item\" mat-cell>\r\n          <div class=\"has-label-on-mobile\" [attr.data-label]=\"column.name + ':'\">\r\n            {{ item[column.key] }}\r\n          </div>\r\n        </td>\r\n      </ng-container>\r\n      }\r\n\r\n      <tr *matHeaderRowDef=\"displayedColumns(); sticky: true\" mat-header-row></tr>\r\n      <tr *matRowDef=\"let item; columns: displayedColumns()\" mat-row class=\"cursor-pointer\" (click)=\"onRowClick(item)\">\r\n      </tr>\r\n    </table>\r\n    }\r\n  </div>\r\n\r\n  <!-- \u5206\u9875\u5668 -->\r\n  <div class=\"border-t\">\r\n    <cmat-pagination class=\"bg-slate-50 dark:bg-transparent\" [id]=\"paginationId()\" [initPerPage]=\"pageSize()\"\r\n      [ngClass]=\"{'pointer-events-none': loading()}\" [hidden]=\"pagination().totalItems=== 0\" (pageChange)=\"onPageChange($event)\"\r\n      (perPageCountChange)=\"onPageSizeChange($event)\">\r\n    </cmat-pagination>\r\n  </div>\r\n\r\n</div>", styles: ["cmat-data-picker-list{display:flex;flex-direction:column;width:100%}cmat-data-picker-list .mat-mdc-row{border-width:1px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.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: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i6.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: 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: "ngmodule", type: MatTableModule }, { kind: "component", type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i9.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: CmatPaginationComponent, selector: "cmat-pagination", inputs: ["id", "maxSize", "itemsPerPages", "initPerPage", "autoHide"], outputs: ["pageChange", "pageBoundsCorrection", "perPageCountChange"], exportAs: ["cmatPagination"] }, { kind: "pipe", type: CmatPaginatePipe, name: "paginate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-data-picker-list', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         CommonModule,
@@ -397,7 +397,8 @@ class CmatDataPickerSheetComponent {
         this.data = inject(MAT_BOTTOM_SHEET_DATA);
         this.title = computed(() => this.data.multiple ? '选择多项' : '选择一项', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-        this._listComponent = viewChild.required((CmatDataPickerListComponent));
+        this._listComponent = viewChild.required((CmatDataPickerListComponent), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "_listComponent" }] : /* istanbul ignore next */ []));
         this._bottomSheetRef = inject((MatBottomSheetRef));
         this._selectedKeys = new Set();
         // 初始化选中项
@@ -423,10 +424,10 @@ class CmatDataPickerSheetComponent {
         const result = this.data.multiple ? selectedItems : (selectedItems[0] ?? null);
         this._bottomSheetRef.dismiss(result);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.2", type: CmatDataPickerSheetComponent, isStandalone: true, selector: "cmat-data-picker-sheet", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full max-h-[70vh] -mx-4\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-4 py-3 border-b bg-card\">\r\n    <h2 class=\"text-lg font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-4 py-3 border-t flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", styles: [":host{display:block;height:100%}\n"], 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: CmatDataPickerSheetComponent, isStandalone: true, selector: "cmat-data-picker-sheet", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full max-h-[70vh] -mx-4\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-4 py-3 border-b bg-card\">\r\n    <h2 class=\"text-lg font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-4 py-3 border-t flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", styles: [":host{display:block;height:100%}\n"], 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerSheetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerSheetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-data-picker-sheet', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         MatButtonModule,
@@ -440,7 +441,8 @@ class CmatDataPickerDialogComponent {
         this.data = inject(MAT_DIALOG_DATA);
         this.title = computed(() => this.data.multiple ? '选择多项' : '选择一项', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-        this._listComponent = viewChild.required((CmatDataPickerListComponent));
+        this._listComponent = viewChild.required((CmatDataPickerListComponent), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "_listComponent" }] : /* istanbul ignore next */ []));
         this._dialogRef = inject((MatDialogRef));
         this._selectedKeys = new Set();
         // 初始化选中项
@@ -466,10 +468,10 @@ class CmatDataPickerDialogComponent {
         const result = this.data.multiple ? selectedItems : (selectedItems[0] ?? null);
         this._dialogRef.close(result);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.2", type: CmatDataPickerDialogComponent, isStandalone: true, selector: "cmat-data-picker-dialog", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full max-h-[80vh]\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-6 py-4 border-b\">\r\n    <h2 class=\"text-xl font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-6 py-4 border-t flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: CmatDataPickerDialogComponent, isStandalone: true, selector: "cmat-data-picker-dialog", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full max-h-[80vh]\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-6 py-4 border-b\">\r\n    <h2 class=\"text-xl font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-6 py-4 border-t flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-data-picker-dialog', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         MatButtonModule,
@@ -482,7 +484,8 @@ class CmatDataPickerDrawerComponent {
     constructor() {
         this.title = computed(() => this.data?.multiple ? '选择多项' : '选择一项', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-        this._listComponent = viewChild.required((CmatDataPickerListComponent));
+        this._listComponent = viewChild.required((CmatDataPickerListComponent), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "_listComponent" }] : /* istanbul ignore next */ []));
         this._selectedKeys = new Set();
     }
     ngAfterViewInit() {
@@ -513,10 +516,10 @@ class CmatDataPickerDrawerComponent {
             this.data.onClose();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.2", type: CmatDataPickerDrawerComponent, isStandalone: true, selector: "cmat-data-picker-drawer", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-6 py-4 border-b bg-card\">\r\n    <h2 class=\"text-xl font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-6 py-4 border-t bg-card flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", styles: ["cmat-data-picker-drawer{display:block;width:100%}\n"], 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: CmatDataPickerDrawerComponent, isStandalone: true, selector: "cmat-data-picker-drawer", viewQueries: [{ propertyName: "_listComponent", first: true, predicate: (CmatDataPickerListComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col h-full\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div class=\"flex items-center justify-between px-6 py-4 border-b bg-card\">\r\n    <h2 class=\"text-xl font-semibold\">{{ title() }}</h2>\r\n    <button matIconButton (click)=\"dismiss()\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:x-mark'\"></mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <!-- \u5217\u8868\u5185\u5BB9 -->\r\n  <div class=\"flex-1 overflow-hidden min-h-0 flex\">\r\n    <cmat-data-picker-list [dataProvider]=\"data.dataProvider\" [columns]=\"data.columns\" [keyField]=\"data.keyField\"\r\n      [multiple]=\"data.multiple\" [searchable]=\"data.searchable\" [pageSize]=\"data.pageSize\"\r\n      (selectionChange)=\"onSelectionChange($event)\">\r\n    </cmat-data-picker-list>\r\n  </div>\r\n\r\n  <!-- \u5E95\u90E8\u64CD\u4F5C\u680F -->\r\n  <div class=\"px-6 py-4 border-t bg-card flex justify-end gap-2\">\r\n    <button matButton=\"filled\" color=\"primary\" (click)=\"confirm()\">\r\n      \u786E\u5B9A\r\n    </button>\r\n    <button matButton=\"outlined\" (click)=\"dismiss()\">\u53D6\u6D88</button>\r\n  </div>\r\n</div>", styles: ["cmat-data-picker-drawer{display:block;width:100%}\n"], 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"] }, { 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: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: CmatDataPickerListComponent, selector: "cmat-data-picker-list", inputs: ["dataProvider", "columns", "keyField", "multiple", "searchable", "pageSize", "searchPlaceholder", "emptyText", "paginationId"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerDrawerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerDrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-data-picker-drawer', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         MatButtonModule,
@@ -961,12 +964,12 @@ class CmatDataPickerComponent {
         });
         return result;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CmatDataPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: CmatDataPickerComponent, isStandalone: true, selector: "cmat-data-picker", inputs: { apiUrl: { classPropertyName: "apiUrl", publicName: "apiUrl", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, labelField: { classPropertyName: "labelField", publicName: "labelField", isSignal: true, isRequired: false, transformFunction: null }, displayTemplate: { classPropertyName: "displayTemplate", publicName: "displayTemplate", isSignal: true, isRequired: false, transformFunction: null }, displayLabelFn: { classPropertyName: "displayLabelFn", publicName: "displayLabelFn", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, uiMode: { classPropertyName: "uiMode", publicName: "uiMode", isSignal: true, isRequired: false, transformFunction: null }, drawerPosition: { classPropertyName: "drawerPosition", publicName: "drawerPosition", isSignal: true, isRequired: false, transformFunction: null }, drawerWidth: { classPropertyName: "drawerWidth", publicName: "drawerWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogWidth: { classPropertyName: "dialogWidth", publicName: "dialogWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogMaxHeight: { classPropertyName: "dialogMaxHeight", publicName: "dialogMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, host: { properties: { "attr.id": "id" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: CmatDataPickerComponent, isStandalone: true, selector: "cmat-data-picker", inputs: { apiUrl: { classPropertyName: "apiUrl", publicName: "apiUrl", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, labelField: { classPropertyName: "labelField", publicName: "labelField", isSignal: true, isRequired: false, transformFunction: null }, displayTemplate: { classPropertyName: "displayTemplate", publicName: "displayTemplate", isSignal: true, isRequired: false, transformFunction: null }, displayLabelFn: { classPropertyName: "displayLabelFn", publicName: "displayLabelFn", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, uiMode: { classPropertyName: "uiMode", publicName: "uiMode", isSignal: true, isRequired: false, transformFunction: null }, drawerPosition: { classPropertyName: "drawerPosition", publicName: "drawerPosition", isSignal: true, isRequired: false, transformFunction: null }, drawerWidth: { classPropertyName: "drawerWidth", publicName: "drawerWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogWidth: { classPropertyName: "dialogWidth", publicName: "dialogWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogMaxHeight: { classPropertyName: "dialogMaxHeight", publicName: "dialogMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, host: { properties: { "attr.id": "id" } }, providers: [
             { provide: MatFormFieldControl, useExisting: CmatDataPickerComponent }
         ], ngImport: i0, template: "<div class=\"cmat-data-picker\">\r\n  <!-- \u89E6\u53D1\u5668 -->\r\n  <div class=\"picker-trigger\" tabindex=\"0\" role=\"button\" [class.has-value]=\"hasValue()\" [class.disabled]=\"disabled\"\r\n    (click)=\"openPicker()\" (focus)=\"onFocusIn()\" (blur)=\"onFocusOut()\" (keydown.enter)=\"openPicker()\"\r\n    (keydown.space)=\"$event.preventDefault(); openPicker()\">\r\n\r\n    @if (selectedItems().size > 0) {\r\n    <mat-chip-grid class=\"items-center\">\r\n      @for (item of getSelectedArray(); track item) {\r\n      <mat-chip-row (removed)=\"removeItem(item)\">\r\n        {{ getDisplayLabel(item) }}\r\n        <button matChipRemove class=\"print:hidden\">\r\n          <mat-icon class=\"icon-size-5\" [svgIcon]=\"'mat_solid:cancel'\"></mat-icon>\r\n        </button>\r\n      </mat-chip-row>\r\n      }\r\n    </mat-chip-grid>\r\n    } @else {\r\n    <span class=\"placeholder\">{{appearanceIsFill? placeholder:''}}</span>\r\n    }\r\n\r\n    <mat-icon class=\"trigger-icon\" [svgIcon]=\"'mat_outline:arrow_drop_down'\"></mat-icon>\r\n  </div>\r\n</div>", styles: ["cmat-data-picker{width:100%}.cmat-data-picker{width:100%}.picker-trigger{display:flex;align-items:center;box-sizing:border-box}.picker-trigger .placeholder{color:#0009;line-height:1;display:inline-block}.picker-trigger .trigger-icon{margin-right:-6px}.cmat-data-picker-drawer-overlay{box-shadow:-2px 0 8px #00000026;z-index:2000}.cmat-data-picker-drawer-overlay.cmat-drawer-enter{animation:slideInFromRight .3s ease-out}.cmat-data-picker-drawer-overlay.cmat-drawer-leave{animation:slideOutToRight .3s ease-in forwards}.cmat-data-picker-drawer-overlay[style*=\"left: 0\"]{box-shadow:2px 0 8px #00000026}.cmat-data-picker-drawer-overlay[style*=\"left: 0\"].cmat-drawer-enter{animation:slideInFromLeft .3s ease-out}.cmat-data-picker-drawer-overlay[style*=\"left: 0\"].cmat-drawer-leave{animation:slideOutToLeft .3s ease-in forwards}@keyframes slideInFromRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideInFromLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideOutToRight{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes slideOutToLeft{0%{transform:translate(0)}to{transform:translate(-100%)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.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: "22.0.2", ngImport: i0, type: CmatDataPickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: CmatDataPickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-data-picker', providers: [
                         { provide: MatFormFieldControl, useExisting: CmatDataPickerComponent }