@syncfusion/ej2-angular-grids 20.4.53-ngcc → 20.4.54-ngcc

package/CHANGELOG.md

@@ -6,6 +6,23 @@
 
 #### Bug Fixes
 
+- `#I445812` - Column Reordering index is wrong when Grid has hidden columns issue has been fixed.
+- `#I440720` - Executing query with custom dataSource is not working in excel export issue has been fixed.
+- `#F180504` - Copy not working properly when using `hideColumns` property issue has been fixed.
+- `#I433483` - Header cell alignment not proper when text wrapping enabled with filtering issue has been fixed.
+- `#I440455` - Unable to get the row element in the `rowDataBound` when using `rowTemplate` in `React18` issue has been fixed.
+- `#I380872` - All child element gets Hovered on hovering one child issue has been fixed.
+- `#I442280` - Provided the locale support for Expand and Collapse icons issue has been fixed.
+- `#I443824` - The issue with the clear icon displaying incorrect text when hovering over it has been resolved.
+
+- `#I432092`, `#I438520`, `#I438656`, `#I437702` -  Script error thrown when Printing Grid in angular platform has been resolved.
+
+## 20.4.53 (2023-03-07)
+
+### Grid
+
+#### Bug Fixes
+
 - `#I432092`, `#I438520`, `#I438656`, `#I437702` -  Script error thrown when Printing Grid in angular platform has been resolved.
 - `#I431502` - Memory leak issue in React platform has been fixed.
 - `#I439291` - Improper row height in first row when using grid with `allowTextWrap` and `Infinitescrolling` issue has been resolved.
@@ -14,8 +31,6 @@
 - `#I437570` - Using String Template causes exception issue has been fixed.
 - `#F180121` - Grid's Content cropped when rendering with toolbar template inside a card component issue has been fixed.
 
-- `#I432092`, `#I438520`, `#I438656`, `#I437702` -  Script error thrown when Printing Grid in angular platform has been resolved.
-
 ## 20.4.52 (2023-02-28)
 
 ### Grid

package/dist/ej2-angular-grids.umd.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-angular-grids.umd.js
-*  version : 20.4.53
+*  version : 20.4.54
 *  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-angular-grids.umd.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-angular-grids.umd.min.js
-*  version : 20.4.53
+*  version : 20.4.54
 *  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

@@ -2,7 +2,7 @@
   "_from": "@syncfusion/ej2-angular-grids@*",
   "_id": "@syncfusion/ej2-angular-grids@20.4.52",
   "_inBundle": false,
-  "_integrity": "sha512-8hNPPNKh206wvcdXi2KI9sAiexBIrIKVKkcYkcQlmwyocw/etJgamzx8OhnNBavhRJOD7U0b4nwFNDzxUeWBiA==",
+  "_integrity": "sha512-Ao6rn+fy9mRzXdFAxj4Q6UQmpgKMaxWe9QO9oip77HoZ3XBu29iCkdj+ULcKY2rlyxdxIsvG0hhrax4EnNSXNw==",
   "_location": "/@syncfusion/ej2-angular-grids",
   "_phantomChildren": {},
   "_requested": {
@@ -20,7 +20,7 @@
     "/"
   ],
   "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-angular-grids/-/ej2-angular-grids-20.4.52.tgz",
-  "_shasum": "a126fda79c602f862a2a810e55899893354a1643",
+  "_shasum": "ade4e1aba82d25c4494133a0b9d61bf5acdc5954",
   "_spec": "@syncfusion/ej2-angular-grids@*",
   "_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/packages/included",
   "author": {
@@ -33,7 +33,7 @@
   "dependencies": {
     "@syncfusion/ej2-angular-base": "~20.4.53",
     "@syncfusion/ej2-base": "~20.4.51",
-    "@syncfusion/ej2-grids": "20.4.53"
+    "@syncfusion/ej2-grids": "20.4.54"
   },
   "deprecated": false,
   "description": "Feature-rich JavaScript datagrid (datatable) control with built-in support for editing, filtering, grouping, paging, sorting, and exporting to Excel. for Angular",
@@ -58,5 +58,5 @@
   "schematics": "./schematics/collection.json",
   "sideEffects": false,
   "typings": "ej2-angular-grids.d.ts",
-  "version": "20.4.53-ngcc"
+  "version": "20.4.54-ngcc"
 }

