@solcre-org/core-ui 2.12.2 → 2.12.4

package/fesm2022/solcre-org-core-ui.mjs

@@ -4657,6 +4657,16 @@ class PaginationService {
     destroy(tableId) {
         this.paginationState.delete(tableId);
     }
+    getCurrentPaginationParams(tableId) {
+        const state = this.paginationState.get(tableId);
+        if (!state) {
+            return {};
+        }
+        return {
+            page: state.currentPage(),
+            size: state.pageSize()
+        };
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: PaginationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: PaginationService, providedIn: 'root' });
 }
@@ -5995,7 +6005,6 @@ class TableDataService {
     }
     updateFilters(filterValues, loaderId) {
         if (!this.currentEndpoint || !this.currentModelFactory) {
-            console.log('No endpoint or model factory defined for updateFilters');
             return;
         }
         const filterParams = {};
@@ -6077,6 +6086,20 @@ class TableDataService {
         }
         current[keys[keys.length - 1]] = value;
     }
+    getCurrentData() {
+        return this.getData();
+    }
+    updateData(newData) {
+        this.setData(newData);
+    }
+    loadDataWithParams(endpoint, modelFactory, params, loaderId, customArrayKey) {
+        if (!this.currentEndpoint || !this.currentModelFactory) {
+            this.setEndpoint(endpoint, modelFactory, loaderId, this.isPaginationEnabled, customArrayKey, params);
+            return;
+        }
+        this.currentCustomParams = { ...params };
+        this.loadData(this.currentFilterParams, this.currentPaginationParams, loaderId);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TableDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TableDataService, providedIn: 'root' });
 }
@@ -7031,6 +7054,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
             args: [{ selector: 'core-filter-modal', standalone: true, imports: [CommonModule, TranslateModule, FormsModule, ReactiveFormsModule, DynamicFieldDirective, GenericButtonComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-modal\" [class.is-visible]=\"isOpen()\" [class.is-closing]=\"isClosing()\">\n  <div class=\"c-modal__overlay\" (click)=\"onClose()\"></div>\n  <div class=\"c-modal__holder\">\n    <div class=\"c-modal__header\">\n      <p class=\"c-modal__title\">\n        {{ \"table.filterBy\" | translate }}\n      </p>\n      <core-generic-button\n        [config]=\"closeButtonConfig()\"\n        (buttonClick)=\"onClose()\">\n      </core-generic-button>\n    </div>\n    <div class=\"c-modal__body\">\n      <form class=\"c-entry-group\">\n      @for (filter of visibleFilters(); track filter.key.toString() + '-' + clearTrigger()) {\n        <div coreDynamicField [field]=\"getFieldConfig(filter)\" [value]=\"getFieldValue(filter.key.toString())\"\n          [mode]=\"ModalMode.FILTER\" (valueChange)=\"updateFilter(filter.key.toString(), $event)\">\n        </div>\n      }\n    </form>\n    </div>\n    <div class=\"c-modal__bottom\">\n      <core-generic-button\n        [config]=\"clearButtonConfig()\"\n        (buttonClick)=\"onClear()\">\n      </core-generic-button>\n      <core-generic-button\n        [config]=\"applyButtonConfig()\"\n        (buttonClick)=\"onApply()\">\n      </core-generic-button>\n    </div>\n  </div>\n</div>", styles: [".c-link.disabled{opacity:.5;cursor:not-allowed}\n"] }]
         }], ctorParameters: () => [] });
 
+var SortDirection;
+(function (SortDirection) {
+    SortDirection["ASC"] = "asc";
+    SortDirection["DESC"] = "desc";
+})(SortDirection || (SortDirection = {}));
+
+var SortMode;
+(function (SortMode) {
+    SortMode["MEMORY"] = "memory";
+    SortMode["SERVER"] = "server";
+})(SortMode || (SortMode = {}));
+
 class TableActionService {
     selectedRowsSubject = new BehaviorSubject([]);
     isModalOpenSubject = new BehaviorSubject(false);
@@ -7191,6 +7226,198 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 }]
         }] });
 
