@syncfusion/ej2-react-grids 21.2.5 → 21.2.8

package/CHANGELOG.md

@@ -6,6 +6,28 @@
 
 #### Bug Fixes
 
+- `#I466214` - Resolved the issue where the page size was not being increased when adding new records to the grid containing a pager dropdown.
+- `#I464294` - Resolved the issue where the value zero is not displayed in the grid while using complex data binding.
+
+## 21.2.6 (2023-05-23)
+
+### Grid
+
+#### Bug Fixes
+
+- `#I458689` - Resolved the issue where the bottom border was not shown when using `virtualization` with a limited number of records.
+- `#I455549` - Fixed the problem where the column template was not being re-created after tabbing from batch edit mode in React.
+- `#I456631` - Resolved the issue where the search functionality was not working properly within brackets.
+- `#I458148` - `ResetOnRowClick` resets only the checked rows in the current page while using remote data binding has been resolved.
+- `#I453406` - Removed the deprecated attribute `cellspacing` from the grid table and added the CSS property `border-spacing` instead.
+- `I#459037` - Fixed the paste error that occurred with an empty data source and the addition of a row in Batch mode.
+
+## 21.2.5 (2023-05-16)
+
+### Grid
+
+#### Bug Fixes
+
 - `#I459274` - The issue regarding the `All` page size is not working properly with the `RemoteSaveAdaptor` has been resolved.
 - `#I459703` - Pager component's tooltip not getting updated on locale change issue has been fixed.
 - `#F181837` - The problem related to copy-pasting when adding a new record has been resolved.

package/dist/ej2-react-grids.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-grids.min.js
-*  version : 21.2.5
+*  version : 21.2.8
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/ej2-react-grids.umd.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-grids.umd.min.js
-*  version : 21.2.5
+*  version : 21.2.8
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-react-grids@*",
-  "_id": "@syncfusion/ej2-react-grids@21.2.4",
+  "_id": "@syncfusion/ej2-react-grids@21.2.6",
   "_inBundle": false,
-  "_integrity": "sha512-IqbWgv4ocgxDayJPfoGd3cAnkLQhVzLlmQGFuJz0WigtMYPlVueIhZq3aCQ8DdGZtOLLTw/xFzdzKCMeWBzjCQ==",
+  "_integrity": "sha512-nalyEBG7tDyn8X1JZKjWyAuaUZKnh9wKIyrUF5DUWKQze+hn3Gwi9qIJGnzysM0BLpLLbaq+jbCg/l1p7RMMLg==",
   "_location": "/@syncfusion/ej2-react-grids",
   "_phantomChildren": {},
   "_requested": {
@@ -19,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-react-grids/-/ej2-react-grids-21.2.4.tgz",
-  "_shasum": "3f17e81b0ade33ccc100c010301d9a758a6a31b0",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-react-grids/-/ej2-react-grids-21.2.6.tgz",
+  "_shasum": "3e0f3c9928fda6ee53b3c79867fec3292c657f04",
   "_spec": "@syncfusion/ej2-react-grids@*",
   "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
   "author": {
@@ -32,8 +32,8 @@
   "bundleDependencies": false,
   "dependencies": {
     "@syncfusion/ej2-base": "~21.2.3",
-    "@syncfusion/ej2-grids": "21.2.5",
-    "@syncfusion/ej2-react-base": "~21.2.3"
+    "@syncfusion/ej2-grids": "21.2.8",
+    "@syncfusion/ej2-react-base": "~21.2.8"
   },
   "deprecated": false,
   "description": "Feature-rich JavaScript datagrid (datatable) control with built-in support for editing, filtering, grouping, paging, sorting, and exporting to Excel. for React",
@@ -54,6 +54,6 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-react-ui-components.git"
   },
-  "version": "21.2.5",
+  "version": "21.2.8",
   "sideEffects": false
 }

package/styles/bootstrap-dark.css

@@ -1300,6 +1300,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -7px;
   margin-top: -3px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1325,7 +1326,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: -10px;
   margin-top: -4px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2692,7 +2692,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
