@syncfusion/ej2-pivotview 20.2.39 → 20.2.43

package/src/pivotview/renderer/render.js

@@ -283,12 +283,22 @@ var Render = /** @class */ (function () {
             this.parent.lastColumn.width = 'auto';
             this.parent.lastColumn = undefined;
         }
+        var exportCompleteEventArgs = {
+            type: 'PDF',
+            promise: args.promise
+        };
+        this.parent.trigger(events.exportComplete, exportCompleteEventArgs);
     };
     Render.prototype.excelExportComplete = function (args) {
         if (this.parent.lastColumn !== undefined && this.parent.lastColumn.width !== 'auto') {
             this.parent.lastColumn.width = 'auto';
             this.parent.lastColumn = undefined;
         }
+        var exportCompleteEventArgs = {
+            type: 'Excel/CSV',
+            promise: args.promise
+        };
+        this.parent.trigger(events.exportComplete, exportCompleteEventArgs);
     };
     /* eslint-enable */
     Render.prototype.dataBound = function (args) {
@@ -380,7 +390,7 @@ var Render = /** @class */ (function () {
                 isGroupElement = true;
             }
             var rowIndex = Number(elem.getAttribute('index'));
-            var colIndex = Number(elem.getAttribute('aria-colindex'));
+            var colIndex = Number(elem.getAttribute('data-colindex'));
             var pivotValue1 = this_1.parent.pivotValues[rowIndex][colIndex];
             var selectedID = item.id;
             switch (selectedID) {
@@ -452,7 +462,7 @@ var Render = /** @class */ (function () {
                         if (groupField && groupField.type === 'Custom' || (this_1.parent.engineModule.fieldList[fieldName].isCustomField && fieldName.indexOf('_custom_group') > -1)) {
                             groupField = PivotUtil.getFieldByName(fieldName.replace('_custom_group', ''), this_1.parent.dataSourceSettings.groupSettings);
                             if (groupField) {
-                                var cell = this_1.parent.engineModule.pivotValues[Number(elem.getAttribute('index'))][Number(elem.getAttribute('aria-colindex'))];
+                                var cell = this_1.parent.engineModule.pivotValues[Number(elem.getAttribute('index'))][Number(elem.getAttribute('data-colindex'))];
                                 var selectedCellsInfo = this_1.parent.groupingModule.getSelectedCells(cell.axis, fieldName, cell.actualText.toString());
                                 selectedCellsInfo.push({ axis: cell.axis, fieldName: fieldName, name: cell.actualText.toString(), cellInfo: cell });
                                 var selectedOptions = this_1.parent.groupingModule.getSelectedOptions(selectedCellsInfo);
@@ -661,7 +671,7 @@ var Render = /** @class */ (function () {
             ele = target.parentElement.parentElement;
         }
         var rowIndx = Number(ele.getAttribute('index'));
-        var colIndx = Number(ele.getAttribute('aria-colindex'));
+        var colIndx = Number(ele.getAttribute('data-colindex'));
         var pivotValue = this.parent.pivotValues[rowIndx][colIndx];
         var aggregateType;
         if (args.item.id.indexOf(this.parent.element.id + '_Agg') > -1) {
@@ -805,7 +815,7 @@ var Render = /** @class */ (function () {
             var fieldName = target.getAttribute('fieldName');
             if (!fieldName || fieldName == '') {
                 var rowIndx = Number(target.getAttribute('index'));
-                var colIndx = Number(target.getAttribute('aria-colindex'));
+                var colIndx = Number(target.getAttribute('data-colindex'));
                 fieldName = this.engine.pivotValues[rowIndx][colIndx].actualText;
             }
             var valuefields = this.parent.dataSourceSettings.values;
@@ -993,7 +1003,7 @@ var Render = /** @class */ (function () {
         var selectedElements = this.parent.element.querySelectorAll('.' + cls.CELL_SELECTED_BGCOLOR + ',.' + cls.SELECTED_BGCOLOR);
         for (var _i = 0, selectedElements_1 = selectedElements; _i < selectedElements_1.length; _i++) {
             var element = selectedElements_1[_i];
-            var colIndex = Number(element.getAttribute('aria-colindex'));
+            var colIndex = Number(element.getAttribute('data-colindex'));
             var rowIndex = Number(element.getAttribute('index'));
             var cell = this.engine.pivotValues[rowIndex][colIndex];
             if (cell) {
@@ -1036,7 +1046,7 @@ var Render = /** @class */ (function () {
             var isRowFieldsAvail = cell.valueSort && cell.valueSort.levelName === (this.parent.dataSourceSettings.rows.length === 0 && this.parent.dataSourceSettings.valueAxis === 'row' &&
                 this.parent.localeObj.getConstant('grandTotal') + (this.parent.dataSourceSettings.valueSortSettings.headerDelimiter) + (cell.formattedText));
             tCell.setAttribute('index', cell.rowIndex ? cell.rowIndex.toString() : '0');
-            if (tCell.getAttribute('aria-colindex') === '0') {
+            if (tCell.getAttribute('data-colindex') === '0') {
                 if (this.parent.dataType === 'pivot') {
                     var isValueCell = cell.type && cell.type === 'value';
                     tCell.innerText = '';
@@ -1140,15 +1150,15 @@ var Render = /** @class */ (function () {
                 var innerText = tCell.innerText;
                 tCell.innerText = '';
                 tCell.classList.add(cls.VALUESCONTENT);
-                cell = args.data[Number(tCell.getAttribute('aria-colindex'))];
+                cell = args.data[Number(tCell.getAttribute('data-colindex'))];
                 cell = isNullOrUndefined(cell) ? args.column.customAttributes.cell : cell;
                 cell.isGrandSum = isRowFieldsAvail ? true : cell.isGrandSum;
                 if (cell.isSum) {
                     tCell.classList.add(cls.SUMMARY);
                 }
                 var isGrandSum = (isNullOrUndefined(cell.isGrandSum) && (!isNullOrUndefined(this.parent.olapEngineModule) && this.parent.olapEngineModule.olapValueAxis === 'column') && this.parent.dataType === 'olap' &&
-                    ((this.colGrandPos - this.parent.dataSourceSettings.values.length) < Number(tCell.getAttribute('aria-colindex'))));
-                if (cell.isGrandSum || (isGrandSum || this.colGrandPos === Number(tCell.getAttribute('aria-colindex'))) || this.rowGrandPos === Number(tCell.getAttribute('index'))) {
+                    ((this.colGrandPos - this.parent.dataSourceSettings.values.length) < Number(tCell.getAttribute('data-colindex'))));
+                if (cell.isGrandSum || (isGrandSum || this.colGrandPos === Number(tCell.getAttribute('data-colindex'))) || this.rowGrandPos === Number(tCell.getAttribute('index'))) {
                     tCell.classList.add('e-gtot');
                 }
                 else if (this.parent.dataType === 'olap' ? cell.isSum : this.validateColumnTotalcell(cell.colIndex)) {
@@ -1164,12 +1174,12 @@ var Render = /** @class */ (function () {
                         '<a data-url="' + innerText + '" class="e-hyperlinkcell ' + customClass + '">' + innerText + '</a>' : innerText)
                 }));
                 if (this.parent.gridSettings.allowReordering && !this.parent.showGroupingBar) {
-                    tCell.setAttribute('aria-colindex', args.column.customAttributes.cell.colIndex.toString());
+                    tCell.setAttribute('data-colindex', args.column.customAttributes.cell.colIndex.toString());
                 }
             }
             if (this.parent.cellTemplate) {
                 var index = tCell.getAttribute('index');
-                var colindex = tCell.getAttribute('aria-colindex');
+                var colindex = tCell.getAttribute('data-colindex');
                 var templateID = index + '_' + colindex;
                 /* eslint-disable-next-line */
                 var element = this.parent.getCellTemplate()({ targetCell: tCell, cellInfo: cell }, this.parent, 'cellTemplate', this.parent.element.id + '_cellTemplate', null, null, tCell);
@@ -1340,7 +1350,7 @@ var Render = /** @class */ (function () {
                         args.node.style.borderBottomWidth = '0px';
                     }
                 }
-                args.node.setAttribute('aria-colindex', cell.colIndex.toString());
+                args.node.setAttribute('data-colindex', cell.colIndex.toString());
                 args.node.setAttribute('index', cell.rowIndex.toString());
                 var fieldName = void 0;
                 if (this.parent.dataType === 'pivot') {
@@ -1431,7 +1441,7 @@ var Render = /** @class */ (function () {
                 tCell = this.appendValueSortIcon(cell, tCell, cell.rowIndex, cell.colIndex);
                 if (this.parent.cellTemplate) {
                     var index = tCell.getAttribute('index');
-                    var colindex = tCell.getAttribute('aria-colindex');
+                    var colindex = tCell.getAttribute('data-colindex');
                     var templateID = index + '_' + colindex;
                     this.parent.gridHeaderCellInfo.push({ targetCell: tCell });
                 }
@@ -1515,7 +1525,7 @@ var Render = /** @class */ (function () {
         cell = (cell.className.indexOf('e-headercelldiv') > -1 ? cell.parentElement : cell);
         var args = {
             currentCell: cell,
-            data: this.engine.pivotValues[Number(cell.getAttribute('index'))][Number(cell.getAttribute('aria-colindex'))],
+            data: this.engine.pivotValues[Number(cell.getAttribute('index'))][Number(cell.getAttribute('data-colindex'))],
             cancel: true,
             nativeEvent: e
         };

package/styles/bootstrap-dark.css

@@ -2513,7 +2513,7 @@
 }
 
 .e-pivot-calc-dialog-div {
-  max-height: 550px !important;
+  max-height: 600px !important;
   min-width: 290px;
 }
 .e-pivot-calc-dialog-div .e-dlg-header-content,
@@ -2523,11 +2523,14 @@
 .e-pivot-calc-dialog-div .e-dlg-content {
   padding-bottom: 15px;
 }
+.e-pivot-calc-dialog-div .e-dlg-content .e-pivot-calc-custom-format-div {
+  margin-top: 15px;
+}
 .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-pivot-calc-dialog-div .e-olap-member-title {
   color: #f0f0f0;
   font-size: 13px;
@@ -2805,26 +2808,26 @@
 .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-pivot-all-field-title-container .e-info:hover {
   color: #0070f0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   -ms-flex: auto;
       flex: auto;
   margin-left: 18px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula {
   height: 100px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-calc-custom-format-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-calc-custom-format-div {
   margin-top: 15px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-format-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-member-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-hierarchy-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-format-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-member-title {
   padding-left: 0;
   padding-right: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title {
   margin-top: 0;
   padding-top: 0;
 }
@@ -2835,7 +2838,7 @@
   float: left;
   margin: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 18px;
 }
@@ -2852,13 +2855,13 @@
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-member-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger .e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger .e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-member-title {
   font-size: 14px;
   padding: 6px 0;
@@ -2912,12 +2915,12 @@
 .e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-treeview ul .e-list-icon {
   font-size: 16px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 24px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 24px;
 }
@@ -4797,8 +4800,7 @@
 }
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-input-div,
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-member-options,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-olap-calc-custom-format-div {
+.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div {
   margin-left: 20px;
   margin-right: 20px;
   margin-top: 20px;

package/styles/bootstrap.css

@@ -2510,7 +2510,7 @@
 }
 
 .e-pivot-calc-dialog-div {
-  max-height: 550px !important;
+  max-height: 600px !important;
   min-width: 290px;
 }
 .e-pivot-calc-dialog-div .e-dlg-header-content,
@@ -2520,11 +2520,14 @@
 .e-pivot-calc-dialog-div .e-dlg-content {
   padding-bottom: 15px;
 }
+.e-pivot-calc-dialog-div .e-dlg-content .e-pivot-calc-custom-format-div {
+  margin-top: 15px;
+}
 .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-pivot-calc-dialog-div .e-olap-member-title {
   color: #333;
   font-size: 13px;
@@ -2802,26 +2805,26 @@
 .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-pivot-all-field-title-container .e-info:hover {
   color: #317ab9;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   -ms-flex: auto;
       flex: auto;
   margin-left: 18px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula {
   height: 100px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-calc-custom-format-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-calc-custom-format-div {
   margin-top: 15px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-format-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-member-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-hierarchy-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-format-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-member-title {
   padding-left: 0;
   padding-right: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title {
   margin-top: 0;
   padding-top: 0;
 }
@@ -2832,7 +2835,7 @@
   float: left;
   margin: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 18px;
 }
@@ -2849,13 +2852,13 @@
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-member-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger .e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger .e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-member-title {
   font-size: 14px;
   padding: 6px 0;
@@ -2909,12 +2912,12 @@
 .e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-treeview ul .e-list-icon {
   font-size: 16px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 24px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 24px;
 }
@@ -4794,8 +4797,7 @@
 }
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-input-div,
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-member-options,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-olap-calc-custom-format-div {
+.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div {
   margin-left: 20px;
   margin-right: 20px;
   margin-top: 20px;

package/styles/bootstrap4.css

@@ -2673,7 +2673,7 @@
 }
 
 .e-pivot-calc-dialog-div {
-  max-height: 550px !important;
+  max-height: 600px !important;
   min-width: 290px;
 }
 .e-pivot-calc-dialog-div .e-dlg-header-content,
@@ -2683,11 +2683,14 @@
 .e-pivot-calc-dialog-div .e-dlg-content {
   padding-bottom: 14px;
 }
+.e-pivot-calc-dialog-div .e-dlg-content .e-pivot-calc-custom-format-div {
+  margin-top: 15px;
+}
 .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-pivot-calc-dialog-div .e-olap-member-title {
   color: #212529;
   font-size: 13px;
@@ -2965,26 +2968,26 @@
 .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-pivot-all-field-title-container .e-info:hover {
   color: #007bff;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   -ms-flex: auto;
       flex: auto;
   margin-left: 18px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula {
   height: 100px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-calc-custom-format-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-calc-custom-format-div {
   margin-top: 15px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-format-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-member-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-hierarchy-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-format-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-member-title {
   padding-left: 0;
   padding-right: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title {
   margin-top: 0;
   padding-top: 0;
 }
@@ -2995,7 +2998,7 @@
   float: left;
   margin: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 18px;
 }
@@ -3012,13 +3015,13 @@
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-member-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger .e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger .e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-member-title {
   font-size: 14px;
   padding: 6px 0;
@@ -3072,12 +3075,12 @@
 .e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-treeview ul .e-list-icon {
   font-size: 16px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 24px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 24px;
 }
@@ -5012,8 +5015,7 @@
 }
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-input-div,
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-member-options,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-olap-calc-custom-format-div {
+.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div {
   margin-left: 20px;
   margin-right: 20px;
   margin-top: 20px;

package/styles/bootstrap5-dark.css

@@ -2594,7 +2594,7 @@
 }
 
 .e-pivot-calc-dialog-div {
-  max-height: 550px !important;
+  max-height: 600px !important;
   min-width: 290px;
 }
 .e-pivot-calc-dialog-div .e-dlg-header-content,
@@ -2604,11 +2604,14 @@
 .e-pivot-calc-dialog-div .e-dlg-content {
   padding-bottom: 18px;
 }
+.e-pivot-calc-dialog-div .e-dlg-content .e-pivot-calc-custom-format-div {
+  margin-top: 15px;
+}
 .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-pivot-calc-dialog-div .e-olap-member-title {
   color: #ced4da;
   font-size: 14px;
@@ -2890,26 +2893,26 @@
 .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-pivot-all-field-title-container .e-info:hover {
   color: #adb5bd;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   -ms-flex: auto;
       flex: auto;
   margin-left: 18px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula {
   height: 100px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-calc-custom-format-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-calc-custom-format-div {
   margin-top: 15px;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-formula-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-hierarchy-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-format-title,
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-olap-member-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-formula-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-hierarchy-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-format-title,
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-olap-member-title {
   padding-left: 0;
   padding-right: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div .e-pivot-field-name-title {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div .e-pivot-field-name-title {
   margin-top: 0;
   padding-top: 0;
 }
@@ -2920,7 +2923,7 @@
   float: left;
   margin: 0;
 }
-.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 18px;
 }
@@ -2937,13 +2940,13 @@
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger.e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger.e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger.e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger.e-pivot-calc-dialog-div .e-olap-member-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-all-field-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-field-name-title,
 .e-bigger .e-pivot-calc-dialog-div .e-pivot-formula-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-hierarchy-title,
-.e-bigger .e-pivot-calc-dialog-div .e-olap-format-title,
+.e-bigger .e-pivot-calc-dialog-div .e-pivot-format-title,
 .e-bigger .e-pivot-calc-dialog-div .e-olap-member-title {
   font-size: 14px;
   padding: 6px 0;
@@ -3002,12 +3005,12 @@
 .e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-field-tree-div .e-pivot-treeview-outer .e-treeview ul .e-list-icon {
   font-size: 20px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 24px;
 }
-.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div,
-.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-olap-calculated-div {
+.e-bigger.e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div,
+.e-bigger .e-pivot-calc-dialog-div.e-olap-calc-dialog-div.e-rtl .e-pivot-calc-outer-div .e-pivot-calculated-div {
   margin-left: 0;
   margin-right: 24px;
 }
@@ -4916,8 +4919,7 @@
 }
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-input-div,
 .e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-member-options,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div,
-.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-olap-calc-custom-format-div {
+.e-pivotfieldlist-container.e-device .e-adaptive-container .e-content .e-pivot-calc-outer-div .e-pivot-calc-custom-format-div {
   margin-left: 20px;
   margin-right: 20px;
   margin-top: 20px;