@coreui/angular-pro 4.0.0-beta.2 → 4.0.0-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/smart-table/smart-table/smart-table.component.mjs +14 -11
- package/esm2020/lib/smart-table/smart-table.type.mjs +1 -1
- package/fesm2015/coreui-angular-pro.mjs +11 -10
- package/fesm2015/coreui-angular-pro.mjs.map +1 -1
- package/fesm2020/coreui-angular-pro.mjs +13 -10
- package/fesm2020/coreui-angular-pro.mjs.map +1 -1
- package/lib/smart-table/smart-table/smart-table.component.d.ts +6 -0
- package/lib/smart-table/smart-table.type.d.ts +3 -0
- package/package.json +1 -1
|
@@ -9714,14 +9714,15 @@ class SmartTableComponent {
|
|
|
9714
9714
|
});
|
|
9715
9715
|
this.selectedAll = $event;
|
|
9716
9716
|
}
|
|
9717
|
-
|
|
9718
|
-
|
|
9719
|
-
|
|
9720
|
-
|
|
9721
|
-
|
|
9722
|
-
|
|
9723
|
-
|
|
9724
|
-
|
|
9717
|
+
tableDataCellProps(item, colName) {
|
|
9718
|
+
const props = item['_cellProps'] && Object.assign(Object.assign({}, (item['_cellProps']['_all'] && Object.assign({}, item['_cellProps']['_all']))), (item['_cellProps'][colName] && Object.assign({}, item['_cellProps'][colName])));
|
|
9719
|
+
return props;
|
|
9720
|
+
}
|
|
9721
|
+
tableDataCellClasses(item, colName) {
|
|
9722
|
+
var _a;
|
|
9723
|
+
const column = this.columns.filter((column) => column['key'] === colName);
|
|
9724
|
+
return (_a = column[0]) === null || _a === void 0 ? void 0 : _a._classes;
|
|
9725
|
+
}
|
|
9725
9726
|
getColumnName($event) {
|
|
9726
9727
|
const target = $event.target;
|
|
9727
9728
|
const closest = target.closest('tr');
|
|
@@ -9736,10 +9737,10 @@ class SmartTableComponent {
|
|
|
9736
9737
|
}
|
|
9737
9738
|
}
|
|
9738
9739
|
SmartTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SmartTableComponent, deps: [{ token: i0.IterableDiffers }], target: i0.ɵɵFactoryTarget.Component });
|
|
9739
|
-
SmartTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: SmartTableComponent, selector: "c-smart-table", inputs: { activePage: "activePage", cleaner: "cleaner", clickableRows: "clickableRows", columns: "columns", columnFilter: "columnFilter", columnFilterValue: "columnFilterValue", columnSorter: "columnSorter", footer: "footer", header: "header", items: "items", itemsPerPage: "itemsPerPage", itemsPerPageLabel: "itemsPerPageLabel", itemsPerPageOptions: "itemsPerPageOptions", itemsPerPageSelect: "itemsPerPageSelect", loading: "loading", noItemsLabel: "noItemsLabel", pagination: "pagination", selectable: "selectable", sorterValue: "sorterValue", tableFilter: "tableFilter", tableFilterLabel: "tableFilterLabel", tableFilterPlaceholder: "tableFilterPlaceholder", tableFilterValue: "tableFilterValue", tableBodyProps: "tableBodyProps", tableFootProps: "tableFootProps", tableHeadProps: "tableHeadProps", tableProps: "tableProps" }, outputs: { selectedItemsChange: "selectedItemsChange", sorterValueChange: "sorterValueChange", activePageChange: "activePageChange", itemsPerPageChange: "itemsPerPageChange", rowClick: "rowClick", columnFilterValueChange: "columnFilterValueChange", filteredItemsChange: "filteredItemsChange", tableFilterValueChange: "tableFilterValueChange" }, queries: [{ propertyName: "columnTemplates", predicate: TemplateIdDirective }], exportAs: ["cSmartTable"], ngImport: i0, template: "<div *ngIf=\"itemsPerPageSelect || tableFilter || cleaner\" class=\"row my-2 mx-0\">\r\n <ng-template [ngIf]=\"tableFilter || cleaner\">\r\n <div class=\"col-auto p-0\">\r\n <c-smart-table-filter\r\n (valueChange)=\"handleTableFilterChange($event)\"\r\n *ngIf=\"tableFilter\"\r\n [filterLabel]=\"tableFilterLabel\"\r\n [filterPlaceholder]=\"tableFilterPlaceholder\"\r\n [value]=\"tableFilterState\"\r\n >\r\n </c-smart-table-filter>\r\n </div>\r\n <div class=\"col-auto p-0\">\r\n <button\r\n (click)=\"clean($event)\"\r\n *ngIf=\"cleaner\"\r\n [disabled]=\"!isFiltered\"\r\n [ngClass]=\"{'ms-1': tableFilter}\"\r\n [tabindex]=\"0\"\r\n cButton\r\n color=\"transparent\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"filterIconTemplate\"></ng-container>\r\n </button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"position-relative\">\r\n <table [align]=\"tableProps?.align\"\r\n [borderColor]=\"tableProps?.borderColor\"\r\n [bordered]=\"tableProps?.bordered\"\r\n [borderless]=\"tableProps?.borderless\"\r\n [caption]=\"tableProps?.caption\"\r\n [color]=\"tableProps?.color\"\r\n [hover]=\"tableProps?.hover\"\r\n [responsive]=\"tableProps?.responsive\"\r\n [small]=\"tableProps?.small\"\r\n [striped]=\"tableProps?.striped\"\r\n [cHtmlAttr]=\"tableProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableProps?.color\"\r\n cTable\r\n >\r\n <c-smart-table-head\r\n (columnFilterStateChange)=\"handleColumnFilterChange($event)\"\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"header\"\r\n [columnFilterState]=\"columnFilterState\"\r\n [columnFilter]=\"columnFilter\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableHeadProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableHeadProps?.color\"\r\n [cAlign]=\"tableHeadProps?.align\"\r\n ></c-smart-table-head>\r\n\r\n <ng-container *ngTemplateOutlet=\"tbodyDefaultTemplate\"></ng-container>\r\n\r\n <c-smart-table-head\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"footer\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableFootProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableFootProps?.color\"\r\n [cAlign]=\"tableFootProps?.align\"\r\n component=\"tfoot\"\r\n ></c-smart-table-head>\r\n\r\n </table>\r\n <c-element-cover\r\n *ngIf=\"loading\"\r\n [boundaries]=\"[\r\n { sides: ['top'], query: 'td' },\r\n { sides: ['bottom'], query: 'tbody' }\r\n ]\"\r\n ></c-element-cover>\r\n</div>\r\n<ng-template [ngIf]=\"pagination || itemsPerPageSelect\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <c-smart-pagination\r\n (activePageChange)=\"setActivePage($event)\"\r\n *ngIf=\"pagination && numberOfPages > 1\"\r\n [activePage]=\"activePage\"\r\n [pages]=\"numberOfPages\">\r\n </c-smart-pagination>\r\n </div>\r\n <div class=\"col-auto ms-auto\">\r\n <c-smart-table-items-per-page-selector\r\n (itemsPerPageChange)=\"handleItemsPerPageChange($event)\"\r\n *ngIf=\"itemsPerPageSelect\"\r\n [itemsPerPageLabel]=\"itemsPerPageLabel\"\r\n [itemsPerPageOptions]=\"itemsPerPageOptions\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n >\r\n </c-smart-table-items-per-page-selector>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tbodyDefaultTemplate>\r\n <tbody [cHtmlAttr]=\"tableBodyProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableBodyProps?.color\"\r\n [cAlign]=\"tableBodyProps?.align\"\r\n >\r\n <ng-template ngFor let-item [ngForOf]=\"currentItems\" let-cnt=\"count\" let-i=\"index\" let-isEven=\"even\" let-isOdd=\"odd\">\r\n <tr [tabindex]=\"clickableRows ? 0 : -1\"\r\n [ngStyle]=\"{cursor: clickableRows ? 'pointer' : 'auto'}\"\r\n (click)=\"handleRowClick({$event, item, i})\"\r\n [cTableActive]=\"item._props?.active\"\r\n [cTableColor]=\"item._props?.color\"\r\n [cAlign]=\"item._props?.align\"\r\n >\r\n <td *ngIf=\"selectable\"\r\n [cTableActive]=\"item?.['_cellProps']?._all?.active\"\r\n [cTableColor]=\"item?.['_cellProps']?._all?.color\"\r\n [cAlign]=\"item?.['_cellProps']?._all?.align\">\r\n <input (change)=\"handleRowChecked($event, item)\" [checked]=\"item._selected ?? false\" cFormCheckInput>\r\n </td>\r\n <ng-template ngFor let-columnName [ngForOf]=\"rawColumnNames\" let-i=\"index\" >\r\n <ng-container *ngTemplateOutlet=\"templates['tableData'] || columnDefaultTemplate; context: {item, columnName, tdContent: item[columnName] }\"></ng-container>\r\n </ng-template>\r\n </tr>\r\n <ng-template [ngIf]=\"templates['tableDetails']\">\r\n <!-- <ng-container *ngTemplateOutlet=\"rowDetailsDefaultTemplate\"></ng-container>-->\r\n <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>\r\n <tr class=\"p-0\">\r\n <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">\r\n <ng-container *ngTemplateOutlet=\"templates['tableDetails']; context: {item, index: i}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"noItemsDefaultTemplate\"></ng-container>\r\n </tbody>\r\n</ng-template>\r\n\r\n<ng-template #columnDefaultTemplate let-item=\"item\" let-columnName=\"columnName\" let-tdContent=\"tdContent\">\r\n <td\r\n [cTableActive]=\"item?.['_cellProps']?.[columnName]?.active ?? item?.['_cellProps']?._all?.active\"\r\n [cTableColor]=\"item?.['_cellProps']?.[columnName]?.color ?? item?.['_cellProps']?._all?.color\"\r\n [cAlign]=\"item?.['_cellProps']?.[columnName]?.align ?? item?.['_cellProps']?._all?.align\"\r\n >\r\n {{tdContent}}\r\n </td>\r\n</ng-template>\r\n\r\n<!--<ng-template #rowDetailsDefaultTemplate let-item let-index>-->\r\n<!-- <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>-->\r\n<!-- <tr class=\"p-0\">-->\r\n<!-- <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">-->\r\n<!-- <ng-container *ngTemplateOutlet=\"templates?.tableDetails\"></ng-container>-->\r\n<!-- </td>-->\r\n<!-- </tr>-->\r\n<!--</ng-template>-->\r\n\r\n<ng-template #noItemsDefaultTemplate>\r\n <tr *ngIf=\"!currentItems.length\">\r\n <td [colSpan]=\"colspan\" class=\"justify-content-center\">{{noItemsLabel}}</td>\r\n </tr>\r\n</ng-template>\r\n\r\n<!--todo: filterIconCustomTemplate-->\r\n<ng-template #filterIconTemplate>\r\n <svg class=\"icon icon-custom-size\" role=\"img\" viewBox=\"0 0 512 512\" width=\"18\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"40 16 40 53.828 109.024 136 150.815 136 76.896 48 459.51 48 304 242.388 304 401.373 241.373 464 240 464 240 368 208 368 208 496 254.627 496 336 414.627 336 253.612 496 53.612 496 16 40 16\"></polygon>\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"166.403 248.225 226.864 187.763 204.237 165.135 143.775 225.597 83.313 165.135 60.687 187.763 121.148 248.225 60.687 308.687 83.313 331.314 143.775 270.852 204.237 331.314 226.864 308.687 166.403 248.225\"></polygon>\r\n </svg>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], components: [{ type: SmartTableFilterComponent, selector: "c-smart-table-filter", inputs: ["filterLabel", "filterPlaceholder", "value"], outputs: ["valueChange"] }, { type: SmartTableHeadComponent, selector: "c-smart-table-head", inputs: ["columnFilter", "columnFilterState", "columnSorter", "component", "columns", "selectable", "selectAll", "sorterValue"], outputs: ["columnFilterStateChange", "sorterStateChange", "selectAllChange"] }, { type: ElementCoverComponent, selector: "c-element-cover, [cElementCover]", inputs: ["boundaries", "opacity"] }, { type: SmartPaginationComponent, selector: "c-smart-pagination", inputs: ["activePage", "arrows", "doubleArrows", "dots", "limit", "pages", "firstButton", "lastButton", "nextButton", "previousButton", "align", "size", "role"], outputs: ["activePageChange"], exportAs: ["cSmartPagination"] }, { type: SmartTableItemsPerPageSelectorComponent, selector: "c-smart-table-items-per-page-selector", inputs: ["itemsPerPage", "itemsPerPageLabel", "itemsPerPageOptions"], outputs: ["itemsPerPageChange"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ButtonDirective, selector: "[cButton]", inputs: ["active", "color", "disabled", "shape", "size", "type", "variant"], exportAs: ["cButton"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TableDirective, selector: "table[cTable]", inputs: ["align", "borderColor", "bordered", "borderless", "caption", "color", "hover", "responsive", "small", "striped"] }, { type: HtmlAttributesDirective, selector: "[cHtmlAttr]", inputs: ["cHtmlAttr"], exportAs: ["cHtmlAttr"] }, { type: TableColorDirective, selector: "[cTableColor]", inputs: ["cTableColor"] }, { type: AlignDirective, selector: "[cAlign]", inputs: ["cAlign"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: TableActiveDirective, selector: "[cTableActive]", inputs: ["cTableActive"] }, { type: FormCheckInputDirective, selector: "input[cFormCheckInput]", inputs: ["type", "indeterminate", "valid"] }] });
|
|
9740
|
+
SmartTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: SmartTableComponent, selector: "c-smart-table", inputs: { activePage: "activePage", cleaner: "cleaner", clickableRows: "clickableRows", columns: "columns", columnFilter: "columnFilter", columnFilterValue: "columnFilterValue", columnSorter: "columnSorter", footer: "footer", header: "header", items: "items", itemsPerPage: "itemsPerPage", itemsPerPageLabel: "itemsPerPageLabel", itemsPerPageOptions: "itemsPerPageOptions", itemsPerPageSelect: "itemsPerPageSelect", loading: "loading", noItemsLabel: "noItemsLabel", pagination: "pagination", selectable: "selectable", sorterValue: "sorterValue", tableFilter: "tableFilter", tableFilterLabel: "tableFilterLabel", tableFilterPlaceholder: "tableFilterPlaceholder", tableFilterValue: "tableFilterValue", tableBodyProps: "tableBodyProps", tableFootProps: "tableFootProps", tableHeadProps: "tableHeadProps", tableProps: "tableProps" }, outputs: { selectedItemsChange: "selectedItemsChange", sorterValueChange: "sorterValueChange", activePageChange: "activePageChange", itemsPerPageChange: "itemsPerPageChange", rowClick: "rowClick", columnFilterValueChange: "columnFilterValueChange", filteredItemsChange: "filteredItemsChange", tableFilterValueChange: "tableFilterValueChange" }, queries: [{ propertyName: "columnTemplates", predicate: TemplateIdDirective }], exportAs: ["cSmartTable"], ngImport: i0, template: "<div *ngIf=\"itemsPerPageSelect || tableFilter || cleaner\" class=\"row my-2 mx-0\">\r\n <ng-template [ngIf]=\"tableFilter || cleaner\">\r\n <div class=\"col-auto p-0\">\r\n <c-smart-table-filter\r\n (valueChange)=\"handleTableFilterChange($event)\"\r\n *ngIf=\"tableFilter\"\r\n [filterLabel]=\"tableFilterLabel\"\r\n [filterPlaceholder]=\"tableFilterPlaceholder\"\r\n [value]=\"tableFilterState\"\r\n >\r\n </c-smart-table-filter>\r\n </div>\r\n <div class=\"col-auto p-0\">\r\n <button\r\n (click)=\"clean($event)\"\r\n *ngIf=\"cleaner\"\r\n [disabled]=\"!isFiltered\"\r\n [ngClass]=\"{'ms-1': tableFilter}\"\r\n [tabindex]=\"0\"\r\n cButton\r\n color=\"transparent\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"filterIconTemplate\"></ng-container>\r\n </button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"position-relative\">\r\n <table [align]=\"tableProps?.align\"\r\n [borderColor]=\"tableProps?.borderColor\"\r\n [bordered]=\"tableProps?.bordered\"\r\n [borderless]=\"tableProps?.borderless\"\r\n [caption]=\"tableProps?.caption\"\r\n [color]=\"tableProps?.color\"\r\n [hover]=\"tableProps?.hover\"\r\n [responsive]=\"tableProps?.responsive\"\r\n [small]=\"tableProps?.small\"\r\n [striped]=\"tableProps?.striped\"\r\n [cHtmlAttr]=\"tableProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableProps?.color\"\r\n cTable\r\n >\r\n <c-smart-table-head\r\n (columnFilterStateChange)=\"handleColumnFilterChange($event)\"\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"header\"\r\n [columnFilterState]=\"columnFilterState\"\r\n [columnFilter]=\"columnFilter\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableHeadProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableHeadProps?.color\"\r\n [cAlign]=\"tableHeadProps?.align\"\r\n ></c-smart-table-head>\r\n\r\n <ng-container *ngTemplateOutlet=\"tbodyDefaultTemplate\"></ng-container>\r\n\r\n <c-smart-table-head\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"footer\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableFootProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableFootProps?.color\"\r\n [cAlign]=\"tableFootProps?.align\"\r\n component=\"tfoot\"\r\n ></c-smart-table-head>\r\n\r\n </table>\r\n <c-element-cover\r\n *ngIf=\"loading\"\r\n [boundaries]=\"[\r\n { sides: ['top'], query: 'td' },\r\n { sides: ['bottom'], query: 'tbody' }\r\n ]\"\r\n ></c-element-cover>\r\n</div>\r\n<ng-template [ngIf]=\"pagination || itemsPerPageSelect\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <c-smart-pagination\r\n (activePageChange)=\"setActivePage($event)\"\r\n *ngIf=\"pagination && numberOfPages > 1\"\r\n [activePage]=\"activePage\"\r\n [pages]=\"numberOfPages\">\r\n </c-smart-pagination>\r\n </div>\r\n <div class=\"col-auto ms-auto\">\r\n <c-smart-table-items-per-page-selector\r\n (itemsPerPageChange)=\"handleItemsPerPageChange($event)\"\r\n *ngIf=\"itemsPerPageSelect\"\r\n [itemsPerPageLabel]=\"itemsPerPageLabel\"\r\n [itemsPerPageOptions]=\"itemsPerPageOptions\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n >\r\n </c-smart-table-items-per-page-selector>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tbodyDefaultTemplate>\r\n <tbody [cHtmlAttr]=\"tableBodyProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableBodyProps?.color\"\r\n [cAlign]=\"tableBodyProps?.align\"\r\n >\r\n <ng-template ngFor let-item [ngForOf]=\"currentItems\" let-cnt=\"count\" let-i=\"index\" let-isEven=\"even\" let-isOdd=\"odd\">\r\n <tr [tabindex]=\"clickableRows ? 0 : -1\"\r\n [ngStyle]=\"{cursor: clickableRows ? 'pointer' : 'auto'}\"\r\n (click)=\"handleRowClick({$event, item, i})\"\r\n [cTableActive]=\"item._props?.active\"\r\n [cTableColor]=\"item._props?.color\"\r\n [cAlign]=\"item._props?.align\"\r\n >\r\n <td *ngIf=\"selectable\"\r\n [cTableActive]=\"item?.['_cellProps']?._all?.active\"\r\n [cTableColor]=\"item?.['_cellProps']?._all?.color\"\r\n [cAlign]=\"item?.['_cellProps']?._all?.align\"\r\n >\r\n <input (change)=\"handleRowChecked($event, item)\" [checked]=\"item._selected ?? false\" cFormCheckInput>\r\n </td>\r\n <ng-template ngFor let-columnName [ngForOf]=\"rawColumnNames\" let-i=\"index\" >\r\n <ng-container *ngTemplateOutlet=\"templates['tableData'] || columnDefaultTemplate; context: {item, columnName, tdContent: item[columnName] }\"></ng-container>\r\n </ng-template>\r\n </tr>\r\n <ng-template [ngIf]=\"templates['tableDetails']\">\r\n <!-- <ng-container *ngTemplateOutlet=\"rowDetailsDefaultTemplate\"></ng-container>-->\r\n <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>\r\n <tr class=\"p-0\">\r\n <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">\r\n <ng-container *ngTemplateOutlet=\"templates['tableDetails']; context: {item, index: i}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"noItemsDefaultTemplate\"></ng-container>\r\n </tbody>\r\n</ng-template>\r\n\r\n<ng-template #columnDefaultTemplate let-item=\"item\" let-columnName=\"columnName\" let-tdContent=\"tdContent\">\r\n <td\r\n [cTableActive]=\"tableDataCellProps(item, columnName)?.['active']\"\r\n [cTableColor]=\"tableDataCellProps(item, columnName)?.color\"\r\n [cAlign]=\"tableDataCellProps(item, columnName)?.align\"\r\n [ngClass]=\"tableDataCellClasses(item, columnName)\"\r\n >\r\n {{tdContent}}\r\n </td>\r\n</ng-template>\r\n\r\n<!--<ng-template #rowDetailsDefaultTemplate let-item let-index>-->\r\n<!-- <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>-->\r\n<!-- <tr class=\"p-0\">-->\r\n<!-- <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">-->\r\n<!-- <ng-container *ngTemplateOutlet=\"templates?.tableDetails\"></ng-container>-->\r\n<!-- </td>-->\r\n<!-- </tr>-->\r\n<!--</ng-template>-->\r\n\r\n<ng-template #noItemsDefaultTemplate>\r\n <tr *ngIf=\"!currentItems.length\">\r\n <td [colSpan]=\"colspan\" class=\"justify-content-center\">{{noItemsLabel}}</td>\r\n </tr>\r\n</ng-template>\r\n\r\n<!--todo: filterIconCustomTemplate-->\r\n<ng-template #filterIconTemplate>\r\n <svg class=\"icon icon-custom-size\" role=\"img\" viewBox=\"0 0 512 512\" width=\"18\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"40 16 40 53.828 109.024 136 150.815 136 76.896 48 459.51 48 304 242.388 304 401.373 241.373 464 240 464 240 368 208 368 208 496 254.627 496 336 414.627 336 253.612 496 53.612 496 16 40 16\"></polygon>\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"166.403 248.225 226.864 187.763 204.237 165.135 143.775 225.597 83.313 165.135 60.687 187.763 121.148 248.225 60.687 308.687 83.313 331.314 143.775 270.852 204.237 331.314 226.864 308.687 166.403 248.225\"></polygon>\r\n </svg>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], components: [{ type: SmartTableFilterComponent, selector: "c-smart-table-filter", inputs: ["filterLabel", "filterPlaceholder", "value"], outputs: ["valueChange"] }, { type: SmartTableHeadComponent, selector: "c-smart-table-head", inputs: ["columnFilter", "columnFilterState", "columnSorter", "component", "columns", "selectable", "selectAll", "sorterValue"], outputs: ["columnFilterStateChange", "sorterStateChange", "selectAllChange"] }, { type: ElementCoverComponent, selector: "c-element-cover, [cElementCover]", inputs: ["boundaries", "opacity"] }, { type: SmartPaginationComponent, selector: "c-smart-pagination", inputs: ["activePage", "arrows", "doubleArrows", "dots", "limit", "pages", "firstButton", "lastButton", "nextButton", "previousButton", "align", "size", "role"], outputs: ["activePageChange"], exportAs: ["cSmartPagination"] }, { type: SmartTableItemsPerPageSelectorComponent, selector: "c-smart-table-items-per-page-selector", inputs: ["itemsPerPage", "itemsPerPageLabel", "itemsPerPageOptions"], outputs: ["itemsPerPageChange"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ButtonDirective, selector: "[cButton]", inputs: ["active", "color", "disabled", "shape", "size", "type", "variant"], exportAs: ["cButton"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TableDirective, selector: "table[cTable]", inputs: ["align", "borderColor", "bordered", "borderless", "caption", "color", "hover", "responsive", "small", "striped"] }, { type: HtmlAttributesDirective, selector: "[cHtmlAttr]", inputs: ["cHtmlAttr"], exportAs: ["cHtmlAttr"] }, { type: TableColorDirective, selector: "[cTableColor]", inputs: ["cTableColor"] }, { type: AlignDirective, selector: "[cAlign]", inputs: ["cAlign"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: TableActiveDirective, selector: "[cTableActive]", inputs: ["cTableActive"] }, { type: FormCheckInputDirective, selector: "input[cFormCheckInput]", inputs: ["type", "indeterminate", "valid"] }] });
|
|
9740
9741
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SmartTableComponent, decorators: [{
|
|
9741
9742
|
type: Component,
|
|
9742
|
-
args: [{ selector: 'c-smart-table', exportAs: 'cSmartTable', template: "<div *ngIf=\"itemsPerPageSelect || tableFilter || cleaner\" class=\"row my-2 mx-0\">\r\n <ng-template [ngIf]=\"tableFilter || cleaner\">\r\n <div class=\"col-auto p-0\">\r\n <c-smart-table-filter\r\n (valueChange)=\"handleTableFilterChange($event)\"\r\n *ngIf=\"tableFilter\"\r\n [filterLabel]=\"tableFilterLabel\"\r\n [filterPlaceholder]=\"tableFilterPlaceholder\"\r\n [value]=\"tableFilterState\"\r\n >\r\n </c-smart-table-filter>\r\n </div>\r\n <div class=\"col-auto p-0\">\r\n <button\r\n (click)=\"clean($event)\"\r\n *ngIf=\"cleaner\"\r\n [disabled]=\"!isFiltered\"\r\n [ngClass]=\"{'ms-1': tableFilter}\"\r\n [tabindex]=\"0\"\r\n cButton\r\n color=\"transparent\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"filterIconTemplate\"></ng-container>\r\n </button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"position-relative\">\r\n <table [align]=\"tableProps?.align\"\r\n [borderColor]=\"tableProps?.borderColor\"\r\n [bordered]=\"tableProps?.bordered\"\r\n [borderless]=\"tableProps?.borderless\"\r\n [caption]=\"tableProps?.caption\"\r\n [color]=\"tableProps?.color\"\r\n [hover]=\"tableProps?.hover\"\r\n [responsive]=\"tableProps?.responsive\"\r\n [small]=\"tableProps?.small\"\r\n [striped]=\"tableProps?.striped\"\r\n [cHtmlAttr]=\"tableProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableProps?.color\"\r\n cTable\r\n >\r\n <c-smart-table-head\r\n (columnFilterStateChange)=\"handleColumnFilterChange($event)\"\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"header\"\r\n [columnFilterState]=\"columnFilterState\"\r\n [columnFilter]=\"columnFilter\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableHeadProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableHeadProps?.color\"\r\n [cAlign]=\"tableHeadProps?.align\"\r\n ></c-smart-table-head>\r\n\r\n <ng-container *ngTemplateOutlet=\"tbodyDefaultTemplate\"></ng-container>\r\n\r\n <c-smart-table-head\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"footer\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableFootProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableFootProps?.color\"\r\n [cAlign]=\"tableFootProps?.align\"\r\n component=\"tfoot\"\r\n ></c-smart-table-head>\r\n\r\n </table>\r\n <c-element-cover\r\n *ngIf=\"loading\"\r\n [boundaries]=\"[\r\n { sides: ['top'], query: 'td' },\r\n { sides: ['bottom'], query: 'tbody' }\r\n ]\"\r\n ></c-element-cover>\r\n</div>\r\n<ng-template [ngIf]=\"pagination || itemsPerPageSelect\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <c-smart-pagination\r\n (activePageChange)=\"setActivePage($event)\"\r\n *ngIf=\"pagination && numberOfPages > 1\"\r\n [activePage]=\"activePage\"\r\n [pages]=\"numberOfPages\">\r\n </c-smart-pagination>\r\n </div>\r\n <div class=\"col-auto ms-auto\">\r\n <c-smart-table-items-per-page-selector\r\n (itemsPerPageChange)=\"handleItemsPerPageChange($event)\"\r\n *ngIf=\"itemsPerPageSelect\"\r\n [itemsPerPageLabel]=\"itemsPerPageLabel\"\r\n [itemsPerPageOptions]=\"itemsPerPageOptions\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n >\r\n </c-smart-table-items-per-page-selector>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tbodyDefaultTemplate>\r\n <tbody [cHtmlAttr]=\"tableBodyProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableBodyProps?.color\"\r\n [cAlign]=\"tableBodyProps?.align\"\r\n >\r\n <ng-template ngFor let-item [ngForOf]=\"currentItems\" let-cnt=\"count\" let-i=\"index\" let-isEven=\"even\" let-isOdd=\"odd\">\r\n <tr [tabindex]=\"clickableRows ? 0 : -1\"\r\n [ngStyle]=\"{cursor: clickableRows ? 'pointer' : 'auto'}\"\r\n (click)=\"handleRowClick({$event, item, i})\"\r\n [cTableActive]=\"item._props?.active\"\r\n [cTableColor]=\"item._props?.color\"\r\n [cAlign]=\"item._props?.align\"\r\n >\r\n <td *ngIf=\"selectable\"\r\n [cTableActive]=\"item?.['_cellProps']?._all?.active\"\r\n [cTableColor]=\"item?.['_cellProps']?._all?.color\"\r\n [cAlign]=\"item?.['_cellProps']?._all?.align\">\r\n <input (change)=\"handleRowChecked($event, item)\" [checked]=\"item._selected ?? false\" cFormCheckInput>\r\n </td>\r\n <ng-template ngFor let-columnName [ngForOf]=\"rawColumnNames\" let-i=\"index\" >\r\n <ng-container *ngTemplateOutlet=\"templates['tableData'] || columnDefaultTemplate; context: {item, columnName, tdContent: item[columnName] }\"></ng-container>\r\n </ng-template>\r\n </tr>\r\n <ng-template [ngIf]=\"templates['tableDetails']\">\r\n <!-- <ng-container *ngTemplateOutlet=\"rowDetailsDefaultTemplate\"></ng-container>-->\r\n <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>\r\n <tr class=\"p-0\">\r\n <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">\r\n <ng-container *ngTemplateOutlet=\"templates['tableDetails']; context: {item, index: i}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"noItemsDefaultTemplate\"></ng-container>\r\n </tbody>\r\n</ng-template>\r\n\r\n<ng-template #columnDefaultTemplate let-item=\"item\" let-columnName=\"columnName\" let-tdContent=\"tdContent\">\r\n <td\r\n [cTableActive]=\"item?.['
|
|
9743
|
+
args: [{ selector: 'c-smart-table', exportAs: 'cSmartTable', template: "<div *ngIf=\"itemsPerPageSelect || tableFilter || cleaner\" class=\"row my-2 mx-0\">\r\n <ng-template [ngIf]=\"tableFilter || cleaner\">\r\n <div class=\"col-auto p-0\">\r\n <c-smart-table-filter\r\n (valueChange)=\"handleTableFilterChange($event)\"\r\n *ngIf=\"tableFilter\"\r\n [filterLabel]=\"tableFilterLabel\"\r\n [filterPlaceholder]=\"tableFilterPlaceholder\"\r\n [value]=\"tableFilterState\"\r\n >\r\n </c-smart-table-filter>\r\n </div>\r\n <div class=\"col-auto p-0\">\r\n <button\r\n (click)=\"clean($event)\"\r\n *ngIf=\"cleaner\"\r\n [disabled]=\"!isFiltered\"\r\n [ngClass]=\"{'ms-1': tableFilter}\"\r\n [tabindex]=\"0\"\r\n cButton\r\n color=\"transparent\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"filterIconTemplate\"></ng-container>\r\n </button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"position-relative\">\r\n <table [align]=\"tableProps?.align\"\r\n [borderColor]=\"tableProps?.borderColor\"\r\n [bordered]=\"tableProps?.bordered\"\r\n [borderless]=\"tableProps?.borderless\"\r\n [caption]=\"tableProps?.caption\"\r\n [color]=\"tableProps?.color\"\r\n [hover]=\"tableProps?.hover\"\r\n [responsive]=\"tableProps?.responsive\"\r\n [small]=\"tableProps?.small\"\r\n [striped]=\"tableProps?.striped\"\r\n [cHtmlAttr]=\"tableProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableProps?.color\"\r\n cTable\r\n >\r\n <c-smart-table-head\r\n (columnFilterStateChange)=\"handleColumnFilterChange($event)\"\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"header\"\r\n [columnFilterState]=\"columnFilterState\"\r\n [columnFilter]=\"columnFilter\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableHeadProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableHeadProps?.color\"\r\n [cAlign]=\"tableHeadProps?.align\"\r\n ></c-smart-table-head>\r\n\r\n <ng-container *ngTemplateOutlet=\"tbodyDefaultTemplate\"></ng-container>\r\n\r\n <c-smart-table-head\r\n (selectAllChange)=\"handleSelectAllChange($event)\"\r\n (sorterStateChange)=\"handleSortChange($event)\"\r\n *ngIf=\"footer\"\r\n [columns]=\"columns\"\r\n [selectAll]=\"selectedAll\"\r\n [selectable]=\"selectable\"\r\n [sorterValue]=\"sorterValue\"\r\n [cHtmlAttr]=\"tableFootProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableFootProps?.color\"\r\n [cAlign]=\"tableFootProps?.align\"\r\n component=\"tfoot\"\r\n ></c-smart-table-head>\r\n\r\n </table>\r\n <c-element-cover\r\n *ngIf=\"loading\"\r\n [boundaries]=\"[\r\n { sides: ['top'], query: 'td' },\r\n { sides: ['bottom'], query: 'tbody' }\r\n ]\"\r\n ></c-element-cover>\r\n</div>\r\n<ng-template [ngIf]=\"pagination || itemsPerPageSelect\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <c-smart-pagination\r\n (activePageChange)=\"setActivePage($event)\"\r\n *ngIf=\"pagination && numberOfPages > 1\"\r\n [activePage]=\"activePage\"\r\n [pages]=\"numberOfPages\">\r\n </c-smart-pagination>\r\n </div>\r\n <div class=\"col-auto ms-auto\">\r\n <c-smart-table-items-per-page-selector\r\n (itemsPerPageChange)=\"handleItemsPerPageChange($event)\"\r\n *ngIf=\"itemsPerPageSelect\"\r\n [itemsPerPageLabel]=\"itemsPerPageLabel\"\r\n [itemsPerPageOptions]=\"itemsPerPageOptions\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n >\r\n </c-smart-table-items-per-page-selector>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tbodyDefaultTemplate>\r\n <tbody [cHtmlAttr]=\"tableBodyProps?.attributes ?? {}\"\r\n [cTableColor]=\"tableBodyProps?.color\"\r\n [cAlign]=\"tableBodyProps?.align\"\r\n >\r\n <ng-template ngFor let-item [ngForOf]=\"currentItems\" let-cnt=\"count\" let-i=\"index\" let-isEven=\"even\" let-isOdd=\"odd\">\r\n <tr [tabindex]=\"clickableRows ? 0 : -1\"\r\n [ngStyle]=\"{cursor: clickableRows ? 'pointer' : 'auto'}\"\r\n (click)=\"handleRowClick({$event, item, i})\"\r\n [cTableActive]=\"item._props?.active\"\r\n [cTableColor]=\"item._props?.color\"\r\n [cAlign]=\"item._props?.align\"\r\n >\r\n <td *ngIf=\"selectable\"\r\n [cTableActive]=\"item?.['_cellProps']?._all?.active\"\r\n [cTableColor]=\"item?.['_cellProps']?._all?.color\"\r\n [cAlign]=\"item?.['_cellProps']?._all?.align\"\r\n >\r\n <input (change)=\"handleRowChecked($event, item)\" [checked]=\"item._selected ?? false\" cFormCheckInput>\r\n </td>\r\n <ng-template ngFor let-columnName [ngForOf]=\"rawColumnNames\" let-i=\"index\" >\r\n <ng-container *ngTemplateOutlet=\"templates['tableData'] || columnDefaultTemplate; context: {item, columnName, tdContent: item[columnName] }\"></ng-container>\r\n </ng-template>\r\n </tr>\r\n <ng-template [ngIf]=\"templates['tableDetails']\">\r\n <!-- <ng-container *ngTemplateOutlet=\"rowDetailsDefaultTemplate\"></ng-container>-->\r\n <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>\r\n <tr class=\"p-0\">\r\n <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">\r\n <ng-container *ngTemplateOutlet=\"templates['tableDetails']; context: {item, index: i}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"noItemsDefaultTemplate\"></ng-container>\r\n </tbody>\r\n</ng-template>\r\n\r\n<ng-template #columnDefaultTemplate let-item=\"item\" let-columnName=\"columnName\" let-tdContent=\"tdContent\">\r\n <td\r\n [cTableActive]=\"tableDataCellProps(item, columnName)?.['active']\"\r\n [cTableColor]=\"tableDataCellProps(item, columnName)?.color\"\r\n [cAlign]=\"tableDataCellProps(item, columnName)?.align\"\r\n [ngClass]=\"tableDataCellClasses(item, columnName)\"\r\n >\r\n {{tdContent}}\r\n </td>\r\n</ng-template>\r\n\r\n<!--<ng-template #rowDetailsDefaultTemplate let-item let-index>-->\r\n<!-- <tr><td [colSpan]=\"colspan\" class=\"p-0\" tabindex=\"-1\" [ngStyle]=\"{borderBottomWidth: 0}\"></td></tr>-->\r\n<!-- <tr class=\"p-0\">-->\r\n<!-- <td [colSpan]=\"colspan\" class=\"p-0\" [ngStyle]=\"{border: 0}\">-->\r\n<!-- <ng-container *ngTemplateOutlet=\"templates?.tableDetails\"></ng-container>-->\r\n<!-- </td>-->\r\n<!-- </tr>-->\r\n<!--</ng-template>-->\r\n\r\n<ng-template #noItemsDefaultTemplate>\r\n <tr *ngIf=\"!currentItems.length\">\r\n <td [colSpan]=\"colspan\" class=\"justify-content-center\">{{noItemsLabel}}</td>\r\n </tr>\r\n</ng-template>\r\n\r\n<!--todo: filterIconCustomTemplate-->\r\n<ng-template #filterIconTemplate>\r\n <svg class=\"icon icon-custom-size\" role=\"img\" viewBox=\"0 0 512 512\" width=\"18\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"40 16 40 53.828 109.024 136 150.815 136 76.896 48 459.51 48 304 242.388 304 401.373 241.373 464 240 464 240 368 208 368 208 496 254.627 496 336 414.627 336 253.612 496 53.612 496 16 40 16\"></polygon>\r\n <polygon class=\"ci-primary\"\r\n fill=\"var(--ci-primary-color, currentColor)\"\r\n points=\"166.403 248.225 226.864 187.763 204.237 165.135 143.775 225.597 83.313 165.135 60.687 187.763 121.148 248.225 60.687 308.687 83.313 331.314 143.775 270.852 204.237 331.314 226.864 308.687 166.403 248.225\"></polygon>\r\n </svg>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"] }]
|
|
9743
9744
|
}], ctorParameters: function () { return [{ type: i0.IterableDiffers }]; }, propDecorators: { activePage: [{
|
|
9744
9745
|
type: Input
|
|
9745
9746
|
}], cleaner: [{
|