@datorama/core 21.4.0-rc.1 → 21.4.0-rc.12

package/bundle.scss

@@ -14362,6 +14362,10 @@ dato-grid-v2 ag-grid-angular.pivot-mode .ag-cell {
     color: themify(primary-500);
 }
 
+dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-cell {
+    border: none;
+}
+
 dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-cell dato-grid-column-header {
     display: block;
     height: 100%;
@@ -14382,7 +14386,6 @@ dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell .ag
 
 dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell .ag-header-group-cell-label {
     align-items: center;
-    justify-content: center;
 }
 
 dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
@@ -14398,6 +14401,14 @@ dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell.ag-
     border-right: 1px solid themify(primary-200);
 }
 
+dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.empty-pivot-header {
+    display: none;
+}
+
+dato-grid-v2 ag-grid-angular.pivot-mode .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.group-pivot-cell .ag-header-group-cell-label {
+    justify-content: center;
+}
+
 .ag-dnd-ghost {
     box-shadow: 0 0 10px -1px themify(primary-700, 0.3);
     background-color: themify(primary-100) !important;

package/bundles/datorama-core.umd.js

@@ -11466,6 +11466,16 @@
         var field = colDef.field, showRowGroup = colDef.showRowGroup, pivotValueColumn = colDef.pivotValueColumn;
         return pivotValueColumn ? pivotValueColumn.getColId() : field || showRowGroup;
     }