+class TableSortService {
+    sortConfigsSubject = new BehaviorSubject([]);
+    tableSortConfig = { mode: SortMode.MEMORY };
+    sortConfigs$ = this.sortConfigsSubject.asObservable();
+    configure(config) {
+        this.tableSortConfig = { ...config };
+        if (!config.multiColumn) {
+            const currentSorts = this.sortConfigsSubject.value;
+            if (currentSorts.length > 1) {
+                const lastSort = currentSorts[currentSorts.length - 1];
+                this.sortConfigsSubject.next([{ ...lastSort, priority: 0 }]);
+            }
+        }
+        if (config.defaultSort && config.defaultSort.length > 0) {
+            if (config.multiColumn) {
+                this.sortConfigsSubject.next([...config.defaultSort]);
+            }
+            else {
+                this.sortConfigsSubject.next([{ ...config.defaultSort[0], priority: 0 }]);
+            }
+        }
+    }
+    getTableSortConfig() {
+        return { ...this.tableSortConfig };
+    }
+    getCurrentSortConfigs() {
+        return [...this.sortConfigsSubject.value];
+    }
+    isColumnSortable(column, row, disabledConfigs = []) {
+        if (!column.sortable) {
+            return false;
+        }
+        if (!row) {
+            return true;
+        }
+        const isDisabled = disabledConfigs.some(config => {
+            if (!config.condition(row)) {
+                return false;
+            }
+            if (!config.columns || config.columns.length === 0) {
+                return true;
+            }
+            return config.columns.includes(column.key);
+        });
+        return !isDisabled;
+    }
+    toggleSort(columnKey) {
+        const currentSorts = this.sortConfigsSubject.value;
+        const existingSort = currentSorts.find(sort => sort.key === columnKey);
+        let newSorts;
+        if (existingSort) {
+            if (existingSort.direction === SortDirection.ASC) {
+                if (this.tableSortConfig.multiColumn) {
+                    newSorts = currentSorts.map(sort => sort.key === columnKey
+                        ? { ...sort, direction: SortDirection.DESC }
+                        : sort);
+                }
+                else {
+                    newSorts = [{ ...existingSort, direction: SortDirection.DESC, priority: 0 }];
+                }
+            }
+            else {
+                newSorts = currentSorts.filter(sort => sort.key !== columnKey);
+            }
+        }
+        else {
+            const newSort = {
+                key: columnKey,
+                direction: SortDirection.ASC,
+                priority: 0
+            };
+            if (this.tableSortConfig.multiColumn) {
+                newSorts = [...currentSorts, { ...newSort, priority: currentSorts.length }];
+            }
+            else {
+                newSorts = [newSort];
+            }
+        }
+        newSorts = newSorts.map((sort, index) => ({
+            ...sort,
+            priority: index
+        }));
+        this.sortConfigsSubject.next(newSorts);
+    }
+    setSortConfigs(sortConfigs) {
+        const validSorts = sortConfigs.map((sort, index) => ({
+            ...sort,
+            priority: index
+        }));
+        this.sortConfigsSubject.next(validSorts);
+    }
+    clearSort() {
+        this.sortConfigsSubject.next([]);
+    }
+    getColumnSortState(columnKey) {
+        const sortConfig = this.sortConfigsSubject.value.find(sort => sort.key === columnKey);
+        return sortConfig ? sortConfig.direction : null;
+    }
+    getColumnSortPriority(columnKey) {
+        const sortConfig = this.sortConfigsSubject.value.find(sort => sort.key === columnKey);
+        return sortConfig?.priority ?? null;
+    }
+    sortDataInMemory(data, columns) {
+        const sortConfigs = this.sortConfigsSubject.value;
+        if (sortConfigs.length === 0) {
+            return [...data];
+        }
+        return [...data].sort((a, b) => {
+            if (this.tableSortConfig.customSortFunction) {
+                return this.tableSortConfig.customSortFunction(a, b, sortConfigs);
+            }
+            for (const sortConfig of sortConfigs.sort((x, y) => (x.priority ?? 0) - (y.priority ?? 0))) {
+                const column = columns.find(col => col.key === sortConfig.key || col.sortKey === sortConfig.key);
+                let result = 0;
+                if (column?.sortFunction) {
+                    result = column.sortFunction(a, b);
+                }
+                else {
+                    const key = column?.sortKey || sortConfig.key;
+                    const valueA = this.getNestedValue(a, key);
+                    const valueB = this.getNestedValue(b, key);
+                    result = this.compareValues(valueA, valueB);
+                }
+                if (result !== 0) {
+                    return sortConfig.direction === SortDirection.ASC ? result : -result;
+                }
+            }
+            return 0;
+        });
+    }
+    generateServerSortParams() {
+        const sortConfigs = this.sortConfigsSubject.value;
+        if (sortConfigs.length === 0) {
+            return {};
+        }
+        const paramName = this.tableSortConfig.serverSortParam || 'sort';
+        if (this.tableSortConfig.multiColumn) {
+            const params = {};
+            sortConfigs
+                .sort((a, b) => (a.priority ?? 0) - (b.priority ?? 0))
+                .forEach(sort => {
+                params[`${paramName}[${sort.key}]`] = sort.direction;
+            });
+            return params;
+        }
+        else {
+            const firstSort = sortConfigs[0];
+            return {
+                [`${paramName}[${firstSort.key}]`]: firstSort.direction
+            };
+        }
+    }
+    isServerMode() {
+        return this.tableSortConfig.mode === SortMode.SERVER;
+    }
+    isMultiColumnEnabled() {
+        return this.tableSortConfig.multiColumn ?? false;
+    }
+    getNestedValue(obj, path) {
+        return path.split('.').reduce((value, key) => {
+            return value && value[key] !== undefined ? value[key] : null;
+        }, obj);
+    }
+    compareValues(a, b) {
+        if (a === null || a === undefined)
+            return b === null || b === undefined ? 0 : -1;
+        if (b === null || b === undefined)
+            return 1;
+        if (typeof a === 'number' && typeof b === 'number') {
+            return a - b;
+        }
+        if (a instanceof Date && b instanceof Date) {
+            return a.getTime() - b.getTime();
+        }
+        const strA = String(a).toLowerCase();
+        const strB = String(b).toLowerCase();
+        return strA.localeCompare(strB);
+    }
+    reset() {
+        this.sortConfigsSubject.next([]);
+        this.tableSortConfig = { mode: SortMode.MEMORY };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TableSortService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TableSortService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: TableSortService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 var HeaderElementType;
 (function (HeaderElementType) {
     HeaderElementType["GLOBAL_ACTIONS"] = "globalActions";
@@ -7918,11 +8145,13 @@ class GenericTableComponent {
     dropdownService = inject(DropdownService);
     headerService = inject(HeaderService);
     inlineEditService = inject((InlineEditService));
+    tableSortService = inject(TableSortService);
     activeFiltersEventService = inject(ActiveFiltersEventService);
     TableAction = TableAction;
     ModalMode = ModalMode;
     ButtonType = ButtonType;
     FieldType = FieldType;
+    SortDirection = SortDirection;
     tableId = `table-${Math.random().toString(36).substring(2, 9)}`;
     columns = input.required();
     modalFields = input([]);
@@ -7955,6 +8184,7 @@ class GenericTableComponent {
     headerOrder = input(undefined);
     showActiveFilters = input(false);
     activeFiltersConfig = input({});
+    sortConfig = input(undefined);
     customEdit = input();
     customDelete = input();
     customView = input();
@@ -8124,6 +8354,18 @@ class GenericTableComponent {
         if (this.isInitialized) {
             return;
         }
+        if (this.sortConfig()) {
+            if (!this.sortConfig().multiColumn) {
+                const currentSorts = this.tableSortService.getCurrentSortConfigs();
+                if (currentSorts.length > 1) {
+                    this.tableSortService.clearSort();
+                }
+            }
+            this.tableSortService.configure(this.sortConfig());
+        }
+        this.subscriptions.push(this.tableSortService.sortConfigs$.subscribe(() => {
+            this.handleSortChange();
+        }));
         this.currentFilterValues.set(new Map(this.filterService.getCustomFilters()));
         this.loaderService.showLoader(this.MAIN_DATA_LOADER_ID);
         this.startLoaderTimeout(this.MAIN_DATA_LOADER_ID);
@@ -8996,6 +9238,91 @@ class GenericTableComponent {
             createButtonConfig: this.createButtonConfig(),
         });
     }
+    onColumnHeaderClick(column) {
+        if (!this.isColumnSortable(column)) {
+            return;
+        }
+        const sortKey = column.sortKey || column.key;
+        this.tableSortService.toggleSort(sortKey);
+    }
+    isColumnSortable(column) {
+        const firstRow = this.displayedData()[0] || null;
+        return this.tableSortService.isColumnSortable(column, firstRow, this.columnDisabledConfigs());
+    }
+    getColumnSortState(column) {
+        const sortKey = column.sortKey || column.key;
+        return this.tableSortService.getColumnSortState(sortKey);
+    }
+    getColumnSortPriority(column) {
+        const sortKey = column.sortKey || column.key;
+        return this.tableSortService.getColumnSortPriority(sortKey);
+    }
+    isMultiColumnSortEnabled() {
+        return this.tableSortService.isMultiColumnEnabled();
+    }
+    getSortButtonTitle(column) {
+        const sortState = this.getColumnSortState(column);
+        const priority = this.getColumnSortPriority(column);
+        if (!sortState) {
+            return `Ordenar por ${column.label}`;
+        }
+        const direction = sortState === SortDirection.ASC ? 'ascendente' : 'descendente';
+        const priorityText = this.isMultiColumnSortEnabled() && priority !== null
+            ? ` (prioridad ${priority + 1})`
+            : '';
+        return `Ordenado por ${column.label} ${direction}${priorityText}. Click para cambiar.`;
+    }
+    handleSortChange() {
+        if (this.tableSortService.isServerMode()) {
+            this.reloadDataWithCurrentParams();
+        }
+        else {
+            this.applySortingInMemory();
+        }
+    }
+    applySortingInMemory() {
+        if (this.endpoint()) {
+            const currentData = this.tableDataService.getCurrentData();
+            if (currentData && Array.isArray(currentData)) {
+                const sortedData = this.tableSortService.sortDataInMemory(currentData, this.columns());
+                this.tableDataService.updateData(sortedData);
+            }
+        }
+        else {
+            const inputData = this.dataInput();
+            if (inputData && inputData.length > 0) {
+                const sortedData = this.tableSortService.sortDataInMemory(inputData, this.columns());
+                this.processDataInput(sortedData);
+            }
+        }
+    }
+    reloadDataWithCurrentParams() {
+        if (!this.endpoint() || !this.modelFactory()) {
+            return;
+        }
+        const filterParams = this.getFilterParams();
+        const sortParams = this.tableSortService.generateServerSortParams();
+        const paginationParams = this.enablePagination()
+            ? this.paginationService.getCurrentPaginationParams(this.tableId)
+            : {};
+        const allParams = {
+            ...this.customParams(),
+            ...filterParams,
+            ...sortParams,
+            ...paginationParams
+        };
+        this.tableDataService.loadDataWithParams(this.endpoint(), this.modelFactory(), allParams, this.MAIN_DATA_LOADER_ID, this.customArrayKey());
+    }
+    getFilterParams() {
+        const filterValues = this.currentFilterValues();
+        const params = {};
+        filterValues.forEach((value, key) => {
+            if (value !== undefined && value !== null && value !== '') {
+                params[key] = value;
+            }
+        });
+        return params;
+    }
     ngOnDestroy() {
         this.subscriptions.forEach(sub => sub.unsubscribe());
         this.inlineEditService.destroy();
@@ -9281,7 +9608,7 @@ class GenericTableComponent {
         this.tableDataService.updateRowData(rowId, updatedFields, updateFunction);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericTableComponent, isStandalone: true, selector: "core-generic-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, modalFields: { classPropertyName: "modalFields", publicName: "modalFields", isSignal: true, isRequired: false, transformFunction: null }, modalTabs: { classPropertyName: "modalTabs", publicName: "modalTabs", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: true, transformFunction: null }, customActions: { classPropertyName: "customActions", publicName: "customActions", isSignal: true, isRequired: false, transformFunction: null }, globalActions: { classPropertyName: "globalActions", publicName: "globalActions", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showSelection: { classPropertyName: "showSelection", publicName: "showSelection", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, filterButtonConfig: { classPropertyName: "filterButtonConfig", publicName: "filterButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonConfig: { classPropertyName: "createButtonConfig", publicName: "createButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, dataInput: { classPropertyName: "dataInput", publicName: "dataInput", isSignal: true, isRequired: false, transformFunction: null }, customFilters: { classPropertyName: "customFilters", publicName: "customFilters", isSignal: true, isRequired: false, transformFunction: null }, enablePagination: { classPropertyName: "enablePagination", publicName: "enablePagination", isSignal: true, isRequired: false, transformFunction: null }, modelFactory: { classPropertyName: "modelFactory", publicName: "modelFactory", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: false, transformFunction: null }, customParams: { classPropertyName: "customParams", publicName: "customParams", isSignal: true, isRequired: false, transformFunction: null }, customArrayKey: { classPropertyName: "customArrayKey", publicName: "customArrayKey", isSignal: true, isRequired: false, transformFunction: null }, listTitle: { classPropertyName: "listTitle", publicName: "listTitle", isSignal: true, isRequired: false, transformFunction: null }, moreData: { classPropertyName: "moreData", publicName: "moreData", isSignal: true, isRequired: false, transformFunction: null }, inModal: { classPropertyName: "inModal", publicName: "inModal", isSignal: true, isRequired: false, transformFunction: null }, expansionConfig: { classPropertyName: "expansionConfig", publicName: "expansionConfig", isSignal: true, isRequired: false, transformFunction: null }, fileUploadConfig: { classPropertyName: "fileUploadConfig", publicName: "fileUploadConfig", isSignal: true, isRequired: false, transformFunction: null }, rowStyleConfigs: { classPropertyName: "rowStyleConfigs", publicName: "rowStyleConfigs", isSignal: true, isRequired: false, transformFunction: null }, columnDisabledConfigs: { classPropertyName: "columnDisabledConfigs", publicName: "columnDisabledConfigs", isSignal: true, isRequired: false, transformFunction: null }, rowVisibilityConfigs: { classPropertyName: "rowVisibilityConfigs", publicName: "rowVisibilityConfigs", isSignal: true, isRequired: false, transformFunction: null }, headerOrder: { classPropertyName: "headerOrder", publicName: "headerOrder", isSignal: true, isRequired: false, transformFunction: null }, showActiveFilters: { classPropertyName: "showActiveFilters", publicName: "showActiveFilters", isSignal: true, isRequired: false, transformFunction: null }, activeFiltersConfig: { classPropertyName: "activeFiltersConfig", publicName: "activeFiltersConfig", isSignal: true, isRequired: false, transformFunction: null }, customEdit: { classPropertyName: "customEdit", publicName: "customEdit", isSignal: true, isRequired: false, transformFunction: null }, customDelete: { classPropertyName: "customDelete", publicName: "customDelete", isSignal: true, isRequired: false, transformFunction: null }, customView: { classPropertyName: "customView", publicName: "customView", isSignal: true, isRequired: false, transformFunction: null }, customSave: { classPropertyName: "customSave", publicName: "customSave", isSignal: true, isRequired: false, transformFunction: null }, useCustomSave: { classPropertyName: "useCustomSave", publicName: "useCustomSave", isSignal: true, isRequired: false, transformFunction: null }, onApiError: { classPropertyName: "onApiError", publicName: "onApiError", isSignal: true, isRequired: false, transformFunction: null }, inlineEditConfig: { classPropertyName: "inlineEditConfig", publicName: "inlineEditConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", selectionChanged: "selectionChanged", dataCreated: "dataCreated", dataUpdated: "dataUpdated", dataDeleted: "dataDeleted", dataFetched: "dataFetched", onMoreDataLoaded: "onMoreDataLoaded", globalActionTriggered: "globalActionTriggered", modalData: "modalData", beforeSave: "beforeSave", onFilterChange: "onFilterChange", onClearFilters: "onClearFilters", activeFilterRemoved: "activeFilterRemoved", activeFiltersCleared: "activeFiltersCleared", inlineEditSave: "inlineEditSave", inlineEditModeChanged: "inlineEditModeChanged", inlineEditValidationError: "inlineEditValidationError" }, host: { listeners: { "window:beforeunload": "onBeforeUnload($event)", "document:click": "closeSubmenu()" } }, providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], viewQueries: [{ propertyName: "sentinel", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (showActiveFilters()) {\n  <core-active-filters\n    [activeFilters]=\"currentActiveFilters()\"\n    [config]=\"activeFiltersConfig()\"\n    (onFilterRemove)=\"onActiveFilterRemove($event)\"\n    (onClearAll)=\"onActiveFiltersClear()\">\n  </core-active-filters>\n}\n\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n  <table>\n    <thead>\n      <tr>\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <th class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n        </th>\n        }\n        @for (column of columns(); track $index) {\n        <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n          @if (column.sortable !== false) {\n          <!-- \u2705 Solcre: Agregado [title] din\u00E1mico y capacidad de volver al estado sin selecci\u00F3n -->\n          <button class=\"c-table-order\" tabindex=\"-1\"\n            [class.is-asc]=\"currentSortColumn() === column.key && currentSortDirection() === 'asc'\"\n            [class.is-desc]=\"currentSortColumn() === column.key && currentSortDirection() === 'desc'\"\n            [title]=\"getSortTitle(column) | translate\" (click)=\"sortData(column)\">\n            {{ column.label | translate }}\n            <span class=\"c-table-order__controls\">\n              <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n              <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n            </span>\n          </button>\n          <!-- <button \n                class=\"c-table__order\" \n                [class.is-asc]=\"currentSortColumn() === column.key && currentSortDirection() === 'asc'\" \n                [class.is-desc]=\"currentSortColumn() === column.key && currentSortDirection() === 'desc'\"\n                (click)=\"sortData(column)\">\n                {{ column.label | translate }}\n                <span class=\"icon-order-arrow\"></span>\n              </button> -->\n          } @else {\n          {{ column.label | translate }}\n          }\n        </th>\n        }\n        @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n        <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of displayedData(); track row.getId()) {\n      <tr [ngClass]=\"getRowClasses(row)\" \n          [class.is-editing-inline]=\"isRowInEditMode(row.getId())\"\n          [class.is-disabled]=\"isRowDisabled(row)\">\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <td class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n        </td>\n        }\n        @for (column of columns(); track $index) {\n        <td [attr.data-label]=\"column.label | translate\" \n            [ngClass]=\"[\n              column.align ? 'u-align-' + column.align : '',\n              getCellDisabledClasses(row, column)\n            ]\" \n            [class.is-editing]=\"isColumnEditable(column, row)\"\n            [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n          @if (column.template) {\n          <!-- Todo: Ver qu\u00E9 es esto -->\n            <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n          } @else if (isColumnEditable(column, row)) {\n            <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n            <div class=\"c-table__inline-edit\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n              <div\n                coreDynamicField\n                [field]=\"getInlineEditableConfigWithState(row, column)!\"\n                [value]=\"getEditingValue(row, column)\"\n                [mode]=\"ModalMode.EDIT\"\n                [errors]=\"getCellErrors(row, column)\"\n                [rowData]=\"row\"\n                (valueChange)=\"onCellValueChange(row, column, $event)\"\n                (onBlurEvent)=\"onCellBlur(row, column)\"\n                (onEnterEvent)=\"onCellEnter(row, column)\"\n              ></div>\n            </div>\n          } @else {\n            <div class=\"c-table__content\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n              column) }}\n            </div>\n          }\n        </td>\n        }\n\n        <!-- Actions-->\n\n        @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n        <td class=\"u-align-right\">\n          <div class=\"c-table__actions\">\n            <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"extraDefaultActions()\"\n                [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n                [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n                (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n                (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n              </core-dropdown>\n            @for (actionConfig of regularDefaultActions(); track actionConfig.action) {\n              @if (hasPermission(actionConfig)) {\n                @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n                actionConfig.action === TableAction.DELETE) {\n                  <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig)\"\n                    (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n                  </core-generic-button>\n                }\n              }\n            }\n            @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n              @if (hasPermission(customAction)) {\n                <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n                  (buttonClick)=\"onButtonClick($event, customAction, row)\">\n                </core-generic-button>\n              }\n            }\n\n            @if (hasExtraActionsForRow(row)) {\n              <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n                (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n              </core-generic-button>\n            }\n\n            @if (expansionConfig()?.enabled) {\n              <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n              <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n              </core-generic-button>\n            }\n\n          </div> <!-- .c-table__actions -->\n        </td> <!-- td parent of .c-table__actions -->\n        } <!-- @if (showActions() -->\n\n\n      </tr>\n      @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n        <!-- Todo: Ver que es esto -->\n        <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n          <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n            <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n        </tr>\n      }\n      } @empty {\n        <tr>\n          <!-- Todo: Estilo .no-data -->\n          <td [attr.colspan]=\"displayedColumns().length\">\n            <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<core-generic-pagination [tableId]=\"tableId\"></core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n  [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n  [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n  (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n  (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n  (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".in-modal .c-table thead th:last-child,.c-table tbody td:last-child{text-align:left}.c-table__order-btn--asc{transform:rotate(180deg)}.c-table__order-btn--desc{transform:rotate(0)}.c-table tr.is-editing-inline{background-color:#fff3cd;border-left:3px solid #ffc107}.c-table tr.is-editing-inline td{background-color:#fff3cd}.c-table tr.is-editing-inline:hover td{background-color:#ffecb5}.expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "title", "isMultiple", "customTemplate", "customViewTemplate", "buttonConfig", "modelFactory", "errors", "validators"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: GenericPaginationComponent, selector: "core-generic-pagination", inputs: ["tableId", "isServerSide"] }, { kind: "component", type: DropdownComponent, selector: "core-dropdown", inputs: ["rowId", "triggerElementId", "extraDefaultActions", "extraCustomActions", "row"], outputs: ["actionTriggered", "customActionTriggered"] }, { kind: "component", type: FilterModalComponent, selector: "core-filter-modal", inputs: ["isOpen", "filters", "currentFilterValues"], outputs: ["close", "filterChange", "clearFilters", "globalFilterChange"] }, { kind: "component", type: GenericButtonComponent, selector: "core-generic-button", inputs: ["config", "data"], outputs: ["buttonClick"] }, { kind: "directive", type: DynamicFieldDirective, selector: "[coreDynamicField]", inputs: ["field", "value", "mode", "errors", "rowData", "formValue"], outputs: ["valueChange", "onBlurEvent", "onEnterEvent", "selectionChange"] }, { kind: "component", type: ActiveFiltersComponent, selector: "core-active-filters", inputs: ["activeFilters", "config"], outputs: ["onFilterRemove", "onClearAll"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericTableComponent, isStandalone: true, selector: "core-generic-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, modalFields: { classPropertyName: "modalFields", publicName: "modalFields", isSignal: true, isRequired: false, transformFunction: null }, modalTabs: { classPropertyName: "modalTabs", publicName: "modalTabs", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: true, transformFunction: null }, customActions: { classPropertyName: "customActions", publicName: "customActions", isSignal: true, isRequired: false, transformFunction: null }, globalActions: { classPropertyName: "globalActions", publicName: "globalActions", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showSelection: { classPropertyName: "showSelection", publicName: "showSelection", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, filterButtonConfig: { classPropertyName: "filterButtonConfig", publicName: "filterButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonConfig: { classPropertyName: "createButtonConfig", publicName: "createButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, dataInput: { classPropertyName: "dataInput", publicName: "dataInput", isSignal: true, isRequired: false, transformFunction: null }, customFilters: { classPropertyName: "customFilters", publicName: "customFilters", isSignal: true, isRequired: false, transformFunction: null }, enablePagination: { classPropertyName: "enablePagination", publicName: "enablePagination", isSignal: true, isRequired: false, transformFunction: null }, modelFactory: { classPropertyName: "modelFactory", publicName: "modelFactory", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: false, transformFunction: null }, customParams: { classPropertyName: "customParams", publicName: "customParams", isSignal: true, isRequired: false, transformFunction: null }, customArrayKey: { classPropertyName: "customArrayKey", publicName: "customArrayKey", isSignal: true, isRequired: false, transformFunction: null }, listTitle: { classPropertyName: "listTitle", publicName: "listTitle", isSignal: true, isRequired: false, transformFunction: null }, moreData: { classPropertyName: "moreData", publicName: "moreData", isSignal: true, isRequired: false, transformFunction: null }, inModal: { classPropertyName: "inModal", publicName: "inModal", isSignal: true, isRequired: false, transformFunction: null }, expansionConfig: { classPropertyName: "expansionConfig", publicName: "expansionConfig", isSignal: true, isRequired: false, transformFunction: null }, fileUploadConfig: { classPropertyName: "fileUploadConfig", publicName: "fileUploadConfig", isSignal: true, isRequired: false, transformFunction: null }, rowStyleConfigs: { classPropertyName: "rowStyleConfigs", publicName: "rowStyleConfigs", isSignal: true, isRequired: false, transformFunction: null }, columnDisabledConfigs: { classPropertyName: "columnDisabledConfigs", publicName: "columnDisabledConfigs", isSignal: true, isRequired: false, transformFunction: null }, rowVisibilityConfigs: { classPropertyName: "rowVisibilityConfigs", publicName: "rowVisibilityConfigs", isSignal: true, isRequired: false, transformFunction: null }, headerOrder: { classPropertyName: "headerOrder", publicName: "headerOrder", isSignal: true, isRequired: false, transformFunction: null }, showActiveFilters: { classPropertyName: "showActiveFilters", publicName: "showActiveFilters", isSignal: true, isRequired: false, transformFunction: null }, activeFiltersConfig: { classPropertyName: "activeFiltersConfig", publicName: "activeFiltersConfig", isSignal: true, isRequired: false, transformFunction: null }, sortConfig: { classPropertyName: "sortConfig", publicName: "sortConfig", isSignal: true, isRequired: false, transformFunction: null }, customEdit: { classPropertyName: "customEdit", publicName: "customEdit", isSignal: true, isRequired: false, transformFunction: null }, customDelete: { classPropertyName: "customDelete", publicName: "customDelete", isSignal: true, isRequired: false, transformFunction: null }, customView: { classPropertyName: "customView", publicName: "customView", isSignal: true, isRequired: false, transformFunction: null }, customSave: { classPropertyName: "customSave", publicName: "customSave", isSignal: true, isRequired: false, transformFunction: null }, useCustomSave: { classPropertyName: "useCustomSave", publicName: "useCustomSave", isSignal: true, isRequired: false, transformFunction: null }, onApiError: { classPropertyName: "onApiError", publicName: "onApiError", isSignal: true, isRequired: false, transformFunction: null }, inlineEditConfig: { classPropertyName: "inlineEditConfig", publicName: "inlineEditConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", selectionChanged: "selectionChanged", dataCreated: "dataCreated", dataUpdated: "dataUpdated", dataDeleted: "dataDeleted", dataFetched: "dataFetched", onMoreDataLoaded: "onMoreDataLoaded", globalActionTriggered: "globalActionTriggered", modalData: "modalData", beforeSave: "beforeSave", onFilterChange: "onFilterChange", onClearFilters: "onClearFilters", activeFilterRemoved: "activeFilterRemoved", activeFiltersCleared: "activeFiltersCleared", inlineEditSave: "inlineEditSave", inlineEditModeChanged: "inlineEditModeChanged", inlineEditValidationError: "inlineEditValidationError" }, host: { listeners: { "window:beforeunload": "onBeforeUnload($event)", "document:click": "closeSubmenu()" } }, providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], viewQueries: [{ propertyName: "sentinel", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (showActiveFilters()) {\n  <core-active-filters\n    [activeFilters]=\"currentActiveFilters()\"\n    [config]=\"activeFiltersConfig()\"\n    (onFilterRemove)=\"onActiveFilterRemove($event)\"\n    (onClearAll)=\"onActiveFiltersClear()\">\n  </core-active-filters>\n}\n\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n  <table>\n    <thead>\n      <tr>\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <th class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n        </th>\n        }\n        @for (column of columns(); track $index) {\n        <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n          @if (isColumnSortable(column)) {\n          <button class=\"c-table-order\" tabindex=\"-1\"\n            [class.is-asc]=\"getColumnSortState(column) === SortDirection.ASC\"\n            [class.is-desc]=\"getColumnSortState(column) === SortDirection.DESC\"\n            [class.has-multiple-sorts]=\"isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null\"\n            [title]=\"getSortButtonTitle(column)\"\n            (click)=\"onColumnHeaderClick(column)\">\n            {{ column.label | translate }}\n            <!-- @if (isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null) {\n              <span class=\"c-table-order__priority\">{{ getColumnSortPriority(column)! + 1 }}</span>\n            } -->\n            <span class=\"c-table-order__controls\">\n              <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n              <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n            </span>\n          </button>\n          } @else {\n          {{ column.label | translate }}\n          }\n        </th>\n        }\n        @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n        <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of displayedData(); track row.getId()) {\n      <tr [ngClass]=\"getRowClasses(row)\" \n          [class.is-editing-inline]=\"isRowInEditMode(row.getId())\"\n          [class.is-disabled]=\"isRowDisabled(row)\">\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <td class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n        </td>\n        }\n        @for (column of columns(); track $index) {\n        <td [attr.data-label]=\"column.label | translate\" \n            [ngClass]=\"[\n              column.align ? 'u-align-' + column.align : '',\n              getCellDisabledClasses(row, column)\n            ]\" \n            [class.is-editing]=\"isColumnEditable(column, row)\"\n            [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n          @if (column.template) {\n          <!-- Todo: Ver qu\u00E9 es esto -->\n            <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n          } @else if (isColumnEditable(column, row)) {\n            <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n            <div class=\"c-table__inline-edit\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n              <div\n                coreDynamicField\n                [field]=\"getInlineEditableConfigWithState(row, column)!\"\n                [value]=\"getEditingValue(row, column)\"\n                [mode]=\"ModalMode.EDIT\"\n                [errors]=\"getCellErrors(row, column)\"\n                [rowData]=\"row\"\n                (valueChange)=\"onCellValueChange(row, column, $event)\"\n                (onBlurEvent)=\"onCellBlur(row, column)\"\n                (onEnterEvent)=\"onCellEnter(row, column)\"\n              ></div>\n            </div>\n          } @else {\n            <div class=\"c-table__content\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n              column) }}\n            </div>\n          }\n        </td>\n        }\n\n        <!-- Actions-->\n\n        @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n        <td class=\"u-align-right\">\n          <div class=\"c-table__actions\">\n            <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"extraDefaultActions()\"\n                [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n                [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n                (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n                (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n              </core-dropdown>\n            @for (actionConfig of regularDefaultActions(); track actionConfig.action) {\n              @if (hasPermission(actionConfig)) {\n                @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n                actionConfig.action === TableAction.DELETE) {\n                  <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig)\"\n                    (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n                  </core-generic-button>\n                }\n              }\n            }\n            @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n              @if (hasPermission(customAction)) {\n                <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n                  (buttonClick)=\"onButtonClick($event, customAction, row)\">\n                </core-generic-button>\n              }\n            }\n\n            @if (hasExtraActionsForRow(row)) {\n              <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n                (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n              </core-generic-button>\n            }\n\n            @if (expansionConfig()?.enabled) {\n              <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n              <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n              </core-generic-button>\n            }\n\n          </div> <!-- .c-table__actions -->\n        </td> <!-- td parent of .c-table__actions -->\n        } <!-- @if (showActions() -->\n\n\n      </tr>\n      @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n        <!-- Todo: Ver que es esto -->\n        <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n          <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n            <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n        </tr>\n      }\n      } @empty {\n        <tr>\n          <!-- Todo: Estilo .no-data -->\n          <td [attr.colspan]=\"displayedColumns().length\">\n            <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<core-generic-pagination [tableId]=\"tableId\"></core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n  [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n  [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n  (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n  (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n  (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".in-modal .c-table thead th:last-child,.c-table tbody td:last-child{text-align:left}.c-table__order-btn--asc{transform:rotate(180deg)}.c-table__order-btn--desc{transform:rotate(0)}.c-table tr.is-editing-inline{background-color:#fff3cd;border-left:3px solid #ffc107}.c-table tr.is-editing-inline td{background-color:#fff3cd}.c-table tr.is-editing-inline:hover td{background-color:#ffecb5}.expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "title", "isMultiple", "customTemplate", "customViewTemplate", "buttonConfig", "modelFactory", "errors", "validators"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: GenericPaginationComponent, selector: "core-generic-pagination", inputs: ["tableId", "isServerSide"] }, { kind: "component", type: DropdownComponent, selector: "core-dropdown", inputs: ["rowId", "triggerElementId", "extraDefaultActions", "extraCustomActions", "row"], outputs: ["actionTriggered", "customActionTriggered"] }, { kind: "component", type: FilterModalComponent, selector: "core-filter-modal", inputs: ["isOpen", "filters", "currentFilterValues"], outputs: ["close", "filterChange", "clearFilters", "globalFilterChange"] }, { kind: "component", type: GenericButtonComponent, selector: "core-generic-button", inputs: ["config", "data"], outputs: ["buttonClick"] }, { kind: "directive", type: DynamicFieldDirective, selector: "[coreDynamicField]", inputs: ["field", "value", "mode", "errors", "rowData", "formValue"], outputs: ["valueChange", "onBlurEvent", "onEnterEvent", "selectionChange"] }, { kind: "component", type: ActiveFiltersComponent, selector: "core-active-filters", inputs: ["activeFilters", "config"], outputs: ["onFilterRemove", "onClearAll"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericTableComponent, decorators: [{
             type: Component,
@@ -9295,7 +9622,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                         GenericButtonComponent,
                         DynamicFieldDirective,
                         ActiveFiltersComponent,
-                    ], hostDirectives: [CoreHostDirective], providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], template: "@if (showActiveFilters()) {\n  <core-active-filters\n    [activeFilters]=\"currentActiveFilters()\"\n    [config]=\"activeFiltersConfig()\"\n    (onFilterRemove)=\"onActiveFilterRemove($event)\"\n    (onClearAll)=\"onActiveFiltersClear()\">\n  </core-active-filters>\n}\n\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n  <table>\n    <thead>\n      <tr>\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <th class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n        </th>\n        }\n        @for (column of columns(); track $index) {\n        <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n          @if (column.sortable !== false) {\n          <!-- \u2705 Solcre: Agregado [title] din\u00E1mico y capacidad de volver al estado sin selecci\u00F3n -->\n          <button class=\"c-table-order\" tabindex=\"-1\"\n            [class.is-asc]=\"currentSortColumn() === column.key && currentSortDirection() === 'asc'\"\n            [class.is-desc]=\"currentSortColumn() === column.key && currentSortDirection() === 'desc'\"\n            [title]=\"getSortTitle(column) | translate\" (click)=\"sortData(column)\">\n            {{ column.label | translate }}\n            <span class=\"c-table-order__controls\">\n              <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n              <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n            </span>\n          </button>\n          <!-- <button \n                class=\"c-table__order\" \n                [class.is-asc]=\"currentSortColumn() === column.key && currentSortDirection() === 'asc'\" \n                [class.is-desc]=\"currentSortColumn() === column.key && currentSortDirection() === 'desc'\"\n                (click)=\"sortData(column)\">\n                {{ column.label | translate }}\n                <span class=\"icon-order-arrow\"></span>\n              </button> -->\n          } @else {\n          {{ column.label | translate }}\n          }\n        </th>\n        }\n        @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n        <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of displayedData(); track row.getId()) {\n      <tr [ngClass]=\"getRowClasses(row)\" \n          [class.is-editing-inline]=\"isRowInEditMode(row.getId())\"\n          [class.is-disabled]=\"isRowDisabled(row)\">\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <td class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n        </td>\n        }\n        @for (column of columns(); track $index) {\n        <td [attr.data-label]=\"column.label | translate\" \n            [ngClass]=\"[\n              column.align ? 'u-align-' + column.align : '',\n              getCellDisabledClasses(row, column)\n            ]\" \n            [class.is-editing]=\"isColumnEditable(column, row)\"\n            [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n          @if (column.template) {\n          <!-- Todo: Ver qu\u00E9 es esto -->\n            <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n          } @else if (isColumnEditable(column, row)) {\n            <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n            <div class=\"c-table__inline-edit\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n              <div\n                coreDynamicField\n                [field]=\"getInlineEditableConfigWithState(row, column)!\"\n                [value]=\"getEditingValue(row, column)\"\n                [mode]=\"ModalMode.EDIT\"\n                [errors]=\"getCellErrors(row, column)\"\n                [rowData]=\"row\"\n                (valueChange)=\"onCellValueChange(row, column, $event)\"\n                (onBlurEvent)=\"onCellBlur(row, column)\"\n                (onEnterEvent)=\"onCellEnter(row, column)\"\n              ></div>\n            </div>\n          } @else {\n            <div class=\"c-table__content\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n              column) }}\n            </div>\n          }\n        </td>\n        }\n\n        <!-- Actions-->\n\n        @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n        <td class=\"u-align-right\">\n          <div class=\"c-table__actions\">\n            <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"extraDefaultActions()\"\n                [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n                [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n                (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n                (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n              </core-dropdown>\n            @for (actionConfig of regularDefaultActions(); track actionConfig.action) {\n              @if (hasPermission(actionConfig)) {\n                @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n                actionConfig.action === TableAction.DELETE) {\n                  <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig)\"\n                    (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n                  </core-generic-button>\n                }\n              }\n            }\n            @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n              @if (hasPermission(customAction)) {\n                <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n                  (buttonClick)=\"onButtonClick($event, customAction, row)\">\n                </core-generic-button>\n              }\n            }\n\n            @if (hasExtraActionsForRow(row)) {\n              <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n                (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n              </core-generic-button>\n            }\n\n            @if (expansionConfig()?.enabled) {\n              <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n              <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n              </core-generic-button>\n            }\n\n          </div> <!-- .c-table__actions -->\n        </td> <!-- td parent of .c-table__actions -->\n        } <!-- @if (showActions() -->\n\n\n      </tr>\n      @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n        <!-- Todo: Ver que es esto -->\n        <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n          <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n            <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n        </tr>\n      }\n      } @empty {\n        <tr>\n          <!-- Todo: Estilo .no-data -->\n          <td [attr.colspan]=\"displayedColumns().length\">\n            <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<core-generic-pagination [tableId]=\"tableId\"></core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n  [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n  [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n  (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n  (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n  (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".in-modal .c-table thead th:last-child,.c-table tbody td:last-child{text-align:left}.c-table__order-btn--asc{transform:rotate(180deg)}.c-table__order-btn--desc{transform:rotate(0)}.c-table tr.is-editing-inline{background-color:#fff3cd;border-left:3px solid #ffc107}.c-table tr.is-editing-inline td{background-color:#fff3cd}.c-table tr.is-editing-inline:hover td{background-color:#ffecb5}.expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}\n"] }]
+                    ], hostDirectives: [CoreHostDirective], providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], template: "@if (showActiveFilters()) {\n  <core-active-filters\n    [activeFilters]=\"currentActiveFilters()\"\n    [config]=\"activeFiltersConfig()\"\n    (onFilterRemove)=\"onActiveFilterRemove($event)\"\n    (onClearAll)=\"onActiveFiltersClear()\">\n  </core-active-filters>\n}\n\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n  <table>\n    <thead>\n      <tr>\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <th class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n        </th>\n        }\n        @for (column of columns(); track $index) {\n        <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n          @if (isColumnSortable(column)) {\n          <button class=\"c-table-order\" tabindex=\"-1\"\n            [class.is-asc]=\"getColumnSortState(column) === SortDirection.ASC\"\n            [class.is-desc]=\"getColumnSortState(column) === SortDirection.DESC\"\n            [class.has-multiple-sorts]=\"isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null\"\n            [title]=\"getSortButtonTitle(column)\"\n            (click)=\"onColumnHeaderClick(column)\">\n            {{ column.label | translate }}\n            <!-- @if (isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null) {\n              <span class=\"c-table-order__priority\">{{ getColumnSortPriority(column)! + 1 }}</span>\n            } -->\n            <span class=\"c-table-order__controls\">\n              <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n              <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n            </span>\n          </button>\n          } @else {\n          {{ column.label | translate }}\n          }\n        </th>\n        }\n        @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n        <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of displayedData(); track row.getId()) {\n      <tr [ngClass]=\"getRowClasses(row)\" \n          [class.is-editing-inline]=\"isRowInEditMode(row.getId())\"\n          [class.is-disabled]=\"isRowDisabled(row)\">\n        @if (showSelection()) {\n        <!-- Todo: Tabla con row selection -->\n        <td class=\"select-column\">\n          <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n        </td>\n        }\n        @for (column of columns(); track $index) {\n        <td [attr.data-label]=\"column.label | translate\" \n            [ngClass]=\"[\n              column.align ? 'u-align-' + column.align : '',\n              getCellDisabledClasses(row, column)\n            ]\" \n            [class.is-editing]=\"isColumnEditable(column, row)\"\n            [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n          @if (column.template) {\n          <!-- Todo: Ver qu\u00E9 es esto -->\n            <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n          } @else if (isColumnEditable(column, row)) {\n            <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n            <div class=\"c-table__inline-edit\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n              <div\n                coreDynamicField\n                [field]=\"getInlineEditableConfigWithState(row, column)!\"\n                [value]=\"getEditingValue(row, column)\"\n                [mode]=\"ModalMode.EDIT\"\n                [errors]=\"getCellErrors(row, column)\"\n                [rowData]=\"row\"\n                (valueChange)=\"onCellValueChange(row, column, $event)\"\n                (onBlurEvent)=\"onCellBlur(row, column)\"\n                (onEnterEvent)=\"onCellEnter(row, column)\"\n              ></div>\n            </div>\n          } @else {\n            <div class=\"c-table__content\">\n              <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n              column) }}\n            </div>\n          }\n        </td>\n        }\n\n        <!-- Actions-->\n\n        @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n        <td class=\"u-align-right\">\n          <div class=\"c-table__actions\">\n            <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"extraDefaultActions()\"\n                [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n                [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n                (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n                (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n              </core-dropdown>\n            @for (actionConfig of regularDefaultActions(); track actionConfig.action) {\n              @if (hasPermission(actionConfig)) {\n                @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n                actionConfig.action === TableAction.DELETE) {\n                  <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig)\"\n                    (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n                  </core-generic-button>\n                }\n              }\n            }\n            @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n              @if (hasPermission(customAction)) {\n                <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n                  (buttonClick)=\"onButtonClick($event, customAction, row)\">\n                </core-generic-button>\n              }\n            }\n\n            @if (hasExtraActionsForRow(row)) {\n              <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n                (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n              </core-generic-button>\n            }\n\n            @if (expansionConfig()?.enabled) {\n              <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n              <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n              </core-generic-button>\n            }\n\n          </div> <!-- .c-table__actions -->\n        </td> <!-- td parent of .c-table__actions -->\n        } <!-- @if (showActions() -->\n\n\n      </tr>\n      @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n        <!-- Todo: Ver que es esto -->\n        <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n          <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n            <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n        </tr>\n      }\n      } @empty {\n        <tr>\n          <!-- Todo: Estilo .no-data -->\n          <td [attr.colspan]=\"displayedColumns().length\">\n            <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<core-generic-pagination [tableId]=\"tableId\"></core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n  [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n  [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n  (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n  (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n  (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".in-modal .c-table thead th:last-child,.c-table tbody td:last-child{text-align:left}.c-table__order-btn--asc{transform:rotate(180deg)}.c-table__order-btn--desc{transform:rotate(0)}.c-table tr.is-editing-inline{background-color:#fff3cd;border-left:3px solid #ffc107}.c-table tr.is-editing-inline td{background-color:#fff3cd}.c-table tr.is-editing-inline:hover td{background-color:#ffecb5}.expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}\n"] }]
         }], ctorParameters: () => [], propDecorators: { sentinel: [{
                 type: ViewChild,
                 args: ['sentinel', { static: false }]
@@ -10831,11 +11158,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 // Este archivo es generado automáticamente por scripts/update-version.js
 // No edites manualmente este archivo
 const VERSION = {
-    full: '2.12.2',
+    full: '2.12.4',
     major: 2,
     minor: 12,
-    patch: 2,
-    timestamp: '2025-09-03T13:16:06.353Z',
+    patch: 4,
+    timestamp: '2025-09-03T15:05:55.228Z',
     buildDate: '3/9/2025'
 };
 
@@ -12413,11 +12740,11 @@ class CarouselComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CarouselComponent, isStandalone: true, selector: "core-carousel", inputs: { images: { classPropertyName: "images", publicName: "images", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()", "keydown": "onKeyDown($event)" } }, viewQueries: [{ propertyName: "carouselHolder", first: true, predicate: ["carouselHolder"], descendants: true, isSignal: true }, { propertyName: "carouselViewport", first: true, predicate: ["carouselViewport"], descendants: true, isSignal: true }], ngImport: i0, template: "<div \n  [ngClass]=\"carouselClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  tabindex=\"0\"\n  #carouselViewport>\n  \n  <div class=\"c-img-carousel__viewport\">\n    <div class=\"c-img-carousel__holder js-img-carousel-holder\" #carouselHolder>\n      <div \n        *ngFor=\"let image of images(); let i = index\"\n        class=\"c-img-carousel__slide js-img-carousel-slide\">\n        <div class=\"c-img-carousel__slide-inner\">\n          <core-image-preview\n            [src]=\"image.url\"\n            [alt]=\"image.alt || 'Image ' + (i + 1)\"\n            [title]=\"image.title || image.alt || 'Image ' + (i + 1)\">\n          </core-image-preview>\n        </div>\n      </div>\n    </div>\n    \n    @if (!config().arrowsOutside) {\n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n        type=\"button\"\n        (click)=\"goToPrevSlide()\"\n        [attr.aria-label]=\"'Anterior'\"\n        data-control=\"prevBtn\">\n      </button>\n      \n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n        type=\"button\"\n        (click)=\"goToNextSlide()\"\n        [attr.aria-label]=\"'Siguiente'\"\n        data-control=\"nextBtn\">\n      </button>\n    }\n    \n    <div \n      *ngIf=\"showDots()\"\n      class=\"c-img-carousel__dots js-img-carousel-nav\"\n      aria-label=\"Navegaci\u00F3n\">\n      <button\n        *ngFor=\"let page of dots(); let i = index\"\n        class=\"c-img-carousel__dot js-img-carousel-dot\"\n        type=\"button\"\n        (click)=\"goToPage(i)\"\n        [class.c-img-carousel__dot--active]=\"currentPage() === i\"\n        [attr.aria-label]=\"'Ir a p\u00E1gina ' + (i + 1)\"\n        [attr.aria-current]=\"currentPage() === i ? 'true' : 'false'\">\n      </button>\n    </div>\n  </div>\n  @if(config().arrowsOutside) {\n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n      type=\"button\"\n      (click)=\"goToPrevSlide()\"\n      [attr.aria-label]=\"'Anterior'\"\n      data-control=\"prevBtn\">\n    </button>\n    \n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n      type=\"button\"\n      (click)=\"goToNextSlide()\"\n      [attr.aria-label]=\"'Siguiente'\"\n      data-control=\"nextBtn\">\n    </button>\n  }\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ImagePreviewComponent, selector: "core-image-preview", inputs: ["src", "alt", "title", "width", "height", "objectFit", "borderRadius", "cursor", "loading", "isRelative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CarouselComponent, isStandalone: true, selector: "core-carousel", inputs: { images: { classPropertyName: "images", publicName: "images", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()", "keydown": "onKeyDown($event)" } }, viewQueries: [{ propertyName: "carouselHolder", first: true, predicate: ["carouselHolder"], descendants: true, isSignal: true }, { propertyName: "carouselViewport", first: true, predicate: ["carouselViewport"], descendants: true, isSignal: true }], ngImport: i0, template: "<div \n  [ngClass]=\"carouselClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  tabindex=\"0\"\n  #carouselViewport>\n  \n  <div class=\"c-img-carousel__viewport\">\n    <div class=\"c-img-carousel__holder js-img-carousel-holder\" #carouselHolder>\n      <div \n        *ngFor=\"let image of images(); let i = index\"\n        class=\"c-img-carousel__slide js-img-carousel-slide\"\n        [class.is-multiple]=\"perView() > 1\">\n        <div class=\"c-img-carousel__slide-inner\">\n          <core-image-preview\n            [src]=\"image.url\"\n            [alt]=\"image.alt || 'Image ' + (i + 1)\"\n            [title]=\"image.title || image.alt || 'Image ' + (i + 1)\">\n          </core-image-preview>\n        </div>\n      </div>\n    </div>\n    \n    @if (!config().arrowsOutside) {\n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n        type=\"button\"\n        (click)=\"goToPrevSlide()\"\n        [attr.aria-label]=\"'Anterior'\"\n        data-control=\"prevBtn\">\n      </button>\n      \n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n        type=\"button\"\n        (click)=\"goToNextSlide()\"\n        [attr.aria-label]=\"'Siguiente'\"\n        data-control=\"nextBtn\">\n      </button>\n    }\n    \n    <div \n      *ngIf=\"showDots()\"\n      class=\"c-img-carousel__dots js-img-carousel-nav\"\n      aria-label=\"Navegaci\u00F3n\">\n      <button\n        *ngFor=\"let page of dots(); let i = index\"\n        class=\"c-img-carousel__dot js-img-carousel-dot\"\n        type=\"button\"\n        (click)=\"goToPage(i)\"\n        [class.c-img-carousel__dot--active]=\"currentPage() === i\"\n        [attr.aria-label]=\"'Ir a p\u00E1gina ' + (i + 1)\"\n        [attr.aria-current]=\"currentPage() === i ? 'true' : 'false'\">\n      </button>\n    </div>\n  </div>\n  @if(config().arrowsOutside) {\n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n      type=\"button\"\n      (click)=\"goToPrevSlide()\"\n      [attr.aria-label]=\"'Anterior'\"\n      data-control=\"prevBtn\">\n    </button>\n    \n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n      type=\"button\"\n      (click)=\"goToNextSlide()\"\n      [attr.aria-label]=\"'Siguiente'\"\n      data-control=\"nextBtn\">\n    </button>\n  }\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ImagePreviewComponent, selector: "core-image-preview", inputs: ["src", "alt", "title", "width", "height", "objectFit", "borderRadius", "cursor", "loading", "isRelative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CarouselComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-carousel', standalone: true, imports: [CommonModule, ImagePreviewComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \n  [ngClass]=\"carouselClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  tabindex=\"0\"\n  #carouselViewport>\n  \n  <div class=\"c-img-carousel__viewport\">\n    <div class=\"c-img-carousel__holder js-img-carousel-holder\" #carouselHolder>\n      <div \n        *ngFor=\"let image of images(); let i = index\"\n        class=\"c-img-carousel__slide js-img-carousel-slide\">\n        <div class=\"c-img-carousel__slide-inner\">\n          <core-image-preview\n            [src]=\"image.url\"\n            [alt]=\"image.alt || 'Image ' + (i + 1)\"\n            [title]=\"image.title || image.alt || 'Image ' + (i + 1)\">\n          </core-image-preview>\n        </div>\n      </div>\n    </div>\n    \n    @if (!config().arrowsOutside) {\n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n        type=\"button\"\n        (click)=\"goToPrevSlide()\"\n        [attr.aria-label]=\"'Anterior'\"\n        data-control=\"prevBtn\">\n      </button>\n      \n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n        type=\"button\"\n        (click)=\"goToNextSlide()\"\n        [attr.aria-label]=\"'Siguiente'\"\n        data-control=\"nextBtn\">\n      </button>\n    }\n    \n    <div \n      *ngIf=\"showDots()\"\n      class=\"c-img-carousel__dots js-img-carousel-nav\"\n      aria-label=\"Navegaci\u00F3n\">\n      <button\n        *ngFor=\"let page of dots(); let i = index\"\n        class=\"c-img-carousel__dot js-img-carousel-dot\"\n        type=\"button\"\n        (click)=\"goToPage(i)\"\n        [class.c-img-carousel__dot--active]=\"currentPage() === i\"\n        [attr.aria-label]=\"'Ir a p\u00E1gina ' + (i + 1)\"\n        [attr.aria-current]=\"currentPage() === i ? 'true' : 'false'\">\n      </button>\n    </div>\n  </div>\n  @if(config().arrowsOutside) {\n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n      type=\"button\"\n      (click)=\"goToPrevSlide()\"\n      [attr.aria-label]=\"'Anterior'\"\n      data-control=\"prevBtn\">\n    </button>\n    \n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n      type=\"button\"\n      (click)=\"goToNextSlide()\"\n      [attr.aria-label]=\"'Siguiente'\"\n      data-control=\"nextBtn\">\n    </button>\n  }\n</div>" }]
+            args: [{ selector: 'core-carousel', standalone: true, imports: [CommonModule, ImagePreviewComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \n  [ngClass]=\"carouselClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  tabindex=\"0\"\n  #carouselViewport>\n  \n  <div class=\"c-img-carousel__viewport\">\n    <div class=\"c-img-carousel__holder js-img-carousel-holder\" #carouselHolder>\n      <div \n        *ngFor=\"let image of images(); let i = index\"\n        class=\"c-img-carousel__slide js-img-carousel-slide\"\n        [class.is-multiple]=\"perView() > 1\">\n        <div class=\"c-img-carousel__slide-inner\">\n          <core-image-preview\n            [src]=\"image.url\"\n            [alt]=\"image.alt || 'Image ' + (i + 1)\"\n            [title]=\"image.title || image.alt || 'Image ' + (i + 1)\">\n          </core-image-preview>\n        </div>\n      </div>\n    </div>\n    \n    @if (!config().arrowsOutside) {\n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n        type=\"button\"\n        (click)=\"goToPrevSlide()\"\n        [attr.aria-label]=\"'Anterior'\"\n        data-control=\"prevBtn\">\n      </button>\n      \n      <button \n        *ngIf=\"showArrows()\"\n        class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n        type=\"button\"\n        (click)=\"goToNextSlide()\"\n        [attr.aria-label]=\"'Siguiente'\"\n        data-control=\"nextBtn\">\n      </button>\n    }\n    \n    <div \n      *ngIf=\"showDots()\"\n      class=\"c-img-carousel__dots js-img-carousel-nav\"\n      aria-label=\"Navegaci\u00F3n\">\n      <button\n        *ngFor=\"let page of dots(); let i = index\"\n        class=\"c-img-carousel__dot js-img-carousel-dot\"\n        type=\"button\"\n        (click)=\"goToPage(i)\"\n        [class.c-img-carousel__dot--active]=\"currentPage() === i\"\n        [attr.aria-label]=\"'Ir a p\u00E1gina ' + (i + 1)\"\n        [attr.aria-current]=\"currentPage() === i ? 'true' : 'false'\">\n      </button>\n    </div>\n  </div>\n  @if(config().arrowsOutside) {\n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--prev icon-arrow-left\"\n      type=\"button\"\n      (click)=\"goToPrevSlide()\"\n      [attr.aria-label]=\"'Anterior'\"\n      data-control=\"prevBtn\">\n    </button>\n    \n    <button \n      *ngIf=\"showArrows()\"\n      class=\"c-img-carousel__btn c-img-carousel__btn--next icon-arrow-right\"\n      type=\"button\"\n      (click)=\"goToNextSlide()\"\n      [attr.aria-label]=\"'Siguiente'\"\n      data-control=\"nextBtn\">\n    </button>\n  }\n</div>" }]
         }], ctorParameters: () => [], propDecorators: { onResize: [{
                 type: HostListener,
                 args: ['window:resize']
@@ -12753,5 +13080,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CarouselComponent, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GenericButtonComponent, GenericDocumentationComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, ImageModalService, ImagePreviewComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SmartFieldComponent, StepSize, StepStatus, StepType, StepsService, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
+export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CarouselComponent, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GenericButtonComponent, GenericDocumentationComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, ImageModalService, ImagePreviewComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SmartFieldComponent, SortDirection, SortMode, StepSize, StepStatus, StepType, StepsService, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TableSortService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
 //# sourceMappingURL=solcre-org-core-ui.mjs.map