@taon-dev/ui 21.0.20 → 21.0.21

package/VERIFIED-BUILD-DATA.jsonc

@@ -1,5 +1,5 @@
 {
-  "commitHash": "1ac61431a112c3d8fe35d80142597a02704885d4",
-  "commitName": "chore: translations",
-  "commitDate": "29-10-2026 18:31:16"
+  "commitHash": "349a7b6612dee85bdaf4a7b20fa3cf69f116be82",
+  "commitName": "feat: table no records message",
+  "commitDate": "31-10-2026 19:41:08"
 }

package/browser/fesm2022/{ui-browser-taon-datatable.component.ts.de-DE.i18n.data-BPAeMyCY.mjs → ui-browser-taon-datatable.component.ts.de-DE.i18n.data-DOHkRE3t.mjs}

@@ -12,10 +12,14 @@ var taonDatatable_component_ts_deDE_i18n_data = {
             "gettextString": "NAME",
             "lineNumber": 63,
             "translation": "Name"
+        },
+        {
+            "gettextString": "No records found",
+            "lineNumber": 110
         }
     ]
 };
 // THIS FILE IS GENERATED - DO NOT MODIFY
 
 export { taonDatatable_component_ts_deDE_i18n_data as default };
-//# sourceMappingURL=ui-browser-taon-datatable.component.ts.de-DE.i18n.data-BPAeMyCY.mjs.map
+//# sourceMappingURL=ui-browser-taon-datatable.component.ts.de-DE.i18n.data-DOHkRE3t.mjs.map

package/browser/fesm2022/ui-browser-taon-datatable.component.ts.de-DE.i18n.data-DOHkRE3t.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-browser-taon-datatable.component.ts.de-DE.i18n.data-DOHkRE3t.mjs","sources":["../../../tmp-libs-for-dist/ui/projects/ui/src/lib/taon-datatable/i18n/taon-datatable.component.ts.de-DE.i18n.data.ts"],"sourcesContent":["// THIS FILE IS GENERATED - DO NOT MODIFY\n\nexport interface DeDeTraslationOverrideSrcLibTaonDatatableTaonDatatableComponentTs {\n  \"de-DE\": {\n  \"\": {\n    \"ID\"?: string;\n    \"NAME\"?: string;\n    \"No records found\"?: string;\n  };\n\n  };\n}\n// THIS FILE IS GENERATED - DO NOT MODIFY\nexport default {\n  \"fileRelativePath\": \"src/lib/taon-datatable/taon-datatable.component.ts\",\n  \"tags\": [\n    {\n      \"gettextString\": \"ID\",\n      \"lineNumber\": 59,\n      \"translation\": \"Ausweis\"\n    },\n    {\n      \"gettextString\": \"NAME\",\n      \"lineNumber\": 63,\n      \"translation\": \"Name\"\n    },\n    {\n      \"gettextString\": \"No records found\",\n      \"lineNumber\": 110\n    }\n  ]\n};\n// THIS FILE IS GENERATED - DO NOT MODIFY\n"],"names":[],"mappings":"AAAA;AAYA;AACA,gDAAe;AACb,IAAA,kBAAkB,EAAE,oDAAoD;AACxE,IAAA,MAAM,EAAE;AACN,QAAA;AACE,YAAA,eAAe,EAAE,IAAI;AACrB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,MAAM;AACvB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,kBAAkB;AACnC,YAAA,YAAY,EAAE;AACf;AACF;CACF;AACD;;"}

package/browser/fesm2022/{ui-browser-taon-datatable.component.ts.en-US.i18n.data-CS2DQd3K.mjs → ui-browser-taon-datatable.component.ts.en-US.i18n.data-C6XKszRj.mjs}

@@ -12,10 +12,14 @@ var taonDatatable_component_ts_enUS_i18n_data = {
             "gettextString": "NAME",
             "lineNumber": 63,
             "translation": "NAME"
+        },
+        {
+            "gettextString": "No records found",
+            "lineNumber": 110
         }
     ]
 };
 // THIS FILE IS GENERATED - DO NOT MODIFY
 
 export { taonDatatable_component_ts_enUS_i18n_data as default };
-//# sourceMappingURL=ui-browser-taon-datatable.component.ts.en-US.i18n.data-CS2DQd3K.mjs.map
+//# sourceMappingURL=ui-browser-taon-datatable.component.ts.en-US.i18n.data-C6XKszRj.mjs.map