package/schematics/utils/lib-details.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.pkgName = '@syncfusion/ej2-angular-grids';
-exports.pkgVer = '^20.4.53';
+exports.pkgVer = '^20.4.54';
 exports.moduleName = 'GridModule, PagerModule';
-exports.themeVer = '~20.4.53';
+exports.themeVer = '~20.4.54';

package/schematics/utils/lib-details.ts

@@ -1,4 +1,4 @@
 export const pkgName = '@syncfusion/ej2-angular-grids';
-export const pkgVer = '^20.4.53';
+export const pkgVer = '^20.4.54';
 export const moduleName = 'GridModule, PagerModule';
-export const themeVer = '~20.4.53';
+export const themeVer = '~20.4.54';

package/styles/bootstrap-dark.css

@@ -976,6 +976,10 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger .e-gridheader .e-fltr-icon .e-sortfilterdiv {
   margin: -30px 16px -30px 0;
 }
+.e-bigger .e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv,
+.e-grid.e-bigger.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-bigger .e-grid .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
 .e-bigger .e-grid .e-wrap .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2131,6 +2135,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
   padding: 0 1.8em 0 0.4em;
 }
+.e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-grid .e-filtermenudiv {
   float: right;
   margin: -20px -7px;
@@ -2197,10 +2204,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -29px -11px 0 0;
 }
 .e-grid.e-wrap .e-gridheader .e-rightalign .e-sortnumber {
-  margin: 3px 2px 0 5px;
+  margin: 3px 2px 0 20px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortnumber {
-  margin: 3px 5px 0 2px;
+  margin: 3px -3px 0 2px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortfilterdiv {
   margin: -9px 10px;
@@ -2217,7 +2224,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   padding: 6px;
 }
 .e-grid.e-wrap .e-columnmenu {
-  margin: -15px -20px -20px -20px;
+  line-height: 10px;
 }
 .e-grid.e-rtl .e-columnmenu {
   left: 5px;
@@ -2225,7 +2232,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -20px -18px -18px 1px;
 }
 .e-grid.e-wrap.e-rtl .e-columnmenu {
-  margin: -15px -13px -23px -3px;
+  line-height: 10px;
 }
 .e-grid [class^=e-] {
   box-sizing: border-box;
@@ -3121,6 +3128,11 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-rightalign.e-fltr-icon .e-headercelldiv {
   margin: -5px -8px -5px 0;
 }
+.e-grid.e-rtl.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv, .e-grid.e-rtl .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+  height: auto;
+  margin-bottom: 2px;
+  margin-top: 0;
+}
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
   margin: -5px;
 }
@@ -3322,7 +3334,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -20px 0 -20px -36px;
   padding: 6px;
 }