-  margin-top: 2px;
+  margin-top: -3px;
+  padding-top: 4px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -3280,7 +3281,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -10px;
-  padding-top: 0;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/bootstrap.css

@@ -1301,6 +1301,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -7px;
   margin-top: -3px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1326,7 +1327,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: -10px;
   margin-top: -4px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2693,7 +2693,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
-  margin-top: 2px;
+  margin-top: -3px;
+  padding-top: 4px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -3281,7 +3282,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -10px;
-  padding-top: 0;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/bootstrap4.css

@@ -1347,11 +1347,12 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-grid span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger span.e-ungroupbutton.e-icons {
-  font-size: 12px;
+  font-size: 16px;
   margin-left: -7px;
   margin-top: -1px;
   margin-right: 8px;
   padding-top: 8px;
+  padding-top: 8px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1382,8 +1383,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: -9px;
   margin-right: -15px;
-  margin-top: 3px;
-  padding-top: 4px;
+  margin-top: -1px;
   padding-left: 12px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2755,8 +2755,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
   margin-top: 0;
-  padding-right: 8px;
   padding-top: 4px;
+  padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
   padding: 7px;

package/styles/bootstrap5-dark.css

@@ -1363,6 +1363,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -12px;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1388,7 +1389,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -8px;
   margin-right: -12px;
   margin-top: 1px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2759,7 +2759,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -12px;
-  margin-top: 2px;
+  margin-top: -0.5px;
+  padding-top: 2px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -3347,7 +3348,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -12px;
-  padding-top: 0;
+  padding-top: 2px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/bootstrap5.css

@@ -1363,6 +1363,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -12px;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1388,7 +1389,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -8px;
   margin-right: -12px;
   margin-top: 1px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2759,7 +2759,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -12px;
-  margin-top: 2px;
+  margin-top: -0.5px;
+  padding-top: 2px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -3347,7 +3348,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -12px;
-  padding-top: 0;
+  padding-top: 2px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/fabric-dark.css

@@ -1274,6 +1274,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1299,7 +1300,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2667,6 +2667,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/fabric.css

@@ -1267,6 +1267,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1292,7 +1293,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2660,6 +2660,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/fluent-dark.css

@@ -1353,6 +1353,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: -4px;
   margin-right: 4px;
+  padding-top: 0;
   padding: 0 4px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
@@ -1386,8 +1387,9 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -9px;
   margin-right: -6px;
   margin-top: -4px;
-  padding-top: 4px;
   padding-left: 8px;
+  margin-top: 0;
+  padding: 0 4px;
 }
 .e-bigger .e-grid .e-groupcaption,
 .e-grid.e-bigger .e-groupcaption {
@@ -2764,7 +2766,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -13px;
-  margin-top: 1px;
+  margin-top: -3px;
+  padding-top: 8px;
   padding-right: 12px;
 }
 .e-grid .e-grptogglebtn {
@@ -3353,7 +3356,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -14px;
-  padding-top: 4px;
+  padding-top: 8px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/fluent.css

@@ -1353,6 +1353,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: -4px;
   margin-right: 4px;
+  padding-top: 0;
   padding: 0 4px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
@@ -1386,8 +1387,9 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -9px;
   margin-right: -6px;
   margin-top: -4px;
-  padding-top: 4px;
   padding-left: 8px;
+  margin-top: 0;
+  padding: 0 4px;
 }
 .e-bigger .e-grid .e-groupcaption,
 .e-grid.e-bigger .e-groupcaption {
@@ -2764,7 +2766,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -13px;
-  margin-top: 1px;
+  margin-top: -3px;
+  padding-top: 8px;
   padding-right: 12px;
 }
 .e-grid .e-grptogglebtn {
@@ -3353,7 +3356,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -14px;
-  padding-top: 4px;
+  padding-top: 8px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/bootstrap-dark.css

@@ -879,6 +879,7 @@
   margin-left: -7px;
   margin-top: -3px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -904,7 +905,6 @@
   margin-left: 0;
   margin-right: -10px;
   margin-top: -4px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2271,7 +2271,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
-  margin-top: 2px;
+  margin-top: -3px;
+  padding-top: 4px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -2859,7 +2860,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -10px;
-  padding-top: 0;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/bootstrap.css

@@ -880,6 +880,7 @@
   margin-left: -7px;
   margin-top: -3px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -905,7 +906,6 @@
   margin-left: 0;
   margin-right: -10px;
   margin-top: -4px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2272,7 +2272,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
-  margin-top: 2px;
+  margin-top: -3px;
+  padding-top: 4px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -2860,7 +2861,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -10px;
-  padding-top: 0;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/bootstrap4.css

@@ -915,11 +915,12 @@
 }
 .e-bigger .e-grid span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger span.e-ungroupbutton.e-icons {
-  font-size: 12px;
+  font-size: 16px;
   margin-left: -7px;
   margin-top: -1px;
   margin-right: 8px;
   padding-top: 8px;
+  padding-top: 8px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -950,8 +951,7 @@
 .e-grid.e-bigger.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: -9px;
   margin-right: -15px;
-  margin-top: 3px;
-  padding-top: 4px;
+  margin-top: -1px;
   padding-left: 12px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2323,8 +2323,8 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -8px;
   margin-top: 0;
-  padding-right: 8px;
   padding-top: 4px;
+  padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
   padding: 7px;

package/styles/grid/bootstrap5-dark.css

@@ -939,6 +939,7 @@
   margin-left: -12px;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -964,7 +965,6 @@
   margin-left: -8px;
   margin-right: -12px;
   margin-top: 1px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2335,7 +2335,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -12px;
-  margin-top: 2px;
+  margin-top: -0.5px;
+  padding-top: 2px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -2923,7 +2924,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -12px;
-  padding-top: 0;
+  padding-top: 2px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/bootstrap5.css

@@ -939,6 +939,7 @@
   margin-left: -12px;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -964,7 +965,6 @@
   margin-left: -8px;
   margin-right: -12px;
   margin-top: 1px;
-  padding-top: 0;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2335,7 +2335,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -12px;
-  margin-top: 2px;
+  margin-top: -0.5px;
+  padding-top: 2px;
   padding-right: 8px;
 }
 .e-grid .e-grptogglebtn {
@@ -2923,7 +2924,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -12px;
-  padding-top: 0;
+  padding-top: 2px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/fabric-dark.css

@@ -853,6 +853,7 @@
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -878,7 +879,6 @@
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2246,6 +2246,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/fabric.css

@@ -846,6 +846,7 @@
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -871,7 +872,6 @@
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2239,6 +2239,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/fluent-dark.css

@@ -929,6 +929,7 @@
   margin-left: 0;
   margin-top: -4px;
   margin-right: 4px;
+  padding-top: 0;
   padding: 0 4px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
@@ -962,8 +963,9 @@
   margin-left: -9px;
   margin-right: -6px;
   margin-top: -4px;
-  padding-top: 4px;
   padding-left: 8px;
+  margin-top: 0;
+  padding: 0 4px;
 }
 .e-bigger .e-grid .e-groupcaption,
 .e-grid.e-bigger .e-groupcaption {
@@ -2340,7 +2342,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -13px;
-  margin-top: 1px;
+  margin-top: -3px;
+  padding-top: 8px;
   padding-right: 12px;
 }
 .e-grid .e-grptogglebtn {
@@ -2929,7 +2932,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -14px;
-  padding-top: 4px;
+  padding-top: 8px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/fluent.css

@@ -929,6 +929,7 @@
   margin-left: 0;
   margin-top: -4px;
   margin-right: 4px;
+  padding-top: 0;
   padding: 0 4px;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
@@ -962,8 +963,9 @@
   margin-left: -9px;
   margin-right: -6px;
   margin-top: -4px;
-  padding-top: 4px;
   padding-left: 8px;
+  margin-top: 0;
+  padding: 0 4px;
 }
 .e-bigger .e-grid .e-groupcaption,
 .e-grid.e-bigger .e-groupcaption {
@@ -2340,7 +2342,8 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -13px;
-  margin-top: 1px;
+  margin-top: -3px;
+  padding-top: 8px;
   padding-right: 12px;
 }
 .e-grid .e-grptogglebtn {
@@ -2929,7 +2932,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -14px;
-  padding-top: 4px;
+  padding-top: 8px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/highcontrast-light.css

@@ -850,6 +850,7 @@
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -875,7 +876,6 @@
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2243,6 +2243,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/highcontrast.css

@@ -850,6 +850,7 @@
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -875,7 +876,6 @@
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2243,6 +2243,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/material-dark.css

@@ -894,6 +894,7 @@
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -919,7 +920,6 @@
   margin-left: 0;
   margin-right: 6px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2287,6 +2287,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 6px;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/material.css

@@ -928,6 +928,7 @@
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -953,7 +954,6 @@
   margin-left: 0;
   margin-right: 6px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2321,6 +2321,7 @@
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 6px;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/grid/tailwind-dark.css

@@ -925,6 +925,7 @@
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -954,7 +955,6 @@
   margin-left: -8px;
   margin-right: 0;
   margin-top: 0;
-  padding-top: 1px;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2347,9 +2347,9 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -9px;
-  margin-top: 1px;
+  margin-top: -2px;
+  padding-top: 4px;
   padding-right: 8px;
-  padding-top: 1px;
 }
 .e-grid span.e-ungroupbutton.e-icons:hover {
   color: #374151;
@@ -2944,7 +2944,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -9px;
-  padding-top: 1px;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/grid/tailwind.css

@@ -925,6 +925,7 @@
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -954,7 +955,6 @@
   margin-left: -8px;
   margin-right: 0;
   margin-top: 0;
-  padding-top: 1px;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2347,9 +2347,9 @@
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -9px;
-  margin-top: 1px;
+  margin-top: -2px;
+  padding-top: 4px;
   padding-right: 8px;
-  padding-top: 1px;
 }
 .e-grid span.e-ungroupbutton.e-icons:hover {
   color: #374151;
@@ -2944,7 +2944,7 @@
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -9px;
-  padding-top: 1px;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/highcontrast-light.css

@@ -1271,6 +1271,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1296,7 +1297,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2664,6 +2664,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/highcontrast.css

@@ -1271,6 +1271,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 1px;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1296,7 +1297,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 8px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2664,6 +2664,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/material-dark.css

@@ -1321,6 +1321,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1346,7 +1347,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 6px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2714,6 +2714,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 6px;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/material.css

@@ -1363,6 +1363,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1388,7 +1389,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-right: 6px;
   margin-top: 0;
-  padding-top: 0;
   padding-left: 0;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2756,6 +2756,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: 6px;
   margin-top: 0;
+  padding-top: 0;
   padding-right: 0;
 }
 .e-grid .e-grptogglebtn {

package/styles/tailwind-dark.css

@@ -1350,6 +1350,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1379,7 +1380,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -8px;
   margin-right: 0;
   margin-top: 0;
-  padding-top: 1px;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2772,9 +2772,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -9px;
-  margin-top: 1px;
+  margin-top: -2px;
+  padding-top: 4px;
   padding-right: 8px;
-  padding-top: 1px;
 }
 .e-grid span.e-ungroupbutton.e-icons:hover {
   color: #374151;
@@ -3369,7 +3369,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -9px;
-  padding-top: 1px;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;

package/styles/tailwind.css

@@ -1350,6 +1350,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: 0;
   margin-top: 0;
   margin-right: 0;
+  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1379,7 +1380,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin-left: -8px;
   margin-right: 0;
   margin-top: 0;
-  padding-top: 1px;
   padding-left: 8px;
 }
 .e-bigger .e-grid .e-groupcaption,
@@ -2772,9 +2772,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid span.e-ungroupbutton.e-icons {
   margin-left: -9px;
-  margin-top: 1px;
+  margin-top: -2px;
+  padding-top: 4px;
   padding-right: 8px;
-  padding-top: 1px;
 }
 .e-grid span.e-ungroupbutton.e-icons:hover {
   color: #374151;
@@ -3369,7 +3369,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
   margin-right: -9px;
-  padding-top: 1px;
+  padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
   border-width: 0 0 0 1px;