package/browser/fesm2022/ui-browser-taon-datatable.component.ts.en-US.i18n.data-C6XKszRj.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-browser-taon-datatable.component.ts.en-US.i18n.data-C6XKszRj.mjs","sources":["../../../tmp-libs-for-dist/ui/projects/ui/src/lib/taon-datatable/i18n/taon-datatable.component.ts.en-US.i18n.data.ts"],"sourcesContent":["// THIS FILE IS GENERATED - DO NOT MODIFY\n\nexport interface EnUsTraslationOverrideSrcLibTaonDatatableTaonDatatableComponentTs {\n  \"en-US\": {\n  \"\": {\n    \"ID\"?: string;\n    \"NAME\"?: string;\n    \"No records found\"?: string;\n  };\n\n  };\n}\n// THIS FILE IS GENERATED - DO NOT MODIFY\nexport default {\n  \"fileRelativePath\": \"src/lib/taon-datatable/taon-datatable.component.ts\",\n  \"tags\": [\n    {\n      \"gettextString\": \"ID\",\n      \"lineNumber\": 59,\n      \"translation\": \"ID\"\n    },\n    {\n      \"gettextString\": \"NAME\",\n      \"lineNumber\": 63,\n      \"translation\": \"NAME\"\n    },\n    {\n      \"gettextString\": \"No records found\",\n      \"lineNumber\": 110\n    }\n  ]\n};\n// THIS FILE IS GENERATED - DO NOT MODIFY\n"],"names":[],"mappings":"AAAA;AAYA;AACA,gDAAe;AACb,IAAA,kBAAkB,EAAE,oDAAoD;AACxE,IAAA,MAAM,EAAE;AACN,QAAA;AACE,YAAA,eAAe,EAAE,IAAI;AACrB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,MAAM;AACvB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,kBAAkB;AACnC,YAAA,YAAY,EAAE;AACf;AACF;CACF;AACD;;"}

package/browser/fesm2022/{ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-CS7rKUSm.mjs → ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-B20v3CeP.mjs}

@@ -12,10 +12,15 @@ var taonDatatable_component_ts_plPL_i18n_data = {
             "gettextString": "NAME",
             "lineNumber": 63,
             "translation": "Nazwa"
+        },
+        {
+            "gettextString": "No records found",
+            "lineNumber": 110,
+            "translation": "Nie znalezionie nic"
         }
     ]
 };
 // THIS FILE IS GENERATED - DO NOT MODIFY
 
 export { taonDatatable_component_ts_plPL_i18n_data as default };
-//# sourceMappingURL=ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-CS7rKUSm.mjs.map
+//# sourceMappingURL=ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-B20v3CeP.mjs.map

package/browser/fesm2022/ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-B20v3CeP.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-B20v3CeP.mjs","sources":["../../../tmp-libs-for-dist/ui/projects/ui/src/lib/taon-datatable/i18n/taon-datatable.component.ts.pl-PL.i18n.data.ts"],"sourcesContent":["// THIS FILE IS GENERATED - DO NOT MODIFY\n\nexport interface PlPlTraslationOverrideSrcLibTaonDatatableTaonDatatableComponentTs {\n  \"pl-PL\": {\n  \"\": {\n    \"ID\"?: string;\n    \"NAME\"?: string;\n    \"No records found\"?: string;\n  };\n\n  };\n}\n// THIS FILE IS GENERATED - DO NOT MODIFY\nexport default {\n  \"fileRelativePath\": \"src/lib/taon-datatable/taon-datatable.component.ts\",\n  \"tags\": [\n    {\n      \"gettextString\": \"ID\",\n      \"lineNumber\": 59,\n      \"translation\": \"Posiadanie dowodu\"\n    },\n    {\n      \"gettextString\": \"NAME\",\n      \"lineNumber\": 63,\n      \"translation\": \"Nazwa\"\n    },\n    {\n      \"gettextString\": \"No records found\",\n      \"lineNumber\": 110,\n      \"translation\": \"Nie znalezionie nic\"\n    }\n  ]\n};\n// THIS FILE IS GENERATED - DO NOT MODIFY\n"],"names":[],"mappings":"AAAA;AAYA;AACA,gDAAe;AACb,IAAA,kBAAkB,EAAE,oDAAoD;AACxE,IAAA,MAAM,EAAE;AACN,QAAA;AACE,YAAA,eAAe,EAAE,IAAI;AACrB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,MAAM;AACvB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,aAAa,EAAE;AAChB,SAAA;AACD,QAAA;AACE,YAAA,eAAe,EAAE,kBAAkB;AACnC,YAAA,YAAY,EAAE,GAAG;AACjB,YAAA,aAAa,EAAE;AAChB;AACF;CACF;AACD;;"}

package/browser/fesm2022/ui-browser.mjs

@@ -68,7 +68,7 @@ const CURRENT_PACKAGE_TAON_VERSION = 'v21';
 /**
  *  Autogenerated by current cli tool. Use *tnp release* to bump version.
  */