-.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv {
+.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
   height: Auto;
   line-height: 18px;
   overflow-wrap: break-word;
@@ -3333,17 +3345,17 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-wrap .e-stackedheader .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-stackedheader .e-columnheader .e-headercelldiv {
   max-height: 36px;
 }
-.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv {
+.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
   margin-bottom: 2px;
   margin-top: 0;
 }
-.e-grid.e-wrap .e-columnheader .e-filtermenudiv {
-  line-height: 18px;
+.e-grid.e-wrap .e-columnheader .e-filtermenudiv, .e-grid.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
+  line-height: 10px;
 }
-.e-grid .e-columnheader.e-wrap .e-filtermenudiv {
-  line-height: 18px;
+.e-grid .e-columnheader.e-wrap .e-filtermenudiv, .e-grid .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
+  line-height: 10px;
 }
-.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
+.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
   height: Auto;
   line-height: 18px;
   overflow-wrap: break-word;
@@ -3362,10 +3374,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -30px -5px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -24px 28px -29px 0;
+  margin: -30px 14px -29px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon.e-rightalign .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon.e-rightalign .e-sortfilterdiv {
-  margin: -24px 0;
+  margin: -30px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-icon-group::before, .e-grid.e-wrap .e-columnheader .e-icon-group::before {
   display: inline-block;
@@ -4295,7 +4307,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-frozenheader.e-frozen-right-header > .e-table, .e-grid.e-rtl .e-frozencontent.e-frozen-right-content > .e-table {
   border-right-color: #9c9c9c;
 }
-.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
+.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
   background-color: #393939;
   color: #f0f0f0;
 }

package/styles/bootstrap.css

@@ -977,6 +977,10 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger .e-gridheader .e-fltr-icon .e-sortfilterdiv {
   margin: -30px 16px -30px 0;
 }
+.e-bigger .e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv,
+.e-grid.e-bigger.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-bigger .e-grid .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
 .e-bigger .e-grid .e-wrap .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2132,6 +2136,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
   padding: 0 1.8em 0 0.4em;
 }
+.e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-grid .e-filtermenudiv {
   float: right;
   margin: -20px -7px;
@@ -2198,10 +2205,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -29px -11px 0 0;
 }
 .e-grid.e-wrap .e-gridheader .e-rightalign .e-sortnumber {
-  margin: 3px 2px 0 5px;
+  margin: 3px 2px 0 20px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortnumber {
-  margin: 3px 5px 0 2px;
+  margin: 3px -3px 0 2px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortfilterdiv {
   margin: -9px 10px;
@@ -2218,7 +2225,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   padding: 6px;
 }
 .e-grid.e-wrap .e-columnmenu {
-  margin: -15px -20px -20px -20px;
+  line-height: 10px;
 }
 .e-grid.e-rtl .e-columnmenu {
   left: 5px;
@@ -2226,7 +2233,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -20px -18px -18px 1px;
 }
 .e-grid.e-wrap.e-rtl .e-columnmenu {
-  margin: -15px -13px -23px -3px;
+  line-height: 10px;
 }
 .e-grid [class^=e-] {
   box-sizing: border-box;
@@ -3122,6 +3129,11 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-rightalign.e-fltr-icon .e-headercelldiv {
   margin: -5px -8px -5px 0;
 }
+.e-grid.e-rtl.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv, .e-grid.e-rtl .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+  height: auto;
+  margin-bottom: 2px;
+  margin-top: 0;
+}
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
   margin: -5px;
 }
@@ -3323,7 +3335,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -20px 0 -20px -36px;
   padding: 6px;
 }
-.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv {
+.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
   height: Auto;
   line-height: 18px;
   overflow-wrap: break-word;
@@ -3334,17 +3346,17 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-wrap .e-stackedheader .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-stackedheader .e-columnheader .e-headercelldiv {
   max-height: 36px;
 }
-.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv {
+.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
   margin-bottom: 2px;
   margin-top: 0;
 }
-.e-grid.e-wrap .e-columnheader .e-filtermenudiv {
-  line-height: 18px;
+.e-grid.e-wrap .e-columnheader .e-filtermenudiv, .e-grid.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
+  line-height: 10px;
 }
-.e-grid .e-columnheader.e-wrap .e-filtermenudiv {
-  line-height: 18px;
+.e-grid .e-columnheader.e-wrap .e-filtermenudiv, .e-grid .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
+  line-height: 10px;
 }
-.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
+.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
   height: Auto;
   line-height: 18px;
   overflow-wrap: break-word;
@@ -3363,10 +3375,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -30px -5px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -24px 28px -29px 0;
+  margin: -30px 14px -29px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon.e-rightalign .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon.e-rightalign .e-sortfilterdiv {
-  margin: -24px 0;
+  margin: -30px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-icon-group::before, .e-grid.e-wrap .e-columnheader .e-icon-group::before {
   display: inline-block;
@@ -4296,7 +4308,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-frozenheader.e-frozen-right-header > .e-table, .e-grid.e-rtl .e-frozencontent.e-frozen-right-content > .e-table {
   border-right-color: #317ab9;
 }
-.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
+.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
   background-color: #f5f5f5;
   color: #333;
 }

package/styles/bootstrap4.css

@@ -1027,6 +1027,10 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger .e-gridheader .e-fltr-icon .e-sortfilterdiv {
   margin: -30px 18px -31px 0;
 }
+.e-bigger .e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv,
+.e-grid.e-bigger.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-bigger .e-grid .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
 .e-bigger .e-grid .e-wrap .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2191,6 +2195,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
   padding: 0 20px 0 5px;
 }
+.e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.35em 0 0.3em;
+}
 .e-grid .e-filtermenudiv {
   float: right;
   margin: -19px -7px;
@@ -2257,7 +2264,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -28px -11px -5px -5px;
 }
 .e-grid.e-wrap .e-gridheader .e-rightalign .e-sortnumber {
-  margin: 3px 2px 0 10px;
+  margin: 3px 2px 0 25px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortnumber {
   margin: 3px 5px 0 2px;
@@ -2277,7 +2284,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   padding: 6px;
 }
 .e-grid.e-wrap .e-columnmenu {
-  margin: -19px -20px -20px -20px;
+  line-height: 3px;
 }
 .e-grid.e-rtl .e-columnmenu {
   left: 23px;
@@ -2285,7 +2292,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -19px -18px -18px -22px;
 }
 .e-grid.e-wrap.e-rtl .e-columnmenu {
-  margin: -17px -13px -23px -25px;
+  line-height: 3px;
 }
 .e-grid [class^=e-] {
   box-sizing: border-box;
@@ -3183,6 +3190,11 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-rightalign.e-fltr-icon .e-headercelldiv {
   margin: -5px -12px -5px 0;
 }
+.e-grid.e-rtl.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv, .e-grid.e-rtl .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+  height: auto;
+  margin-bottom: 2px;
+  margin-top: 0;
+}
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
   margin: -5px;
 }
@@ -3385,7 +3397,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -19px 0 -20px -36px;
   padding: 6px;
 }