+    function tryParsePivotValue(str) {
+        var value;
+        try {
+            value = JSON.parse(str);
+        }
+        catch (e) {
+            // Do nothing
+        }
+        return value;
+    }
 
     var GridQuery = /** @class */ (function (_super) {
         __extends(GridQuery, _super);
@@ -11565,14 +11575,23 @@
             return settings;
         };
         GridQuery.prototype.getSort = function () {
-            var _a = this.api.grid.getSortModel().pop() || {}, sort = _a.sort, colId = _a.colId;
-            var column = this.api.columns.getColumn(colId);
-            var secondaryColumns = this.api.columns.getSecondaryColumns();
-            var pivotedColumn = secondaryColumns && secondaryColumns.find(function (col) { return col.getColId() === colId; });
-            var sortColumn = column || pivotedColumn;
-            var sortField = sortColumn && getColField(sortColumn.getColDef());
-            var pivotColIndex = secondaryColumns && pivotedColumn && secondaryColumns.indexOf(pivotedColumn);
-            return { colId: sortField, sort: sort, pivotColIndex: pivotColIndex };
+            if (this.gridRef.gridOptions.pivotMode) {
+                var _a = this.api.grid.getSortModel().pop() || {}, sort = _a.sort, colId = _a.colId;
+                var column = this.api.columns.getColumn(colId);
+                var pivotedColumn = this.getSecondaryColumn(colId);
+                if (pivotedColumn) {
+                    var uniquePivotParents = uniq(this.api.columns.getSecondaryColumns().map(function (column) { return column.getParent(); }));
+                    var secondaryColumn = this.getSecondaryColumn(pivotedColumn.getColId());
+                    var pivotColIndex = uniquePivotParents.indexOf(secondaryColumn.getParent());
+                    return { colId: getColField(pivotedColumn.getColDef()), sort: sort, pivotColIndex: pivotColIndex };
+                }
+                else if (column) {
+                    return { colId: getColField(column.getColDef()), sort: sort };
+                }
+            }
+            else {
+                return this.api.grid.getSortModel().pop();
+            }
         };
         GridQuery.prototype.selectSort = function () {
             return this.select(function (state) { return state.settings.sort; });
@@ -11596,6 +11615,17 @@
         GridQuery.prototype.selectFilter = function () {
             return this.select(function (state) { return state.settings.filter; });
         };
+        GridQuery.prototype.filterChanged = function () {
+            return this.selectFilter().pipe(operators.map(function (filter) {
+                return Object.keys(filter).reduce(function (filters, field) {
+                    var datoFilter = filter[field];
+                    if (datoFilter) {
+                        filters.push({ field: field, filter: datoFilter });
+                    }
+                    return filters;
+                }, []);
+            }));
+        };
         GridQuery.prototype.getSearchTerm = function () {
             return this.getValue().settings.searchTerm;
         };
@@ -11656,6 +11686,10 @@
         GridQuery.prototype.selectIsSelectAllRowsEnabled = function () {
             return this.select(function (state) { return state.serverSidePagination.selectAllRowsEnabled; });
         };
+        GridQuery.prototype.getSecondaryColumn = function (colId) {
+            var secondaryColumns = this.api.columns.getSecondaryColumns();
+            return secondaryColumns && secondaryColumns.find(function (col) { return col.getColId() === colId; });
+        };
         GridQuery.prototype.filterCheckboxSelectionColumn = function (columns) {
             return columns.filter(function (column) { return !column.getUserProvidedColDef() || !column.getUserProvidedColDef().checkboxSelection; });
         };
@@ -11748,7 +11782,7 @@
     function validateStringCondition(rowValue, _a) {
         var condition = _a.condition, filterValue = _a.value;
         var filterTextLowerCase = filterValue ? filterValue.toLowerCase() : '';
-        var valueLowerCase = rowValue ? rowValue.toLowerCase() : '';
+        var valueLowerCase = rowValue ? ("" + rowValue).toLowerCase() : '';
         switch (condition) {
             case exports.DatoFilterConditions.EQUALS:
                 return valueLowerCase === filterTextLowerCase;
@@ -11839,7 +11873,7 @@
                 var currentRowPivotKeys = row.parent.childrenMapped && getRowPivotKeys(row.parent.childrenMapped);
                 var rowValue = api.getValue(filter, row);
                 /** If value is under a pivoted column but doesn't match the filter pivot */
-                if (pivotKeys && !isArrayValuesEqual(pivotKeys, currentRowPivotKeys)) {
+                if (pivotKeys && pivotKeys.length > 0 && !isArrayValuesEqual(pivotKeys, currentRowPivotKeys)) {
                     return { value: true };
                 }
                 if (conditional) {
@@ -11879,17 +11913,9 @@
     function getRowPivotKeys(childrenMapped, keys) {
         if (keys === void 0) { keys = []; }
         var key = Object.keys(childrenMapped)[0];
-        var parsedKey;
-        try {
-            parsedKey = JSON.parse(key);
-        }
-        catch (e) {
-            console.error("Can't parse " + key + " from JSON");
-        }
-        finally {
-            if (parsedKey) {
-                keys = getRowPivotKeys(childrenMapped[key], __spread(keys, [parsedKey.value]));
-            }
+        var parsedKey = tryParsePivotValue(key);
+        if (parsedKey) {
+            keys = getRowPivotKeys(childrenMapped[key], __spread(keys, [parsedKey.value]));
         }
         return keys;
     }
@@ -12840,7 +12866,7 @@
                         var columnValues = this.getColumnValues();
                         this.columnValues = columnValues.map(function (_a) {
                             var value = _a.value;
-                            return value;
+                            return _this.pivotColumn ? value[_this.colField] : value;
                         });
                         this.listOptions = columnValues.map(mapToListItemWithFormatted);
                     }
@@ -12880,6 +12906,7 @@
                 isEmpty(filter)
                     ? this.gridService.clearColumnFilter(this.colField)
                     : this.gridService.setColumnFilter(column, filter);
+                this.gridService.notifyFilterUpdate();
             }
         };
         DatoGridFilterComponent.prototype.clearFilters = function () {
@@ -12930,11 +12957,17 @@
             return this.columnValues.filter(function (value) { return !includedSet.has(value); });
         };
         DatoGridFilterComponent.prototype.buildFilter = function () {
+            var _this = this;
             var _a = this.filterForm.value, byValue = _a.byValue, conditional = _a.conditional;
-            var filter = {};
+            var filter = { colId: this.colDef.colId };
             filter.pivotKeys = this.pivotKeys;
             if (this.pivotColumn) {
-                filter.pivotFields = this.getPivotFields(this.pivotColumn.getParent());
+                filter.pivotFieldsMap = this.getPivotFields(this.pivotColumn.getParent()).reduce(function (fieldMap, field, index) {
+                    if (_this.pivotKeys[index]) {
+                        fieldMap[field] = _this.pivotKeys[index];
+                    }
+                    return fieldMap;
+                }, {});
             }
             if (this.filterSections.Conditional) {
                 this.setConditionalFilter(filter, conditional);
@@ -13270,10 +13303,11 @@
         DatoGridFilterComponent.prototype.getPivotFields = function (parent, fields) {
             if (fields === void 0) { fields = []; }
             var grandParent = parent.getParent();
+            var headerClass = parent.getOriginalColumnGroup().getColGroupDef().headerClass;
             if (grandParent) {
                 this.getPivotFields(grandParent, fields);
             }
-            fields.push(parent.getOriginalColumnGroup().getColGroupDef().headerClass);
+            headerClass && fields.push(headerClass[0]);
             return fields;
         };
         DatoGridFilterComponent.ctorParameters = function () { return [
@@ -14322,12 +14356,43 @@
             });
             this.notifyFilterUpdate();
         };
-        GridService.prototype.setColumnFilter = function (column, filter) {
+        GridService.prototype.setColumnFilter = function (column, filter, notifyGrid) {
+            if (notifyGrid === void 0) { notifyGrid = true; }
             this._logEvent("Grids - Filter Applied" /* GRID_FILTER_APPLIED */, {
                 column: column.getColId(),
                 numOfConditions: (filter.conditional && filter.conditional.conditions.length) || 0,
                 byValue: !!filter.byValue ? 'Yes' : 'No'
             });
+            this.updateFilter(column, filter);
+            if (notifyGrid) {
+                this.notifyFilterUpdate();
+            }
+        };
+        GridService.prototype.setGridFilters = function (filters) {
+            var e_2, _a;
+            try {
+                for (var filters_1 = __values(filters), filters_1_1 = filters_1.next(); !filters_1_1.done; filters_1_1 = filters_1.next()) {
+                    var filter = filters_1_1.value.filter;
+                    var column = this.api.columns.getColumn(filter.colId);
+                    if (column) {
+                        this.setColumnFilter(column, filter);
+                    }
+                    else {
+                        var pivotColumn = this.gridQuery.getSecondaryColumn(filter.colId);
+                        this.setColumnFilter(pivotColumn, filter);
+                    }
+                }
+            }
+            catch (e_2_1) { e_2 = { error: e_2_1 }; }
+            finally {
+                try {
+                    if (filters_1_1 && !filters_1_1.done && (_a = filters_1.return)) _a.call(filters_1);
+                }
+                finally { if (e_2) throw e_2.error; }
+            }
+            this.notifyFilterUpdate();
+        };
+        GridService.prototype.updateFilter = function (column, filter) {
             var colField = getColField(column.getColDef());
             this.store.update(function (state) {
                 var _a;
@@ -14335,7 +14400,6 @@
                     settings: __assign(__assign({}, state.settings), { filter: __assign(__assign({}, state.settings.filter), (_a = {}, _a[colField] = filter, _a)) })
                 };
             });
-            this.notifyFilterUpdate();
         };
         GridService.prototype.setSearchTerm = function (searchTerm) {
             this.store.update(function (state) {
@@ -14628,7 +14692,7 @@
             this.api.grid.onFilterChanged();
         };
         GridService.prototype.buildServerRequestFilters = function (filter) {
-            var e_2, _a;
+            var e_3, _a;
             var columnsFilters = {};
             try {
                 for (var _b = __values(Object.entries(filter)), _c = _b.next(); !_c.done; _c = _b.next()) {
@@ -14664,12 +14728,12 @@
                     }
                 }
             }
-            catch (e_2_1) { e_2 = { error: e_2_1 }; }
+            catch (e_3_1) { e_3 = { error: e_3_1 }; }
             finally {
                 try {
                     if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                 }
-                finally { if (e_2) throw e_2.error; }
+                finally { if (e_3) throw e_3.error; }
             }
             return columnsFilters;
         };
@@ -14722,7 +14786,7 @@
             return { operator: exports.OperatorTypes.AND, filters: [columnFilter, searchFilter] };
         };
         GridService.prototype.buildServerColumnFilters_v2_1 = function (filter) {
-            var e_3, _a;
+            var e_4, _a;
             var columnFilters = [];
             try {
                 for (var _b = __values(Object.entries(filter)), _c = _b.next(); !_c.done; _c = _b.next()) {
@@ -14747,12 +14811,12 @@
                     columnFilters.push(columnFilter);
                 }
             }
-            catch (e_3_1) { e_3 = { error: e_3_1 }; }
+            catch (e_4_1) { e_4 = { error: e_4_1 }; }
             finally {
                 try {
                     if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                 }
-                finally { if (e_3) throw e_3.error; }
+                finally { if (e_4) throw e_4.error; }
             }
             return columnFilters;
         };
@@ -14848,9 +14912,10 @@
          * @private
          */
         GridService.prototype.initPivotSecondaryColsProcess = function (_a) {
+            var _this = this;
             var gridOptions = _a.gridOptions;
             gridOptions.processSecondaryColDef = function (colDef) {
-                var api = colDef.headerComponentParams.gridQuery.api;
+                var api = colDef.headerComponentParams && colDef.headerComponentParams.gridQuery.api;
                 if (api) {
                     var valueColumns = colDef.headerComponentParams.gridQuery.api.columns.getValueColumns();
                     var originalColDef = valueColumns
@@ -14867,38 +14932,62 @@
                     }
                 }
                 if (colDef.pivotKeys) {
-                    colDef.pivotKeys = colDef.pivotKeys.map(function (key) { return JSON.parse(key).value; });
+                    colDef.pivotKeys = colDef.pivotKeys.map(function (key) {
+                        var parsedKey = tryParsePivotValue(key);
+                        return (parsedKey && parsedKey.value) || '';
+                    });
                 }
             };
             gridOptions.processSecondaryColGroupDef = function (colGroupDef) {
                 if (colGroupDef.headerName) {
-                    var _a = JSON.parse(colGroupDef.headerName), field = _a.field, value = _a.value;
-                    colGroupDef.headerClass = field;
-                    colGroupDef.headerName = value;
+                    var parsedValue = tryParsePivotValue(colGroupDef.headerName);
+                    if (parsedValue) {
+                        var field = parsedValue.field, value = parsedValue.value;
+                        colGroupDef.headerClass = [field];
+                        colGroupDef.headerName = value;
+                        if (colGroupDef.children && colGroupDef.children.length > 1) {
+                            colGroupDef.headerClass.push('group-pivot-cell');
+                        }
+                    }
+                }
+                else if (colGroupDef.children) {
+                    var _a = __read(colGroupDef.children, 1), colChild = _a[0];
+                    var pivotTotalColumnIds = colChild && colChild.pivotTotalColumnIds;
+                    if (pivotTotalColumnIds && pivotTotalColumnIds.length > 0) {
+                        colGroupDef.headerClass = ['total-pivot-cell'];
+                        colGroupDef.headerName = _this.translate.transform('core.total');
+                    }
+                }
+                else {
+                    colGroupDef.headerClass = ['empty-pivot-header'];
                 }
                 if (colGroupDef.pivotKeys) {
-                    colGroupDef.pivotKeys = colGroupDef.pivotKeys.map(function (key) { return JSON.parse(key).value; });
+                    colGroupDef.pivotKeys = colGroupDef.pivotKeys.map(function (key) {
+                        var parsedKey = tryParsePivotValue(key);
+                        return (parsedKey && parsedKey.value) || '';
+                    });
                 }
             };
         };
         GridService.prototype.setPivotModeRows = function (data) {
             var pivotColumns = this.gridQuery.getAllPivotColumns();
             var convertedData = data.map(function (currentValue, index) {
-                var e_4, _a;
+                var e_5, _a;
                 var mappedValues = __assign({}, currentValue);
                 try {
                     for (var pivotColumns_1 = __values(pivotColumns), pivotColumns_1_1 = pivotColumns_1.next(); !pivotColumns_1_1.done; pivotColumns_1_1 = pivotColumns_1.next()) {
                         var col = pivotColumns_1_1.value;
                         var field = col.getColDef().field;
-                        mappedValues[field] = JSON.stringify({ field: field, value: currentValue[field] });
+                        var pivotValue = { field: field, value: currentValue[field] };
+                        mappedValues[field] = JSON.stringify(pivotValue);
                     }
                 }
-                catch (e_4_1) { e_4 = { error: e_4_1 }; }
+                catch (e_5_1) { e_5 = { error: e_5_1 }; }
                 finally {
                     try {
                         if (pivotColumns_1_1 && !pivotColumns_1_1.done && (_a = pivotColumns_1.return)) _a.call(pivotColumns_1);
                     }
-                    finally { if (e_4) throw e_4.error; }
+                    finally { if (e_5) throw e_5.error; }
                 }
                 return mappedValues;
             });
@@ -15417,8 +15506,11 @@
         DatoGridControllerComponent.prototype.setGridRows = function (data) {
             this.gridService.setRows(data);
         };
+        DatoGridControllerComponent.prototype.setGridFilters = function (filters) {
+            this.gridService.setGridFilters(filters);
+        };
         DatoGridControllerComponent.prototype.onFilterChanged = function () {
-            return this.gridQuery.selectFilter();
+            return this.gridQuery.filterChanged();
         };
         DatoGridControllerComponent.prototype.onSortChanged = function () {
             return this.gridQuery.selectSort();
@@ -25656,6 +25748,7 @@
     exports.toString = toString;
     exports.toggleClass = toggleClass;
     exports.toolbarActionToContextAction = toolbarActionToContextAction;
+    exports.tryParsePivotValue = tryParsePivotValue;
     exports.unescape = unescape;
     exports.union = union;
     exports.uniq = uniq;