-const CURRENT_PACKAGE_VERSION = '21.0.20';
+const CURRENT_PACKAGE_VERSION = '21.0.21';
 // THIS FILE IS GENERATED - DO NOT MODIFY
 
 const t$c = Translation.for('src/lib/my-organization-proj.ts', { "src/lib/my-organization-proj.ts": { "en-US": async () => (await import('./ui-browser-my-organization-proj.ts.en-US.i18n.data-DXwhKLKz.mjs')).default, "pl-PL": async () => (await import('./ui-browser-my-organization-proj.ts.pl-PL.i18n.data-Dwrsgs0G.mjs')).default, "de-DE": async () => (await import('./ui-browser-my-organization-proj.ts.de-DE.i18n.data-5wcHzl4v.mjs')).default }, "src/lib/start-cli.ts": { "en-US": async () => (await import('./ui-browser-start-cli.ts.en-US.i18n.data-B_glH-xr.mjs')).default, "pl-PL": async () => (await import('./ui-browser-start-cli.ts.pl-PL.i18n.data-CM1UPo6n.mjs')).default, "de-DE": async () => (await import('./ui-browser-start-cli.ts.de-DE.i18n.data-BgevoJKn.mjs')).default } });
@@ -1330,7 +1330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
 
 //#region imports
 //#endregion
