@syncfusion/ej2-pivotview 20.1.57 → 20.2.36

package/src/common/calculatedfield/calculated-field.js

@@ -983,13 +983,15 @@ var CalculatedField = /** @class */ (function () {
                 click: this.applyFormula.bind(this),
                 buttonModel: {
                     content: this.parent.localeObj.getConstant('ok'),
-                    isPrimary: true
+                    isPrimary: true,
+                    cssClass: this.parent.cssClass
                 }
             },
             {
                 click: this.cancelClick.bind(this),
                 buttonModel: {
-                    content: this.parent.localeObj.getConstant('cancel')
+                    content: this.parent.localeObj.getConstant('cancel'),
+                    cssClass: this.parent.cssClass
                 }
             }
         ];
@@ -997,7 +999,7 @@ var CalculatedField = /** @class */ (function () {
             var clearButton = {
                 click: this.clearFormula.bind(this),
                 buttonModel: {
-                    cssClass: 'e-calc-clear-btn',
+                    cssClass: 'e-calc-clear-btn' + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                     content: this.parent.localeObj.getConstant('clear'),
                 }
             };
@@ -1431,7 +1433,8 @@ var CalculatedField = /** @class */ (function () {
             change: function (args) {
                 _this.formatText = args.value;
                 _this.formulaText = select('#' + _this.parentID + 'droppable', document).value;
-            }
+            },
+            cssClass: this.parent.cssClass
         });
         customerFormatObj.isStringTemplate = true;
         customerFormatObj.appendTo('#' + this.parentID + 'Custom_Format_Element');
@@ -1738,7 +1741,7 @@ var CalculatedField = /** @class */ (function () {
             dialogRenderer.parentElement.querySelector('.' + cls.FORMULA) !== null) {
             this.createOlapDropElements();
         }
-        var cancelBtn = new Button({ cssClass: cls.FLAT, isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
+        var cancelBtn = new Button({ cssClass: cls.FLAT + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
         cancelBtn.isStringTemplate = true;
         cancelBtn.appendTo('#' + this.parentID + 'cancelBtn');
         if (cancelBtn.element) {
@@ -1746,7 +1749,7 @@ var CalculatedField = /** @class */ (function () {
         }
         if (this.parent.
             dialogRenderer.parentElement.querySelector('.' + cls.FORMULA) !== null && this.parent.isAdaptive) {
-            var okBtn = new Button({ cssClass: cls.FLAT + ' ' + cls.OUTLINE_CLASS, isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
+            var okBtn = new Button({ cssClass: cls.FLAT + ' ' + cls.OUTLINE_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
             okBtn.isStringTemplate = true;
             okBtn.appendTo('#' + this.parentID + 'okBtn');
             this.inputObj = new MaskedTextBox({
@@ -1755,7 +1758,8 @@ var CalculatedField = /** @class */ (function () {
                 change: function (args) {
                     _this.fieldText = args.value;
                     _this.formulaText = select('#' + _this.parentID + 'droppable', document).value;
-                }
+                },
+                cssClass: this.parent.cssClass
             });
             this.inputObj.isStringTemplate = true;
             this.inputObj.appendTo('#' + this.parentID + 'ddlelement');
@@ -1766,7 +1770,8 @@ var CalculatedField = /** @class */ (function () {
                     change: function (args) {
                         _this.formatText = args.value;
                         _this.formulaText = select('#' + _this.parentID + 'droppable', document).value;
-                    }
+                    },
+                    cssClass: this.parent.cssClass
                 });
                 formatInputObj.isStringTemplate = true;
                 formatInputObj.appendTo('#' + this.parentID + 'Custom_Format_Element');
@@ -1792,7 +1797,7 @@ var CalculatedField = /** @class */ (function () {
             }
         }
         else if (this.parent.isAdaptive) {
-            var addBtn = new Button({ cssClass: cls.FLAT, isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
+            var addBtn = new Button({ cssClass: cls.FLAT + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), isPrimary: true, locale: this.parent.locale, enableRtl: this.parent.enableRtl });
             addBtn.isStringTemplate = true;
             addBtn.appendTo('#' + this.parentID + 'addBtn');
             if (this.parent.dataType === 'olap') {
@@ -1849,7 +1854,8 @@ var CalculatedField = /** @class */ (function () {
                             name: AGRTYPE + key,
                             checked: args.element.querySelector('[data-type').getAttribute('data-type') === type[i_1],
                             change: this.onChange.bind(this),
-                            locale: this.parent.locale, enableRtl: this.parent.enableRtl
+                            locale: this.parent.locale, enableRtl: this.parent.enableRtl,
+                            cssClass: this.parent.cssClass
                         });
                         radiobutton.isStringTemplate = true;
                         radiobutton.appendTo('#' + this.parentID + 'radio' + key + type[i_1]);
@@ -1886,7 +1892,8 @@ var CalculatedField = /** @class */ (function () {
             }
             var checkbox = new CheckBox({
                 label: this.parent.engineModule.fieldList[key].caption + ' (' + this.parent.localeObj.getConstant(type) + ')',
-                locale: this.parent.locale, enableRtl: this.parent.enableRtl
+                locale: this.parent.locale, enableRtl: this.parent.enableRtl,
+                cssClass: this.parent.cssClass
             });
             checkbox.isStringTemplate = true;
             checkbox.appendTo('#' + this.parentID + '_' + index);
@@ -1982,14 +1989,16 @@ var CalculatedField = /** @class */ (function () {
         this.dialog.refresh();
         this.inputObj = new MaskedTextBox({
             placeholder: this.parent.localeObj.getConstant('fieldName'),
-            locale: this.parent.locale, enableRtl: this.parent.enableRtl
+            locale: this.parent.locale, enableRtl: this.parent.enableRtl,
+            cssClass: this.parent.cssClass
         });
         this.inputObj.isStringTemplate = true;
         this.inputObj.appendTo('#' + this.parentID + 'ddlelement');
         if (this.parent.dataType === 'pivot') {
             var customerFormatObj = new MaskedTextBox({
                 placeholder: this.parent.localeObj.getConstant('numberFormatString'),
-                locale: this.parent.locale, enableRtl: this.parent.enableRtl
+                locale: this.parent.locale, enableRtl: this.parent.enableRtl,
+                cssClass: this.parent.cssClass
             });
             customerFormatObj.isStringTemplate = true;
             customerFormatObj.appendTo('#' + this.parentID + 'Custom_Format_Element');
@@ -2030,14 +2039,14 @@ var CalculatedField = /** @class */ (function () {
                 {
                     click: isRemove ? this.removeCalcField.bind(this, node) : this.replaceFormula.bind(this, calcInfo),
                     buttonModel: {
-                        cssClass: cls.OK_BUTTON_CLASS + ' ' + cls.FLAT_CLASS,
+                        cssClass: cls.OK_BUTTON_CLASS + ' ' + cls.FLAT_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                         content: isRemove ? this.parent.localeObj.getConstant('yes') : this.parent.localeObj.getConstant('ok'), isPrimary: true
                     }
                 },
                 {
                     click: this.removeErrorDialog.bind(this),
                     buttonModel: {
-                        cssClass: cls.CANCEL_BUTTON_CLASS,
+                        cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                         content: isRemove ? this.parent.localeObj.getConstant('no') : this.parent.localeObj.getConstant('cancel'), isPrimary: true
                     }
                 }

package/src/common/conditionalformatting/conditional-formatting.js

@@ -44,8 +44,8 @@ var ConditionalFormatting = /** @class */ (function () {
             {
                 click: this.addButtonClick.bind(this),
                 buttonModel: {
-                    cssClass: this.parent.isAdaptive ? (cls.FORMAT_ROUND_BUTTON + ' ' + cls.FORMAT_CONDITION_BUTTON) :
-                        cls.FORMAT_CONDITION_BUTTON,
+                    cssClass: (this.parent.isAdaptive ? (cls.FORMAT_ROUND_BUTTON + ' ' + cls.FORMAT_CONDITION_BUTTON) :
+                        cls.FORMAT_CONDITION_BUTTON) + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                     iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS,
                     content: this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('condition')
                 }
@@ -54,7 +54,7 @@ var ConditionalFormatting = /** @class */ (function () {
                 click: this.applyButtonClick.bind(this),
                 isFlat: true,
                 buttonModel: {
-                    isPrimary: true, cssClass: cls.FORMAT_APPLY_BUTTON,
+                    isPrimary: true, cssClass: cls.FORMAT_APPLY_BUTTON + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                     content: this.parent.localeObj.getConstant('apply')
                 }
             },
@@ -62,7 +62,7 @@ var ConditionalFormatting = /** @class */ (function () {
                 click: this.cancelButtonClick.bind(this),
                 isFlat: true,
                 buttonModel: {
-                    cssClass: cls.FORMAT_CANCEL_BUTTON,
+                    cssClass: cls.FORMAT_CANCEL_BUTTON + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                     content: this.parent.localeObj.getConstant('cancel')
                 }
             }
@@ -430,7 +430,7 @@ var ConditionalFormatting = /** @class */ (function () {
         addClass([this.backgroundColor[i].element.nextElementSibling.querySelector('.e-selected-color')], cls.ICON);
         var toggleBtn = new Button({
             iconCss: cls.ICON + ' ' + cls.FORMAT_DELETE_ICON,
-            cssClass: cls.FLAT, locale: this.parent.locale, enableRtl: this.parent.enableRtl
+            cssClass: cls.FLAT + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), locale: this.parent.locale, enableRtl: this.parent.enableRtl
         });
         toggleBtn.isStringTemplate = true;
         toggleBtn.appendTo('#' + this.parentID + 'removeButton' + i);

package/src/common/grouping-bar/grouping-bar.js

@@ -504,7 +504,7 @@ var GroupingBar = /** @class */ (function () {
         }
         element.prepend(createElement('div', { id: this.parent.element.id + '_AllFields' }));
         var toolbarObj = new Toolbar({
-            cssClass: cls.ALL_FIELDS_PANEL_CLASS,
+            cssClass: cls.ALL_FIELDS_PANEL_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
             enableRtl: this.parent.enableRtl,
             items: [{ template: '<div class=' + cls.GROUP_ALL_FIELDS_CLASS + '></div>' }],
             allowKeyboard: false,

package/src/common/popups/aggregate-menu.js

@@ -172,13 +172,13 @@ var AggregateMenu = /** @class */ (function () {
             buttons: [
                 {
                     click: this.updateValueSettings.bind(this),
-                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
+                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
                 },
                 {
                     click: function () {
                         _this.valueDialog.hide();
                     },
-                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }
+                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel') }
                 }
             ],
             closeOnEscape: (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.renderMode === 'Popup') ? false : true,
@@ -336,7 +336,8 @@ var AggregateMenu = /** @class */ (function () {
             // floatLabelType: 'Auto',
             enableRtl: this.parent.enableRtl,
             locale: this.parent.locale,
-            value: fieldCaption, width: '100%'
+            value: fieldCaption, width: '100%',
+            cssClass: this.parent.cssClass
         });
         inputObj1.isStringTemplate = true;
         inputObj1.appendTo(inputField1);

package/src/common/popups/drillthrough-dialog.js

@@ -49,9 +49,8 @@ var DrillThroughDialog = /** @class */ (function () {
         }
         var actualText = eventArgs.currentCell.actualText.toString();
         try {
-            if (this.parent.currentView === 'Table' && this.engine.fieldList[actualText].aggregateType !== 'Count' && this.parent.editSettings.allowInlineEditing &&
-                this.parent.editSettings.allowEditing && eventArgs.rawData.length === 1 &&
-                this.engine.fieldList[actualText].aggregateType !== 'DistinctCount' && typeof (eventArgs.rawData[0][actualText]) !== 'string') {
+            if (this.parent.currentView === 'Table' && this.parent.editSettings.allowInlineEditing &&
+                this.parent.editSettings.allowEditing && eventArgs.rawData.length === 1) {
                 this.parent.actionObj.actionName = events.editRecord;
                 if (this.parent.actionBeginMethod()) {
                     return;
@@ -214,9 +213,9 @@ var DrillThroughDialog = /** @class */ (function () {
         var previousData = this.frameHeaderWithKeys(eventArgs.rawData[eventArgs.rawData.length - 1]);
         var currentData = eventArgs.rawData[eventArgs.rawData.length - 1];
         /* eslint-enable */
-        if (eventArgs.currentCell.actualText in previousData) {
-            currentData[eventArgs.currentCell.actualText] = eventArgs.currentCell.actualValue;
-        }
+        // if (eventArgs.currentCell.actualText in previousData) {
+        //     currentData[eventArgs.currentCell.actualText] = eventArgs.currentCell.actualValue;
+        // }
         var actionInfo = {
             editInfo: { type: 'Inline editing', action: 'update', data: this.gridData }
         };
@@ -227,6 +226,7 @@ var DrillThroughDialog = /** @class */ (function () {
             enabled: true,
             format: '####.##',
             locale: this.parent.locale,
+            cssClass: this.parent.cssClass,
             change: function () {
                 var textBoxValue = _this.numericTextBox.value;
                 var indexValue = eventArgs.currentCell.indexObject[indexObject];
@@ -398,10 +398,10 @@ var DrillThroughDialog = /** @class */ (function () {
                     this.drillThroughGrid.columns.push({
                         headerText: this.parent.localeObj.getConstant('manageRecords'), width: 160, showInColumnChooser: false,
                         commands: [
-                            { type: 'Edit', buttonOption: { iconCss: ' e-icons e-edit', cssClass: 'e-flat' } },
-                            { type: 'Delete', buttonOption: { iconCss: 'e-icons e-delete', cssClass: 'e-flat' } },
-                            { type: 'Save', buttonOption: { iconCss: 'e-icons e-update', cssClass: 'e-flat' } },
-                            { type: 'Cancel', buttonOption: { iconCss: 'e-icons e-cancel-icon', cssClass: 'e-flat' } }
+                            { type: 'Edit', buttonOption: { iconCss: ' e-icons e-edit', cssClass: 'e-flat' + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '') } },
+                            { type: 'Delete', buttonOption: { iconCss: 'e-icons e-delete', cssClass: 'e-flat' + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '') } },
+                            { type: 'Save', buttonOption: { iconCss: 'e-icons e-update', cssClass: 'e-flat' + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '') } },
+                            { type: 'Cancel', buttonOption: { iconCss: 'e-icons e-cancel-icon', cssClass: 'e-flat' + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '') } }
                         ]
                     });
                 }

package/src/common/popups/error-dialog.js

@@ -47,7 +47,7 @@ var ErrorDialog = /** @class */ (function () {
             buttons: [
                 {
                     click: this.closeErrorDialog.bind(this),
-                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
+                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
                 }
             ],
             cssClass: this.parent.cssClass,

package/src/common/popups/filter-dialog.js

@@ -61,19 +61,19 @@ var FilterDialog = /** @class */ (function () {
             buttons: [
                 {
                     buttonModel: {
-                        cssClass: 'e-clear-filter-button' + (this.allowExcelLikeFilter ? '' : ' ' + cls.ICON_DISABLE),
+                        cssClass: 'e-clear-filter-button' + (this.allowExcelLikeFilter ? '' : ' ' + cls.ICON_DISABLE) + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                         iconCss: 'e-icons e-clear-filter-icon', enableRtl: this.parent.enableRtl,
                         content: this.parent.localeObj.getConstant('clearFilter'), disabled: (this.filterObject ? false : true)
                     }
                 },
                 {
                     buttonModel: {
-                        cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true
+                        cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('ok'), isPrimary: true
                     }
                 },
                 {
                     click: this.closeFilterDialog.bind(this),
-                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }
+                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel') }
                 }
             ],
             closeOnEscape: this.parent.renderMode === 'Popup' ? false : true,
@@ -175,7 +175,7 @@ var FilterDialog = /** @class */ (function () {
         this.editorSearch = new MaskedTextBox({
             placeholder: this.parent.localeObj.getConstant('search') + ' ' + '&#8220' + filterCaption + '&#8220',
             enableRtl: this.parent.enableRtl,
-            cssClass: cls.EDITOR_SEARCH_CLASS,
+            cssClass: cls.EDITOR_SEARCH_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
             showClearButton: true,
             change: function (e) {
                 if (_this.parent.dataType === 'olap') {
@@ -213,7 +213,8 @@ var FilterDialog = /** @class */ (function () {
             nodeSelected: function (args) {
                 removeClass([args.node], 'e-active');
                 args.cancel = true;
-            }
+            },
+            cssClass: this.parent.cssClass
         });
         this.allMemberSelect.isStringTemplate = true;
         if (!isNullOrUndefined(this.parent.currentTreeItems)) {
@@ -238,7 +239,8 @@ var FilterDialog = /** @class */ (function () {
                 removeClass([args.node], 'e-active');
                 args.cancel = true;
             },
-            expandOn: 'None'
+            expandOn: 'None',
+            cssClass: this.parent.cssClass
         });
         this.memberTreeView.isStringTemplate = true;
         this.memberTreeView.appendTo(treeViewContainer);
@@ -249,7 +251,7 @@ var FilterDialog = /** @class */ (function () {
         if (this.parent.dataType === 'pivot' && treeData && treeData.length > 0) {
             var sortOrder = this.parent.engineModule.fieldList[fieldName].sort;
             var sortWrapper = createElement('div', {
-                className: cls.FILTER_SORT_CLASS + ' e-btn-group' + (this.parent.enableRtl ? ' ' + cls.RTL : ''),
+                className: cls.FILTER_SORT_CLASS + ' e-btn-group' + (this.parent.enableRtl ? ' ' + cls.RTL : '') + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                 id: this.parent.element.id + '_Member_Sort'
             });
             this.parent.element.appendChild(sortWrapper);
@@ -262,11 +264,11 @@ var FilterDialog = /** @class */ (function () {
                 id: this.parent.element.id + '_Sort_Descend', attrs: { 'type': 'button' }
             });
             var sortBtnElement = new Button({
-                iconCss: cls.ICON + ' ' + cls.SORT_ASCEND_ICON_CLASS, enableRtl: this.parent.enableRtl
+                iconCss: cls.ICON + ' ' + cls.SORT_ASCEND_ICON_CLASS, enableRtl: this.parent.enableRtl, cssClass: this.parent.cssClass
             });
             sortBtnElement.appendTo(sortAscendElement);
             sortBtnElement = new Button({
-                iconCss: cls.ICON + ' ' + cls.SORT_DESCEND_ICON_CLASS, enableRtl: this.parent.enableRtl
+                iconCss: cls.ICON + ' ' + cls.SORT_DESCEND_ICON_CLASS, enableRtl: this.parent.enableRtl, cssClass: this.parent.cssClass
             });
             sortBtnElement.appendTo(sortDescendElement);
             sortWrapper.appendChild(sortAscendElement);
@@ -613,7 +615,8 @@ var FilterDialog = /** @class */ (function () {
             items: items,
             height: '100%',
             selectedItem: selectedIndex,
-            enableRtl: this.parent.enableRtl
+            enableRtl: this.parent.enableRtl,
+            cssClass: this.parent.cssClass
         });
         this.tabObj.isStringTemplate = true;
         this.tabObj.appendTo(wrapper);
@@ -935,7 +938,9 @@ var FilterDialog = /** @class */ (function () {
                     else {
                         return;
                     }
-                }, width: '100%'
+                },
+                width: '100%',
+                cssClass: this.parent.cssClass
             });
             var inputObj2_2 = new NumericTextBox({
                 placeholder: this.parent.localeObj.getConstant('enterValue'),
@@ -954,7 +959,9 @@ var FilterDialog = /** @class */ (function () {
                     else {
                         return;
                     }
-                }, width: '100%'
+                },
+                width: '100%',
+                cssClass: this.parent.cssClass
             });
             inputObj1_2.isStringTemplate = true;
             inputObj1_2.appendTo(inputDiv1);
@@ -975,7 +982,9 @@ var FilterDialog = /** @class */ (function () {
                     else {
                         return;
                     }
-                }, width: '100%'
+                },
+                width: '100%',
+                cssClass: this.parent.cssClass
             });
             var inputObj2_3 = new MaskedTextBox({
                 placeholder: this.parent.localeObj.getConstant('enterValue'),
@@ -990,7 +999,9 @@ var FilterDialog = /** @class */ (function () {
                     else {
                         return;
                     }
-                }, width: '100%'
+                },
+                width: '100%',
+                cssClass: this.parent.cssClass
             });
             inputObj1_3.isStringTemplate = true;
             inputObj1_3.appendTo(inputDiv1);

package/src/common/popups/formatting-dialog.js

@@ -50,13 +50,13 @@ var NumberFormatting = /** @class */ (function () {
             buttons: [
                 {
                     click: this.updateFormatting.bind(this),
-                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('apply'), isPrimary: true }
+                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('apply'), isPrimary: true }
                 },
                 {
                     click: function () {
                         _this.dialog.hide();
                     },
-                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }
+                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel') }
                 }
             ],
             closeOnEscape: true,

package/src/common/popups/grouping.js

@@ -274,13 +274,13 @@ var Grouping = /** @class */ (function () {
             buttons: [
                 {
                     click: this.updateGroupSettings.bind(this),
-                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
+                    buttonModel: { cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('ok'), isPrimary: true }
                 },
                 {
                     click: function () {
                         _this.groupDialog.hide();
                     },
-                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }
+                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel') }
                 }
             ],
             overlayClick: function () {
@@ -349,7 +349,8 @@ var Grouping = /** @class */ (function () {
                         placeholder: this.parent.localeObj.getConstant('captionName'),
                         enableRtl: this.parent.enableRtl,
                         locale: this.parent.locale,
-                        value: caption, width: '100%'
+                        value: caption, width: '100%',
+                        cssClass: this.parent.cssClass
                     });
                     captionInputObj1.isStringTemplate = true;
                     captionInputObj1.appendTo(captionInputField1);
@@ -357,7 +358,8 @@ var Grouping = /** @class */ (function () {
                         placeholder: this.parent.localeObj.getConstant('groupName'),
                         enableRtl: this.parent.enableRtl,
                         locale: this.parent.locale,
-                        width: '100%'
+                        width: '100%',
+                        cssClass: this.parent.cssClass
                     });
                     inputObj1.isStringTemplate = true;
                     inputObj1.appendTo(inputField1);
@@ -505,7 +507,8 @@ var Grouping = /** @class */ (function () {
                             format: '###',
                             value: startAt === undefined ? undefined : parseInt(startAt, 10),
                             enabled: !(startAt === undefined),
-                            width: '100%'
+                            width: '100%',
+                            cssClass: this.parent.cssClass
                         });
                         startAtInputObj.isStringTemplate = true;
                         startAtInputObj.appendTo(startAtInputField1);
@@ -517,7 +520,8 @@ var Grouping = /** @class */ (function () {
                             format: '###',
                             value: endAt === undefined ? undefined : parseInt(endAt, 10),
                             enabled: !(endAt === undefined),
-                            width: '100%'
+                            width: '100%',
+                            cssClass: this.parent.cssClass
                         });
                         endAtInputObj.isStringTemplate = true;
                         endAtInputObj.appendTo(endAtInputField1);
@@ -529,7 +533,8 @@ var Grouping = /** @class */ (function () {
                             format: '###',
                             min: 1,
                             value: selectedInterval,
-                            width: '100%'
+                            width: '100%',
+                            cssClass: this.parent.cssClass
                         });
                         intervalObj.isStringTemplate = true;
                         intervalObj.appendTo(intervalInputField1);
@@ -539,6 +544,7 @@ var Grouping = /** @class */ (function () {
                         checked: !(startAt === undefined),
                         enableRtl: this.parent.enableRtl,
                         locale: this.parent.locale,
+                        cssClass: this.parent.cssClass,
                         change: function (args) {
                             var startAtObj = (type === 'date' ?
                                 getInstance(select('#' + _this.parentElement.id + 'group_start_input'), DateTimePicker) :
@@ -554,6 +560,7 @@ var Grouping = /** @class */ (function () {
                         checked: !(endAt === undefined),
                         enableRtl: this.parent.enableRtl,
                         locale: this.parent.locale,
+                        cssClass: this.parent.cssClass,
                         change: function (args) {
                             var endAtObj = (type === 'date' ?
                                 getInstance(select('#' + _this.parentElement.id + 'group_end_input'), DateTimePicker) :

package/src/common/popups/toolbar.d.ts

@@ -60,6 +60,7 @@ export declare class Toolbar {
      */
     createChartMenu(): void;
     private create;
+    private getCurrentReport;
     private updateItemElements;
     private whitespaceRemove;
     private multipleAxesCheckbox;