-.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv {
+.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
   height: Auto;
   line-height: 21px;
   overflow-wrap: break-word;
@@ -3396,19 +3408,19 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-wrap .e-stackedheader .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-stackedheader .e-columnheader .e-headercelldiv {
   max-height: 36px;
 }
-.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv {
+.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
   margin-bottom: 2px;
   margin-top: 0;
 }
-.e-grid.e-wrap .e-columnheader .e-filtermenudiv {
-  line-height: 18px;
+.e-grid.e-wrap .e-columnheader .e-filtermenudiv, .e-grid.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
+  line-height: 3px;
 }
-.e-grid .e-columnheader.e-wrap .e-filtermenudiv {
-  line-height: 18px;
+.e-grid .e-columnheader.e-wrap .e-filtermenudiv, .e-grid .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
+  line-height: 3px;
 }
-.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
+.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
   height: Auto;
-  line-height: 18px;
+  line-height: 21px;
   overflow-wrap: break-word;
   text-overflow: clip;
   white-space: normal;
@@ -3425,10 +3437,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -34px -5px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -27px 20px -29px 0;
+  margin: -35px 18px -29px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon.e-rightalign .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon.e-rightalign .e-sortfilterdiv {
-  margin: -28px 0;
+  margin: -35px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-icon-group::before, .e-grid.e-wrap .e-columnheader .e-icon-group::before {
   display: inline-block;
@@ -4359,7 +4371,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-frozenheader.e-frozen-right-header > .e-table, .e-grid.e-rtl .e-frozencontent.e-frozen-right-content > .e-table {
   border-right-color: #6c757d;
 }
-.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
+.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
   background-color: rgba(0, 0, 0, 0.08);
   color: #212529;
 }

package/styles/bootstrap5-dark.css

@@ -1033,6 +1033,10 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger .e-gridheader .e-fltr-icon .e-sortfilterdiv {
   margin: -14px 22px -14px 4px;
 }
+.e-bigger .e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv,
+.e-grid.e-bigger.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.45em 0 0.5em;
+}
 .e-bigger .e-grid .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
 .e-bigger .e-grid .e-wrap .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2198,6 +2202,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
   padding-left: 8px;
 }
