eru-grid 0.0.20 → 0.0.22

package/fesm2022/eru-grid.mjs

@@ -296,7 +296,7 @@ class PivotTransformService {
             // Calculate aggregations for each pivot column (optimized)
             pivotColumns.forEach(pivotColumn => {
                 configuration.aggregations.forEach(aggregation => {
-                    const columnKey = `${pivotColumn}_${aggregation.name}`;
+                    const columnKey = `${pivotColumn}|${aggregation.name}`;
                     // Get filtered data from pre-calculated mapping
                     const columnData = configuration.cols.length > 0
                         ? columnMapping.get(pivotColumn) || []
@@ -381,6 +381,7 @@ class PivotTransformService {
                 enableDrilldown: field?.enableDrilldown || false
             });
         });
+        console.log(columns);
         // Check if column subtotals and grand totals are enabled
         const enableColumnSubtotals = gridConfiguration?.config?.enableColumnSubtotals ?? false;
         const enableColumnGrandTotal = gridConfiguration?.config?.enableColumnGrandTotal ?? false;
@@ -450,7 +451,7 @@ class PivotTransformService {
             aggregations.forEach(aggregation => {
                 const aggregationColumn = fields.find(field => field.name === aggregation.name);
                 // CRITICAL FIX: Always use consistent naming pattern
-                const columnName = `${pivotColumn}_${aggregation.name}`;
+                const columnName = `${pivotColumn}|${aggregation.name}`;
                 // For no column dimensions, just show the aggregation label
                 const columnLabel = pivotColumns.length > 1 || pivotColumns[0] !== '_default'
                     ? `${this.formatColumnLabel(pivotColumn)} - ${aggregation.label || aggregation.name}`
@@ -806,7 +807,7 @@ class PivotTransformService {
         if (columnDimensions.length === 0) {
             aggregations.forEach(aggregation => {
                 const aggregationColumn = gridConfiguration?.fields.find((col) => col.name === aggregation.name);
-                const columnName = `_default_${aggregation.name}`;
+                const columnName = `_default|${aggregation.name}`;
                 const columnLabel = aggregation.label || this.formatColumnLabel(aggregation.name);
                 columns.push({
                     name: columnName,
@@ -881,7 +882,7 @@ class PivotTransformService {
                 aggregations.forEach(aggregation => {
                     const aggregationColumn = gridConfiguration?.fields.find((col) => col.name === aggregation.name);
                     const columnKey = combination.join('|');
-                    const columnName = `${columnKey}_${aggregation.name}`;
+                    const columnName = `${columnKey}|${aggregation.name}`;
                     const columnLabel = aggregations.length > 1
                         ? `${combination.join(' - ')} (${aggregation.label})`
                         : combination.join(' - ');
@@ -1006,7 +1007,7 @@ class PivotTransformService {
         if (columnDimensions.length === 0) {
             aggregations.forEach(aggregation => {
                 const aggregationColumn = gridConfiguration?.fields.find((col) => col.name === aggregation.name);
-                const columnName = `_default_${aggregation.name}`;
+                const columnName = `_default|${aggregation.name}`;
                 const columnLabel = aggregation.label || this.formatColumnLabel(aggregation.name);
                 columns.push({
                     name: columnName,
@@ -1069,6 +1070,7 @@ class PivotTransformService {
                 combinations.push([value, ...restCombo]);
             });
         });
+        console.log(combinations);
         return combinations;
     }
     /**
@@ -3788,7 +3790,7 @@ class DataCellComponent {
     ;
     columnCellConfiguration = computed(() => {
         const columns = this.eruGridStore().columns();
-        return columns?.find((columnConfig) => columnConfig.name === this.getColumnValue().replace('default_', '')) || null;
+        return columns?.find((columnConfig) => columnConfig.name === this.getColumnValue()?.replace('default|', '')) || null;
     }, ...(ngDevMode ? [{ debugName: "columnCellConfiguration" }] : []));
     renderer = inject(Renderer2);
     datePipe = inject(DatePipe);
@@ -3846,6 +3848,9 @@ class DataCellComponent {
         if (config?.datatype !== 'number' && config?.datatype !== 'currency') {
             return value?.toString() || '';
         }
+        if (typeof value === 'string') {
+            return value;
+        }
         if (value == 0 && this.replaceZeroValue !== undefined) {
             return this.replaceZeroValue;
         }
@@ -3917,20 +3922,22 @@ class DataCellComponent {
             event.stopPropagation();
             console.log('drillable click', this.id(), this.currentValue());
             // Handle drillable click - you can emit an event or call a service here
-            const idSplit = this.id().toString().replace('pivot_', '').replace('_default_', '');
+            const idSplit = this.id().toString().replace('pivot_', '').replace('_default|', '');
             // Split on first underscore to get first part and rest
             const [rowId, ...columnName] = idSplit.split('_');
             const columnValues = columnName.join('_');
+            const columnValuesSplit = columnValues.split('|');
+            const colName = columnValuesSplit[columnValuesSplit.length - 1];
             console.log({
                 frozenGrandTotalCell: this.frozenGrandTotalCell(),
-                columnName: columnName.join('_'),
+                columnName: colName,
                 rowId: rowId,
                 columnValue: this.currentValue()
             });
             console.log(columnValues);
             this.eruGridStore().setDrilldown({
                 frozenGrandTotalCell: this.frozenGrandTotalCell(),
-                columnName: columnName.join('_'),
+                columnName: colName,
                 rowId: rowId,
                 columnValue: this.currentValue()
             }, columnValues);
@@ -4520,7 +4527,7 @@ class DataCellComponent {
         return firstInitial + secondInitial;
     }
     getColumnValue() {
-        return this.columnName().includes('_') ? this.columnName().split(/_(.*)/)[1] : this.columnName();
+        return this.columnName().includes('|') ? this.columnName().split('|').pop() : this.columnName();
     }
     /**
      * Set column-specific CSS custom properties for text alignment
@@ -4552,7 +4559,11 @@ class DataCellComponent {
         }
     }
     getColumnName() {
-        return this.getColumnValue().replace('default_', '');
+        //console.log(this.getColumnValue())
+        //const columnValue = this.getColumnValue().replace('default|', '');
+        //const columnValues = columnValue.split('|')
+        //const colName = columnValues[columnValues.length - 1]
+        return this.getColumnValue()?.replace('default|', '') || '';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DataCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: DataCellComponent, isStandalone: true, selector: "data-cell", inputs: { eruGridStore: { classPropertyName: "eruGridStore", publicName: "eruGridStore", isSignal: true, isRequired: true, transformFunction: null }, fieldSize: { classPropertyName: "fieldSize", publicName: "fieldSize", isSignal: true, isRequired: true, transformFunction: null }, columnDatatype: { classPropertyName: "columnDatatype", publicName: "columnDatatype", isSignal: true, isRequired: true, transformFunction: null }, columnName: { classPropertyName: "columnName", publicName: "columnName", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, frozenGrandTotalCell: { classPropertyName: "frozenGrandTotalCell", publicName: "frozenGrandTotalCell", isSignal: true, isRequired: false, transformFunction: null }, td: { classPropertyName: "td", publicName: "td", isSignal: true, isRequired: false, transformFunction: null }, drillable: { classPropertyName: "drillable", publicName: "drillable", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, isEditable: { classPropertyName: "isEditable", publicName: "isEditable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { td: "tdChange" }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "data-cell-component" }, providers: [MatDatepickerModule,