-const t$4 = Translation.for('src/lib/taon-datatable/taon-datatable.component.ts', { "src/lib/taon-datatable/taon-datatable.component.html": { "en-US": async () => (await import('./ui-browser-taon-datatable.component.html.en-US.i18n.data-BtONSnMn.mjs')).default, "pl-PL": async () => (await import('./ui-browser-taon-datatable.component.html.pl-PL.i18n.data-Ctfv3ouD.mjs')).default, "de-DE": async () => (await import('./ui-browser-taon-datatable.component.html.de-DE.i18n.data-DaX_bbSs.mjs')).default }, "src/lib/taon-datatable/taon-datatable.component.ts": { "en-US": async () => (await import('./ui-browser-taon-datatable.component.ts.en-US.i18n.data-CS2DQd3K.mjs')).default, "pl-PL": async () => (await import('./ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-CS7rKUSm.mjs')).default, "de-DE": async () => (await import('./ui-browser-taon-datatable.component.ts.de-DE.i18n.data-BPAeMyCY.mjs')).default } });
+const t$4 = Translation.for('src/lib/taon-datatable/taon-datatable.component.ts', { "src/lib/taon-datatable/taon-datatable.component.html": { "en-US": async () => (await import('./ui-browser-taon-datatable.component.html.en-US.i18n.data-BtONSnMn.mjs')).default, "pl-PL": async () => (await import('./ui-browser-taon-datatable.component.html.pl-PL.i18n.data-Ctfv3ouD.mjs')).default, "de-DE": async () => (await import('./ui-browser-taon-datatable.component.html.de-DE.i18n.data-DaX_bbSs.mjs')).default }, "src/lib/taon-datatable/taon-datatable.component.ts": { "en-US": async () => (await import('./ui-browser-taon-datatable.component.ts.en-US.i18n.data-C6XKszRj.mjs')).default, "pl-PL": async () => (await import('./ui-browser-taon-datatable.component.ts.pl-PL.i18n.data-B20v3CeP.mjs')).default, "de-DE": async () => (await import('./ui-browser-taon-datatable.component.ts.de-DE.i18n.data-DOHkRE3t.mjs')).default } });
 const defaultColumns = [
     {
         header: t$4.gettext('ID'),
@@ -1351,6 +1351,7 @@ class TaonDatatableComponent {
         this.pageNumber = 1;
         this.pageSize = 10;
         this.pageSizeOptions = [5, 10, 20, 50, 100];
+        this.noResultText = this.t.gettext('No records found');
         this.allowedColumns = [];
         this.columns = defaultColumns;
         this.hideSearch = false;
@@ -1647,7 +1648,7 @@ class TaonDatatableComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: TaonDatatableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: TaonDatatableComponent, isStandalone: true, selector: "taon-datatable", inputs: { pageNumber: "pageNumber", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", allowedColumns: "allowedColumns", expansionTemplate: "expansionTemplate", entityCrudController: "entityCrudController", columns: "columns", hideSearch: "hideSearch", hideAddButton: "hideAddButton", safe: "safe", searchMode: "searchMode", callQueryMethod: "callQueryMethod", data: "data", showPaginator: "showPaginator" }, outputs: { expansionChange: "expansionChange", addingItem: "addingItem" }, ngImport: i0, template: "<div class=\"flex w-full flex-col gap-3\">\n  <!-- #region toolbar -->\n  @if (!hideSearch) {\n    <div\n      class=\"flex w-full flex-col gap-2 rounded-lg border border-gray-200 bg-white p-3 shadow-sm dark:border-gray-700 dark:bg-gray-900 md:flex-row md:items-center\">\n      <!-- global search -->\n      <mat-form-field\n        appearance=\"outline\"\n        subscriptSizing=\"dynamic\"\n        class=\"min-w-0 flex-1\">\n        <mat-icon matPrefix> search </mat-icon>\n\n        <input\n          matInput\n          [placeholder]=\"t.gettext('Search...')\"\n          [value]=\"searchValue\"\n          (input)=\"searchChanged($any($event.target).value)\" />\n\n        @if (searchValue) {\n          <button\n            mat-icon-button\n            matSuffix\n            type=\"button\"\n            (click)=\"clearSearch()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n\n      <!-- advanced search -->\n      @if (searchMode === 'advanced') {\n        <button\n          mat-stroked-button\n          type=\"button\"\n          (click)=\"toggleAdvancedSearch()\">\n          <mat-icon> tune </mat-icon>\n\n          {{ t.gettext('Filters') }}\n\n          @if (advancedSearchOpened) {\n            <mat-icon> expand_less </mat-icon>\n          } @else {\n            <mat-icon> expand_more </mat-icon>\n          }\n        </button>\n      }\n\n      <!-- refresh -->\n      <button\n        mat-icon-button\n        type=\"button\"\n        [title]=\"t.gettext('Refresh')\"\n        (click)=\"reload()\">\n        <mat-icon> refresh </mat-icon>\n      </button>\n\n      <!-- add -->\n      @if (!hideAddButton) {\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"addingItem.emit()\">\n          <mat-icon> add </mat-icon>\n\n          {{ t.gettext('Add') }}\n        </button>\n      }\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region advanced filters -->\n  @if (!hideSearch && searchMode === 'advanced' && advancedSearchOpened) {\n    <div\n      class=\"grid grid-cols-1 gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n      @for (column of filterableColumns; track column.field) {\n        <mat-form-field\n          appearance=\"outline\"\n          subscriptSizing=\"dynamic\"\n          class=\"w-full\">\n          <mat-label>\n            {{ column.header }}\n          </mat-label>\n\n          <input\n            matInput\n            [(ngModel)]=\"columnFilters[$any(column.field)]\"\n            (keyup.enter)=\"applyAdvancedFilters()\" />\n        </mat-form-field>\n      }\n\n      <div\n        class=\"flex items-center justify-end gap-2 md:col-span-2 lg:col-span-3 xl:col-span-4\">\n        <button\n          mat-button\n          type=\"button\"\n          (click)=\"clearSearch()\">\n          <mat-icon> filter_alt_off </mat-icon>\n\n          {{ t.gettext('Clear') }}\n        </button>\n\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"applyAdvancedFilters()\">\n          <mat-icon> filter_alt </mat-icon>\n\n          {{ t.gettext('Apply filters') }}\n        </button>\n      </div>\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region grid -->\n  <div\n    class=\"relative min-h-[250px] overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900\">\n    @if (isLoading) {\n      <div\n        class=\"absolute inset-0 z-10 flex items-center justify-center bg-white/60 backdrop-blur-[1px] dark:bg-gray-900/60\">\n        <div\n          class=\"flex items-center gap-2 rounded-md bg-white px-4 py-2 shadow dark:bg-gray-800\">\n          <mat-icon class=\"animate-spin\"> refresh </mat-icon>\n\n          {{ t.gettext('Loading...') }}\n        </div>\n      </div>\n    }\n\n    <mtx-grid\n      [data]=\"rows\"\n      [columns]=\"columns\"\n      [expandable]=\"expandable\"\n      [expansionTemplate]=\"lazyExpansionTemplate\"\n      [length]=\"totalElements\"\n      [pageOnFront]=\"false\"\n      [pageIndex]=\"pageNumber - 1\"\n      [pageSize]=\"pageSize\"\n      [pageSizeOptions]=\"pageSizeOptions\"\n      [showPaginator]=\"showPaginator\"\n      (expansionChange)=\"onExpansionChange($event)\"\n      (page)=\"getNextPage($event)\"\n      (sortChange)=\"sortChanged($event)\">\n    </mtx-grid>\n\n    <ng-template\n      #lazyExpansionTemplate\n      let-row>\n      @if (isExpanded(row)) {\n        <ng-container\n          [ngTemplateOutlet]=\"expansionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: row }\">\n        </ng-container>\n      }\n    </ng-template>\n  </div>\n  <!-- #endregion -->\n</div>\n", styles: [":host{display:block;width:100%;min-height:250px}:host ::ng-deep .mat-mdc-form-field{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.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: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.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: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.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: MatPaginatorModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MtxGridModule }, { kind: "component", type: i7.MtxGrid, selector: "mtx-grid", inputs: ["displayedColumns", "columns", "data", "length", "loading", "trackBy", "columnResizable", "emptyValuePlaceholder", "pageOnFront", "showPaginator", "pageDisabled", "showFirstLastButtons", "pageIndex", "pageSize", "pageSizeOptions", "hidePageSize", "paginationTemplate", "sortOnFront", "sortActive", "sortDirection", "sortDisableClear", "sortDisabled", "sortStart", "rowHover", "rowStriped", "expandable", "expansionTemplate", "multiSelectable", "multiSelectionWithClick", "rowSelectable", "hideRowSelectionCheckbox", "disableRowClickSelection", "rowSelectionFormatter", "rowClassFormatter", "rowSelected", "cellSelectable", "showToolbar", "toolbarTitle", "toolbarTemplate", "columnHideable", "columnHideableChecked", "columnSortable", "columnPinnable", "columnPinOptions", "showColumnMenuButton", "columnMenuButtonText", "columnMenuButtonType", "columnMenuButtonColor", "columnMenuButtonClass", "columnMenuButtonIcon", "columnMenuButtonFontIcon", "columnMenuButtonSvgIcon", "showColumnMenuHeader", "columnMenuHeaderText", "columnMenuHeaderTemplate", "showColumnMenuFooter", "columnMenuFooterText", "columnMenuFooterTemplate", "noResultText", "noResultTemplate", "headerTemplate", "headerExtraTemplate", "cellTemplate", "useContentRowTemplate", "useContentHeaderRowTemplate", "useContentFooterRowTemplate", "showSummary", "summaryTemplate", "showSidebar", "sidebarTemplate", "showStatusbar", "statusbarTemplate"], outputs: ["page", "sortChange", "rowClick", "rowContextMenu", "expansionChange", "rowSelectedChange", "cellSelectedChange", "columnChange"], exportAs: ["mtxGrid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: TaonDatatableComponent, isStandalone: true, selector: "taon-datatable", inputs: { pageNumber: "pageNumber", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", allowedColumns: "allowedColumns", expansionTemplate: "expansionTemplate", entityCrudController: "entityCrudController", columns: "columns", hideSearch: "hideSearch", hideAddButton: "hideAddButton", safe: "safe", searchMode: "searchMode", callQueryMethod: "callQueryMethod", data: "data", showPaginator: "showPaginator" }, outputs: { expansionChange: "expansionChange", addingItem: "addingItem" }, ngImport: i0, template: "<div class=\"flex w-full flex-col gap-3\">\n  <!-- #region toolbar -->\n  @if (!hideSearch) {\n    <div\n      class=\"flex w-full flex-col gap-2 rounded-lg border border-gray-200 bg-white p-3 shadow-sm dark:border-gray-700 dark:bg-gray-900 md:flex-row md:items-center\">\n      <!-- global search -->\n      <mat-form-field\n        appearance=\"outline\"\n        subscriptSizing=\"dynamic\"\n        class=\"min-w-0 flex-1\">\n        <mat-icon matPrefix> search </mat-icon>\n\n        <input\n          matInput\n          [placeholder]=\"t.gettext('Search...')\"\n          [value]=\"searchValue\"\n          (input)=\"searchChanged($any($event.target).value)\" />\n\n        @if (searchValue) {\n          <button\n            mat-icon-button\n            matSuffix\n            type=\"button\"\n            (click)=\"clearSearch()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n\n      <!-- advanced search -->\n      @if (searchMode === 'advanced') {\n        <button\n          mat-stroked-button\n          type=\"button\"\n          (click)=\"toggleAdvancedSearch()\">\n          <mat-icon> tune </mat-icon>\n\n          {{ t.gettext('Filters') }}\n\n          @if (advancedSearchOpened) {\n            <mat-icon> expand_less </mat-icon>\n          } @else {\n            <mat-icon> expand_more </mat-icon>\n          }\n        </button>\n      }\n\n      <!-- refresh -->\n      <button\n        mat-icon-button\n        type=\"button\"\n        [title]=\"t.gettext('Refresh')\"\n        (click)=\"reload()\">\n        <mat-icon> refresh </mat-icon>\n      </button>\n\n      <!-- add -->\n      @if (!hideAddButton) {\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"addingItem.emit()\">\n          <mat-icon> add </mat-icon>\n\n          {{ t.gettext('Add') }}\n        </button>\n      }\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region advanced filters -->\n  @if (!hideSearch && searchMode === 'advanced' && advancedSearchOpened) {\n    <div\n      class=\"grid grid-cols-1 gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n      @for (column of filterableColumns; track column.field) {\n        <mat-form-field\n          appearance=\"outline\"\n          subscriptSizing=\"dynamic\"\n          class=\"w-full\">\n          <mat-label>\n            {{ column.header }}\n          </mat-label>\n\n          <input\n            matInput\n            [(ngModel)]=\"columnFilters[$any(column.field)]\"\n            (keyup.enter)=\"applyAdvancedFilters()\" />\n        </mat-form-field>\n      }\n\n      <div\n        class=\"flex items-center justify-end gap-2 md:col-span-2 lg:col-span-3 xl:col-span-4\">\n        <button\n          mat-button\n          type=\"button\"\n          (click)=\"clearSearch()\">\n          <mat-icon> filter_alt_off </mat-icon>\n\n          {{ t.gettext('Clear') }}\n        </button>\n\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"applyAdvancedFilters()\">\n          <mat-icon> filter_alt </mat-icon>\n\n          {{ t.gettext('Apply filters') }}\n        </button>\n      </div>\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region grid -->\n  <div\n    class=\"relative min-h-[250px] overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900\">\n    @if (isLoading) {\n      <div\n        class=\"absolute inset-0 z-10 flex items-center justify-center bg-white/60 backdrop-blur-[1px] dark:bg-gray-900/60\">\n        <div\n          class=\"flex items-center gap-2 rounded-md bg-white px-4 py-2 shadow dark:bg-gray-800\">\n          <mat-icon class=\"animate-spin\"> refresh </mat-icon>\n\n          {{ t.gettext('Loading...') }}\n        </div>\n      </div>\n    }\n\n    <mtx-grid\n      [data]=\"rows\"\n      [columns]=\"columns\"\n      [expandable]=\"expandable\"\n      [expansionTemplate]=\"lazyExpansionTemplate\"\n      [length]=\"totalElements\"\n      [pageOnFront]=\"false\"\n      [pageIndex]=\"pageNumber - 1\"\n      [pageSize]=\"pageSize\"\n      [noResultText]=\"noResultText\"\n      [pageSizeOptions]=\"pageSizeOptions\"\n      [showPaginator]=\"showPaginator\"\n      (expansionChange)=\"onExpansionChange($event)\"\n      (page)=\"getNextPage($event)\"\n      (sortChange)=\"sortChanged($event)\">\n    </mtx-grid>\n\n    <ng-template\n      #lazyExpansionTemplate\n      let-row>\n      @if (isExpanded(row)) {\n        <ng-container\n          [ngTemplateOutlet]=\"expansionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: row }\">\n        </ng-container>\n      }\n    </ng-template>\n  </div>\n  <!-- #endregion -->\n</div>\n", styles: [":host{display:block;width:100%;min-height:250px}:host ::ng-deep .mat-mdc-form-field{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.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: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.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: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.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: MatPaginatorModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MtxGridModule }, { kind: "component", type: i7.MtxGrid, selector: "mtx-grid", inputs: ["displayedColumns", "columns", "data", "length", "loading", "trackBy", "columnResizable", "emptyValuePlaceholder", "pageOnFront", "showPaginator", "pageDisabled", "showFirstLastButtons", "pageIndex", "pageSize", "pageSizeOptions", "hidePageSize", "paginationTemplate", "sortOnFront", "sortActive", "sortDirection", "sortDisableClear", "sortDisabled", "sortStart", "rowHover", "rowStriped", "expandable", "expansionTemplate", "multiSelectable", "multiSelectionWithClick", "rowSelectable", "hideRowSelectionCheckbox", "disableRowClickSelection", "rowSelectionFormatter", "rowClassFormatter", "rowSelected", "cellSelectable", "showToolbar", "toolbarTitle", "toolbarTemplate", "columnHideable", "columnHideableChecked", "columnSortable", "columnPinnable", "columnPinOptions", "showColumnMenuButton", "columnMenuButtonText", "columnMenuButtonType", "columnMenuButtonColor", "columnMenuButtonClass", "columnMenuButtonIcon", "columnMenuButtonFontIcon", "columnMenuButtonSvgIcon", "showColumnMenuHeader", "columnMenuHeaderText", "columnMenuHeaderTemplate", "showColumnMenuFooter", "columnMenuFooterText", "columnMenuFooterTemplate", "noResultText", "noResultTemplate", "headerTemplate", "headerExtraTemplate", "cellTemplate", "useContentRowTemplate", "useContentHeaderRowTemplate", "useContentFooterRowTemplate", "showSummary", "summaryTemplate", "showSidebar", "sidebarTemplate", "showStatusbar", "statusbarTemplate"], outputs: ["page", "sortChange", "rowClick", "rowContextMenu", "expansionChange", "rowSelectedChange", "cellSelectedChange", "columnChange"], exportAs: ["mtxGrid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: TaonDatatableComponent, decorators: [{
             type: Component,
@@ -1662,7 +1663,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
                         MatPaginatorModule,
                         MatSelectModule,
                         MtxGridModule,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex w-full flex-col gap-3\">\n  <!-- #region toolbar -->\n  @if (!hideSearch) {\n    <div\n      class=\"flex w-full flex-col gap-2 rounded-lg border border-gray-200 bg-white p-3 shadow-sm dark:border-gray-700 dark:bg-gray-900 md:flex-row md:items-center\">\n      <!-- global search -->\n      <mat-form-field\n        appearance=\"outline\"\n        subscriptSizing=\"dynamic\"\n        class=\"min-w-0 flex-1\">\n        <mat-icon matPrefix> search </mat-icon>\n\n        <input\n          matInput\n          [placeholder]=\"t.gettext('Search...')\"\n          [value]=\"searchValue\"\n          (input)=\"searchChanged($any($event.target).value)\" />\n\n        @if (searchValue) {\n          <button\n            mat-icon-button\n            matSuffix\n            type=\"button\"\n            (click)=\"clearSearch()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n\n      <!-- advanced search -->\n      @if (searchMode === 'advanced') {\n        <button\n          mat-stroked-button\n          type=\"button\"\n          (click)=\"toggleAdvancedSearch()\">\n          <mat-icon> tune </mat-icon>\n\n          {{ t.gettext('Filters') }}\n\n          @if (advancedSearchOpened) {\n            <mat-icon> expand_less </mat-icon>\n          } @else {\n            <mat-icon> expand_more </mat-icon>\n          }\n        </button>\n      }\n\n      <!-- refresh -->\n      <button\n        mat-icon-button\n        type=\"button\"\n        [title]=\"t.gettext('Refresh')\"\n        (click)=\"reload()\">\n        <mat-icon> refresh </mat-icon>\n      </button>\n\n      <!-- add -->\n      @if (!hideAddButton) {\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"addingItem.emit()\">\n          <mat-icon> add </mat-icon>\n\n          {{ t.gettext('Add') }}\n        </button>\n      }\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region advanced filters -->\n  @if (!hideSearch && searchMode === 'advanced' && advancedSearchOpened) {\n    <div\n      class=\"grid grid-cols-1 gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n      @for (column of filterableColumns; track column.field) {\n        <mat-form-field\n          appearance=\"outline\"\n          subscriptSizing=\"dynamic\"\n          class=\"w-full\">\n          <mat-label>\n            {{ column.header }}\n          </mat-label>\n\n          <input\n            matInput\n            [(ngModel)]=\"columnFilters[$any(column.field)]\"\n            (keyup.enter)=\"applyAdvancedFilters()\" />\n        </mat-form-field>\n      }\n\n      <div\n        class=\"flex items-center justify-end gap-2 md:col-span-2 lg:col-span-3 xl:col-span-4\">\n        <button\n          mat-button\n          type=\"button\"\n          (click)=\"clearSearch()\">\n          <mat-icon> filter_alt_off </mat-icon>\n\n          {{ t.gettext('Clear') }}\n        </button>\n\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"applyAdvancedFilters()\">\n          <mat-icon> filter_alt </mat-icon>\n\n          {{ t.gettext('Apply filters') }}\n        </button>\n      </div>\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region grid -->\n  <div\n    class=\"relative min-h-[250px] overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900\">\n    @if (isLoading) {\n      <div\n        class=\"absolute inset-0 z-10 flex items-center justify-center bg-white/60 backdrop-blur-[1px] dark:bg-gray-900/60\">\n        <div\n          class=\"flex items-center gap-2 rounded-md bg-white px-4 py-2 shadow dark:bg-gray-800\">\n          <mat-icon class=\"animate-spin\"> refresh </mat-icon>\n\n          {{ t.gettext('Loading...') }}\n        </div>\n      </div>\n    }\n\n    <mtx-grid\n      [data]=\"rows\"\n      [columns]=\"columns\"\n      [expandable]=\"expandable\"\n      [expansionTemplate]=\"lazyExpansionTemplate\"\n      [length]=\"totalElements\"\n      [pageOnFront]=\"false\"\n      [pageIndex]=\"pageNumber - 1\"\n      [pageSize]=\"pageSize\"\n      [pageSizeOptions]=\"pageSizeOptions\"\n      [showPaginator]=\"showPaginator\"\n      (expansionChange)=\"onExpansionChange($event)\"\n      (page)=\"getNextPage($event)\"\n      (sortChange)=\"sortChanged($event)\">\n    </mtx-grid>\n\n    <ng-template\n      #lazyExpansionTemplate\n      let-row>\n      @if (isExpanded(row)) {\n        <ng-container\n          [ngTemplateOutlet]=\"expansionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: row }\">\n        </ng-container>\n      }\n    </ng-template>\n  </div>\n  <!-- #endregion -->\n</div>\n", styles: [":host{display:block;width:100%;min-height:250px}:host ::ng-deep .mat-mdc-form-field{margin:0}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex w-full flex-col gap-3\">\n  <!-- #region toolbar -->\n  @if (!hideSearch) {\n    <div\n      class=\"flex w-full flex-col gap-2 rounded-lg border border-gray-200 bg-white p-3 shadow-sm dark:border-gray-700 dark:bg-gray-900 md:flex-row md:items-center\">\n      <!-- global search -->\n      <mat-form-field\n        appearance=\"outline\"\n        subscriptSizing=\"dynamic\"\n        class=\"min-w-0 flex-1\">\n        <mat-icon matPrefix> search </mat-icon>\n\n        <input\n          matInput\n          [placeholder]=\"t.gettext('Search...')\"\n          [value]=\"searchValue\"\n          (input)=\"searchChanged($any($event.target).value)\" />\n\n        @if (searchValue) {\n          <button\n            mat-icon-button\n            matSuffix\n            type=\"button\"\n            (click)=\"clearSearch()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n\n      <!-- advanced search -->\n      @if (searchMode === 'advanced') {\n        <button\n          mat-stroked-button\n          type=\"button\"\n          (click)=\"toggleAdvancedSearch()\">\n          <mat-icon> tune </mat-icon>\n\n          {{ t.gettext('Filters') }}\n\n          @if (advancedSearchOpened) {\n            <mat-icon> expand_less </mat-icon>\n          } @else {\n            <mat-icon> expand_more </mat-icon>\n          }\n        </button>\n      }\n\n      <!-- refresh -->\n      <button\n        mat-icon-button\n        type=\"button\"\n        [title]=\"t.gettext('Refresh')\"\n        (click)=\"reload()\">\n        <mat-icon> refresh </mat-icon>\n      </button>\n\n      <!-- add -->\n      @if (!hideAddButton) {\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"addingItem.emit()\">\n          <mat-icon> add </mat-icon>\n\n          {{ t.gettext('Add') }}\n        </button>\n      }\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region advanced filters -->\n  @if (!hideSearch && searchMode === 'advanced' && advancedSearchOpened) {\n    <div\n      class=\"grid grid-cols-1 gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n      @for (column of filterableColumns; track column.field) {\n        <mat-form-field\n          appearance=\"outline\"\n          subscriptSizing=\"dynamic\"\n          class=\"w-full\">\n          <mat-label>\n            {{ column.header }}\n          </mat-label>\n\n          <input\n            matInput\n            [(ngModel)]=\"columnFilters[$any(column.field)]\"\n            (keyup.enter)=\"applyAdvancedFilters()\" />\n        </mat-form-field>\n      }\n\n      <div\n        class=\"flex items-center justify-end gap-2 md:col-span-2 lg:col-span-3 xl:col-span-4\">\n        <button\n          mat-button\n          type=\"button\"\n          (click)=\"clearSearch()\">\n          <mat-icon> filter_alt_off </mat-icon>\n\n          {{ t.gettext('Clear') }}\n        </button>\n\n        <button\n          mat-flat-button\n          color=\"primary\"\n          type=\"button\"\n          (click)=\"applyAdvancedFilters()\">\n          <mat-icon> filter_alt </mat-icon>\n\n          {{ t.gettext('Apply filters') }}\n        </button>\n      </div>\n    </div>\n  }\n  <!-- #endregion -->\n\n  <!-- #region grid -->\n  <div\n    class=\"relative min-h-[250px] overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900\">\n    @if (isLoading) {\n      <div\n        class=\"absolute inset-0 z-10 flex items-center justify-center bg-white/60 backdrop-blur-[1px] dark:bg-gray-900/60\">\n        <div\n          class=\"flex items-center gap-2 rounded-md bg-white px-4 py-2 shadow dark:bg-gray-800\">\n          <mat-icon class=\"animate-spin\"> refresh </mat-icon>\n\n          {{ t.gettext('Loading...') }}\n        </div>\n      </div>\n    }\n\n    <mtx-grid\n      [data]=\"rows\"\n      [columns]=\"columns\"\n      [expandable]=\"expandable\"\n      [expansionTemplate]=\"lazyExpansionTemplate\"\n      [length]=\"totalElements\"\n      [pageOnFront]=\"false\"\n      [pageIndex]=\"pageNumber - 1\"\n      [pageSize]=\"pageSize\"\n      [noResultText]=\"noResultText\"\n      [pageSizeOptions]=\"pageSizeOptions\"\n      [showPaginator]=\"showPaginator\"\n      (expansionChange)=\"onExpansionChange($event)\"\n      (page)=\"getNextPage($event)\"\n      (sortChange)=\"sortChanged($event)\">\n    </mtx-grid>\n\n    <ng-template\n      #lazyExpansionTemplate\n      let-row>\n      @if (isExpanded(row)) {\n        <ng-container\n          [ngTemplateOutlet]=\"expansionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: row }\">\n        </ng-container>\n      }\n    </ng-template>\n  </div>\n  <!-- #endregion -->\n</div>\n", styles: [":host{display:block;width:100%;min-height:250px}:host ::ng-deep .mat-mdc-form-field{margin:0}\n"] }]
         }], propDecorators: { pageNumber: [{
                 type: Input
             }], pageSize: [{