+.e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
+  padding: 0 0.45em 0 0.5em;
+}
 .e-grid .e-filtermenudiv {
   float: right;
   margin: -12px -2px -12px 8px;
@@ -2264,10 +2271,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -13px 8px -12px 13px;
 }
 .e-grid.e-wrap .e-gridheader .e-rightalign .e-sortnumber {
-  margin: 3px 2px 0 10px;
+  margin: 5px 2px 0 10px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortnumber {
-  margin: 3px 5px 0 2px;
+  margin: 5px 5px 0 2px;
 }
 .e-grid.e-wrap .e-gridheader .e-sortfilterdiv {
   margin: -9px 10px;
@@ -2284,7 +2291,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   padding: 2px;
 }
 .e-grid.e-wrap .e-columnmenu {
-  margin: -19px -20px -20px -20px;
+  line-height: 3px;
 }
 .e-grid.e-rtl .e-columnmenu {
   left: 23px;
@@ -2292,7 +2299,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -13px 8px -12px -22px;
 }
 .e-grid.e-wrap.e-rtl .e-columnmenu {
-  margin: -17px -13px -23px -25px;
+  line-height: 3px;
 }
 .e-grid [class^=e-] {
   box-sizing: border-box;
@@ -3188,6 +3195,11 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-rightalign.e-fltr-icon .e-headercelldiv {
   margin: -5px;
 }
+.e-grid.e-rtl.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv, .e-grid.e-rtl .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+  height: auto;
+  margin-bottom: 2px;
+  margin-top: 0;
+}
 .e-grid.e-rtl .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
   margin: -5px;
 }
@@ -3389,7 +3401,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -12px 8px -12px -2px;
   padding: 2px;
 }
-.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv {
+.e-grid.e-wrap .e-rowcell, .e-grid.e-wrap .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
   height: Auto;
   line-height: 21px;
   overflow-wrap: break-word;
@@ -3400,19 +3412,19 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-wrap .e-stackedheader .e-columnheader .e-stackedheadercelldiv, .e-grid.e-wrap .e-stackedheader .e-columnheader .e-headercelldiv {
   max-height: 36px;
 }
-.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv {
+.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
   margin-bottom: 2px;
   margin-top: 0;
 }
-.e-grid.e-wrap .e-columnheader .e-filtermenudiv {
-  line-height: 18px;
+.e-grid.e-wrap .e-columnheader .e-filtermenudiv, .e-grid.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
+  line-height: 3px;
 }
-.e-grid .e-columnheader.e-wrap .e-filtermenudiv {
-  line-height: 18px;
+.e-grid .e-columnheader.e-wrap .e-filtermenudiv, .e-grid .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
+  line-height: 3px;
 }
-.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
+.e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv, .e-grid .e-columnheader.e-wrap .e-stackedheadercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid .e-frozenhdrcont.e-wrap .e-rowcell {
   height: Auto;
-  line-height: 18px;
+  line-height: 21px;
   overflow-wrap: break-word;
   text-overflow: clip;
   white-space: normal;
@@ -3429,10 +3441,10 @@ li.e-separator.e-menu-item.e-excel-separator {
   margin: -20px -5px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -14px 20px -29px 0;
+  margin: -20px 20px -29px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-fltr-icon.e-rightalign .e-sortfilterdiv, .e-grid.e-wrap .e-columnheader .e-fltr-icon.e-rightalign .e-sortfilterdiv {
-  margin: -14px 0;
+  margin: -20px 14px;
 }
 .e-grid .e-columnheader.e-wrap .e-icon-group::before, .e-grid.e-wrap .e-columnheader .e-icon-group::before {
   display: inline-block;
@@ -4377,7 +4389,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-frozenheader.e-frozen-right-header > .e-table, .e-grid.e-rtl .e-frozencontent.e-frozen-right-content > .e-table {
   border-right-color: #444c54;
 }
-.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
+.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
   background-color: #31373d;
   color: #fff;
 }