@syncfusion/ej2-angular-grids 23.2.7 → 24.1.41

package/styles/grid/_layout.scss

@@ -97,6 +97,10 @@
       padding: $grid-bigger-headercell-top-padding $grid-bigger-headercell-padding $grid-bigger-headercell-bootom-padding;
     }
 
+    &.e-grid-autofit .e-headercell {
+      padding: $grid-bigger-headercell-autofit-padding;
+    }
+
     .e-headercelldiv {
       font-size: $grid-bigger-header-font-size;
       height: $grid-bigger-header-height;
@@ -566,6 +570,9 @@
 
     &.e-device .e-groupheadercell {
       padding: $grid-device-group-headercell-padding;
+      @if $grid-skin == 'bootstrap5' {
+        padding: $grid-bigger-group-headercell-padding;
+      }
     }
 
     .e-groupheadercell:hover {
@@ -831,10 +838,16 @@
     }
 
     .e-rowcell .e-frozen-right-cursor,
+    .e-rowcell .e-frozen-fixedright-cursor,
     .e-rowcell .e-frozen-left-cursor,
+    .e-rowcell .e-frozen-fixedleft-cursor,
     .e-gridheader .e-headercell .e-frozen-right-cursor,
+    .e-gridheader .e-headercell .e-frozen-fixedright-cursor,
     .e-gridheader .e-headercell .e-frozen-left-cursor,
+    .e-gridheader .e-headercell .e-frozen-fixedleft-cursor,
     .e-gridheader .e-filterbarcell .e-frozen-right-cursor,
+    .e-gridheader .e-filterbarcell .e-frozen-fixedright-cursor,
+    .e-gridheader .e-filterbarcell .e-frozen-fixedleft-cursor,
     .e-gridheader .e-filterbarcell .e-frozen-left-cursor {
       cursor: move;
       height: 100%;
@@ -844,13 +857,19 @@
     }
 
     .e-rowcell .e-frozen-left-cursor,
+    .e-rowcell .e-frozen-fixedright-cursor,
     .e-gridheader .e-headercell .e-frozen-left-cursor,
+    .e-gridheader .e-headercell .e-frozen-fixedright-cursor,
+    .e-gridheader .e-filterbarcell .e-frozen-fixedright-cursor,
     .e-gridheader .e-filterbarcell .e-frozen-left-cursor {
       right: 0;
     }
 
     .e-rowcell .e-frozen-right-cursor,
+    .e-rowcell .e-frozen-fixedleft-cursor,
     .e-gridheader .e-headercell .e-frozen-right-cursor,
+    .e-gridheader .e-headercell .e-frozen-fixedleft-cursor,
+    .e-gridheader .e-filterbarcell .e-frozen-fixedleft-cursor,
     .e-gridheader .e-filterbarcell .e-frozen-right-cursor {
       left: 0;
     }
@@ -1080,6 +1099,31 @@
         }
     }
 
+    .e-gridcontent, .e-gridheader,
+    &.e-rtl .e-gridcontent,
+    &.e-rtl .e-gridheader { 
+        & .e-rowcell.e-dragtop,
+        & .e-rowdragdrop.e-dragtop,
+        & .e-rowcell.e-dragtop.e-dragright {
+          border-top: $grid-dragborder-cell-dashed;
+        }
+        & .e-rowdragdrop.e-dragtop.e-dragleft,
+        & .e-rowdragdrop.e-dragleft,
+        & .e-rowdragdrop.e-dragbottom.e-dragleft {
+          border-left: $grid-dragborder-cell-dashed;
+        }
+        & .e-rowcell.e-dragright {
+          border-right: $grid-dragborder-cell-dashed;
+        }
+        & .e-rowcell.e-dragbottom,
+        & .e-rowcell.e-lastrowcell.e-dragbottom,
+        & .e-rowcell.e-dragtop.e-dragbottom,
+        & .e-rowdragdrop.e-dragbottom {
+          border-bottom: $grid-dragborder-cell-dashed;
+        }
+
+    }
+
     .e-gridcontent, .e-gridheader,
     &.e-rtl .e-gridcontent,
     &.e-rtl .e-gridheader {
@@ -1231,6 +1275,12 @@
             }
           }
 
+          & .e-toolbar-right:not(.e-responsive-right) {
+              & .e-search-wrapper:not(.e-responsive-right) {
+                  width: 40px;
+              }
+          }
+
           & .e-toolbar-right {
             & .e-search-wrapper {
               width: 100%;
@@ -1239,7 +1289,7 @@
 
               & .e-search-icon {
                 font-size: $grid-res-toolbar-search-icon-font-size;
-                margin-top: $grid-responsive-header-search;
+                margin-top: 0;
               }
 
               & .e-input-group {
@@ -1271,6 +1321,9 @@
 
       &.e-bigger .e-res-toolbar {
         & .e-toolbar-items {
+          & .e-tbar-btn:hover {
+            background: none;
+          }
           & .e-responsive-right {
             & .e-search-wrapper {
                 & .e-sicon.e-clear-icon {
@@ -2130,6 +2183,22 @@ margin: $grid-group-animator-cell-margin;
       padding: $grid-headercelldiv-padding;
     }
 
+    .e-gridheader .e-sortfilter .e-centeralign.e-headercell[aria-sort="none"],
+    .e-gridheader .e-sortfilter .e-centeralign.e-headercell:not([aria-sort]) {
+      .e-headercelldiv,
+      .e-stackedheadercelldiv {
+        padding-right: $grid-headercelldiv-sort-centeralign-padding-right;
+      }
+    }
+
+    &.e-rtl .e-gridheader .e-sortfilter .e-centeralign.e-headercell[aria-sort="none"],
+    &.e-rtl .e-gridheader .e-sortfilter .e-centeralign.e-headercell:not([aria-sort]) {
+      .e-headercelldiv,
+      .e-stackedheadercelldiv {
+        padding-left: $grid-headercelldiv-sort-centeralign-padding-right;
+      }
+    }
+
     .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
       @if $grid-skin == 'bootstrap5' {
         padding-left: 8px;
@@ -2447,6 +2516,13 @@ margin: $grid-group-animator-cell-margin;
       margin-top: 5px;
       min-height: 160px;
       overflow-y: auto;
+      &.e-checkbox-infinitescroll {
+        border-top-style: solid;
+        border-top-color: $grid-columnchooser-footer-border-color;
+        border-top-width: 1px;
+        margin-top: 0;
+        overflow-x: hidden;
+      }
     }
 
     .e-checkfltrnmdiv {
@@ -4346,10 +4422,16 @@ margin: $grid-group-animator-cell-margin;
       }
 
       .e-rowcell .e-frozen-right-cursor,
+      .e-rowcell .e-frozen-fixedright-cursor,
       .e-rowcell .e-frozen-left-cursor,
+      .e-rowcell .e-frozen-fixedleft-cursor,
       .e-gridheader .e-headercell .e-frozen-right-cursor,
+      .e-gridheader .e-headercell .e-frozen-fixedright-cursor,
       .e-gridheader .e-headercell .e-frozen-left-cursor,
+      .e-gridheader .e-headercell .e-frozen-fixedleft-cursor,
       .e-gridheader .e-filterbarcell .e-frozen-right-cursor,
+      .e-gridheader .e-filterbarcell .e-frozen-fixedright-cursor,
+      .e-gridheader .e-filterbarcell .e-frozen-fixedleft-cursor,
       .e-gridheader .e-filterbarcell .e-frozen-left-cursor {
         cursor: move;
         height: 100%;
@@ -4359,13 +4441,19 @@ margin: $grid-group-animator-cell-margin;
       }
 
       .e-rowcell .e-frozen-left-cursor,
+      .e-rowcell .e-frozen-fixedright-cursor,
       .e-gridheader .e-headercell .e-frozen-left-cursor,
+      .e-gridheader .e-headercell .e-frozen-fixedright-cursor,
+      .e-gridheader .e-filterbarcell .e-frozen-fixedright-cursor,
       .e-gridheader .e-filterbarcell .e-frozen-left-cursor {
         right: 0;
       }
 
       .e-rowcell .e-frozen-right-cursor,
+      .e-rowcell .e-frozen-fixedleft-cursor,
       .e-gridheader .e-headercell .e-frozen-right-cursor,
+      .e-gridheader .e-headercell .e-frozen-fixedleft-cursor,
+      .e-gridheader .e-filterbarcell .e-frozen-fixedleft-cursor,
       .e-gridheader .e-filterbarcell .e-frozen-right-cursor {
         left: 0;
       }
@@ -4547,13 +4635,23 @@ margin: $grid-group-animator-cell-margin;
         border-width: $grid-headercell-both-border-width;
       }
 
+      &.e-default.e-bothlines .e-headercell.e-leftfreeze.e-freezeleftborder,
+      &.e-default.e-verticallines .e-headercell.e-leftfreeze.e-freezeleftborder {
+        border-right-width: 2px;
+      }
+
+      &.e-default.e-bothlines .e-headercell.e-rightfreeze.e-freezerightborder,
+      &.e-default.e-verticallines .e-headercell.e-rightfreeze.e-freezerightborder {
+        border-left-width: 2px;
+      }
+
       &.e-bothlines .e-gridheader th.e-stackedheadercell {
         border-bottom-style: $grid-border-type;
         border-bottom-width: $grid-border-size;
         border-left-style: $grid-border-type;
         border-left-width: $grid-border-size;
       }
-      
+
       .e-bigger #{&}.e-grid.sf-grid,
       #{&}.e-grid.sf-grid.e-bigger {
         .e-gridheader table th:not([rowspan = '1']),
@@ -4777,7 +4875,7 @@ margin: $grid-group-animator-cell-margin;
   .e-edit-dialog.e-dlg-modal {
     .e-dlg-header-content{
       @if $grid-skin == 'fluent' {
-        padding: 13px 20px 27px 28px;
+        padding: 16px;
         .e-btn.e-dlg-closeicon-btn{
           bottom: 4px;
         }
@@ -4804,6 +4902,7 @@ margin: $grid-group-animator-cell-margin;
       & td::before{
         @if $grid-skin == 'fluent' {
           overflow: hidden;
+          bottom: 0;
         }
       }
     }
@@ -4954,12 +5053,110 @@ margin: $grid-group-animator-cell-margin;
     overflow: initial;
   }
 
+  .columnmenudiv {
+    .e-responsiveascendingdiv .e-resascending-icon,
+    .e-responsivedescendingdiv .e-resdescending-icon,
+    .e-responsivegroupdiv .e-resgroup-icon,
+    .e-responsiveungroupdiv .e-resungroup-icon,
+    .e-responsivecoldiv .e-ressort-icon,
+    .e-responsivefilterdiv .e-resfilter-icon {
+      margin-top: $grid-responsive-column-menu-icon-margin-top;
+      position: absolute;
+    }
+
+    /* stylelint-disable */
+    .e-responsivecoldiv .e-res-header-text.e-rescolumn-menu {
+      margin-left: 33px !important;
+    }
+    /* stylelint-enable */
+  }
+
+  .e-mainfilterdiv {
+    /* stylelint-disable */
+    .e-ccdlg.e-cc.e-control.e-dialog {
+      left: 0 !important;
+      max-height: 100% !important;
+      width: 100% !important;
+    }
+    /* stylelint-enable */
+
+    .e-ccdlg {
+      li.e-cclist {
+        padding: 13px 0 13px 6px;
+      }
+
+      .e-main-div.e-cc {
+        height: 100%;
+      }
+
+      /* stylelint-disable */
+      .e-cc-contentdiv {
+        height: 90% !important;
+        min-height: 160px;
+        overflow-y: auto !important;
+      }
+      /* stylelint-enable */
+
+      .e-dlg-content {
+        padding: 8px 16px 8px 8px;
+        overflow-y: hidden;
+      }
+
+      .e-ccul-ele {
+        margin: 13px 0;
+        padding: 0;
+      }
+
+      .e-chk-hidden {
+        -moz-appearance: none; /* stylelint-disable-line property-no-vendor-prefix */
+        height: 1px;
+        opacity: 0;
+        width: 1px;
+      }
+    }
+    /* stylelint-disable */
+      .e-cc-contentdiv {
+        height: 90% !important;
+        min-height: 160px;
+        overflow-y: auto !important;
+      }
+    /* stylelint-enable */
+    
+    .e-cc-searchBox {
+      padding-left: 8px;
+
+      .e-ccsearch-icon:hover,
+      .e-cc-cancel:hover {
+        background: none;
+        @if $grid-skin == 'bootstrap5' {
+          color: $grid-responsive-btn-background;
+        }
+      }
+    }
+
+    .e-ccsearch-icon,
+    .e-cc-cancel,
+    .e-search-icon,
+    .e-chkcancel-icon {
+      font-size: 20px;
+      @if $grid-skin == 'material' {
+        font-size: 16px;
+      }
+    }
+  }
+
   &.e-dialog .e-dlg-header-content {
     @if $grid-skin == 'material3' {
       padding: $grid-bigger-res-dlg-hdr-padding;
     }
   }
 
+  &.e-dialog .e-dlg-header-content {
+    @if $grid-skin == 'bootstrap5' {
+      padding: $grid-bigger-res-dlg-hdr-padding;
+    }
+  }
+
   & .e-dlg-header-content {
     background: $grid-responsive-header-background;
     border-bottom: 1px solid;
@@ -5014,7 +5211,7 @@ margin: $grid-group-animator-cell-margin;
       }
       @else if $grid-skin == 'material3' {
         line-height: 35px;
-        padding-top: 6px;
+        padding-top: 5px;
       }
       padding-left: 0;
       padding-right: 40px;
@@ -5125,8 +5322,10 @@ margin: $grid-group-animator-cell-margin;
     padding: 16px;
     padding-top: 0;
 
-    .e-checkfltrnmdiv {
+    .e-checkfltrnmdiv,
+    .e-ccnmdiv {
       text-align: center;
+      padding-top: 40px;
     }
 
     & .e-filtersetdiv {
@@ -5163,6 +5362,10 @@ margin: $grid-group-animator-cell-margin;
       }
     }
 
+    & .e-ccdlg {
+      border: transparent;
+    }
+
     & .e-xlflmenu {
       border: transparent;
 
@@ -5237,7 +5440,10 @@ margin: $grid-group-animator-cell-margin;
 
             & .e-search-icon:focus,
             & .e-search-icon:active,
-            & .e-search-icon:hover {
+            & .e-search-icon:hover,
+            & .e-chkcancel-icon:focus,
+            & .e-chkcancel-icon:active,
+            & .e-chkcancel-icon:hover {
               background: none;
               @if $grid-skin == 'bootstrap5' {
                 color: $grid-responsive-btn-background;
@@ -5325,6 +5531,15 @@ margin: $grid-group-animator-cell-margin;
 .e-bigger.e-responsive-dialog.e-ressortdiv {
   .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-apply-btn {
     padding-top: 0;
+    @if $grid-skin == 'material3' {
+      padding-top: 1px;
+    }
+    @if $grid-skin == 'fluent' {
+      padding-top: 3px;
+    }
+    @if $grid-skin == 'bootstrap4' or $grid-skin == 'material' {
+      padding-top: 2px;
+    }
     @if $grid-skin == 'tailwind' {
       margin-top: -8px;
     }
@@ -5353,8 +5568,18 @@ margin: $grid-group-animator-cell-margin;
   & .e-ressortbutton-parent {
     float: left;
   }
+
+  .columnmenudiv .e-responsivecoldiv .e-res-header-text.e-rescolumn-menu {
+    margin-right: 33px;
+  }
 }
 
+ /* stylelint-disable */
+.e-grid-toolbarmenu .e-responsivetoolbar-menu .e-menu-item.e-focused {
+  background-color: transparent !important;
+}
+/* stylelint-enable */
+
 /* stylelint-disable */
 .e-ddl.e-popup.e-popup-flmenu .e-dropdownbase,
 .e-ddl.e-popup.e-popup-flbar .e-dropdownbase {

package/styles/grid/_material-dark-definition.scss

@@ -58,6 +58,7 @@ $grid-rtl-headercelldiv-padding: 0 .6em 0 1.8em !default;
 $grid-rtl-headercelldiv-chkbox-padding: 0 .6em 0 .55em !default;
 $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .6em 0 1.15em !default;
 $grid-headercelldiv-padding: 0 1.8em 0 .6em !default;
+$grid-headercelldiv-sort-centeralign-padding-right: .6em !default;
 $grid-headercelldiv-right-align-padding: 0 .6em 0 1.9em !default;
 $grid-filterbarcell-text-input: 26px !default;
 $grid-summary-cell-line-height: 18px !default;
@@ -463,6 +464,7 @@ $grid-drag-move-icon: 10px !default;
 $grid-drag-area-border: 1px solid !default;
 $grid-dragdrop-padding: 2px !default;
 $grid-dragborder-box-shadow: 0 2px 0 0 $accent !default;
+$grid-dragborder-cell-dashed: 1px dashed $accent !default;
 $grid-dragborder-position: relative !default;
 $grid-dragborder-z-index: 5 !default;
 $grid-dragicon-cell-border: 1px 0 0 0 !default;
@@ -576,7 +578,8 @@ $grid-responsive-toolbar-filter-font-size: 22px !default;
 $grid-responsive-tbar-zero-value: 0 !default;
 $grid-responsive-tbar-btn-bgr-padding: $grid-responsive-tbar-zero-value 6px !default;
 $grid-responsive-btn-top: 0 !default;
-$grid-responsive-apply-btn-top: 3px !default;
+$grid-responsive-apply-btn-top: 4px !default;
+$grid-responsive-column-menu-icon-margin-top: 0 !default;
 
 $grid-rtl-headercelldiv-left-align-margin: 10px !default;
 $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
@@ -624,6 +627,7 @@ $grid-rtl-group-span-padding: $grid-bigger-groupcell-span-padding !default;
 $grid-ungroup-rtl-padding-left: 0 !default;
 $grid-column-reorder-icon-color: $grid-icon-default-color !default;
 $grid-bigger-headercell-top-padding: 0 !default;
+$grid-bigger-headercell-autofit-padding: 0 28px 0 !default;
 $grid-bigger-icon-font-size: $grid-icon-font-size !default;
 $grid-rtl-mselect-dd-indicator-left: -6px !default;
 $grid-toolbar-text-opacity: .6 !default;

package/styles/grid/_material-definition.scss

@@ -63,6 +63,7 @@ $grid-rtl-headercelldiv-padding: 0 .6em 0 1.8em !default;
 $grid-rtl-headercelldiv-chkbox-padding: 0 .6em 0 .55em !default;
 $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .6em 0 1.15em !default;
 $grid-headercelldiv-padding: 0 1.8em 0 .6em !default;
+$grid-headercelldiv-sort-centeralign-padding-right: .6em !default;
 $grid-headercelldiv-right-align-padding: 0 .6em 0 1.9em !default;
 $grid-filterbarcell-text-input: 26px !default;
 $grid-summary-cell-line-height: 18px !default;
@@ -462,6 +463,7 @@ $grid-drag-move-icon: 10px !default;
 $grid-drag-area-border: 1px solid !default;
 $grid-dragdrop-padding: 2px !default;
 $grid-dragborder-box-shadow: 0 2px 0 0 $accent !default;
+$grid-dragborder-cell-dashed: 1px dashed $accent !default;
 $grid-dragborder-position: relative !default;
 $grid-dragborder-z-index: 5 !default;
 $grid-dragicon-cell-border: 1px 0 0 0 !default;
@@ -574,7 +576,8 @@ $grid-responsive-toolbar-filter-font-size: 22px !default;
 $grid-responsive-tbar-zero-value: 0 !default;
 $grid-responsive-tbar-btn-bgr-padding: $grid-responsive-tbar-zero-value 6px !default;
 $grid-responsive-btn-top: 0 !default;
-$grid-responsive-apply-btn-top: 3px !default;
+$grid-responsive-apply-btn-top: 4px !default;
+$grid-responsive-column-menu-icon-margin-top: 0 !default;
 
 $grid-rtl-headercelldiv-left-align-margin: 10px !default;
 $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
@@ -622,6 +625,7 @@ $grid-rtl-group-span-padding: $grid-bigger-groupcell-span-padding !default;
 $grid-ungroup-rtl-padding-left: 0 !default;
 $grid-column-reorder-icon-color: $grid-icon-default-color !default;
 $grid-bigger-headercell-top-padding: 0 !default;
+$grid-bigger-headercell-autofit-padding: 0 28px 0 !default;
 $grid-bigger-icon-font-size: $grid-icon-font-size !default;
 $grid-rtl-mselect-dd-indicator-left: -6px !default;
 $grid-toolbar-text-opacity: .6 !default;

package/styles/grid/_material3-definition.scss

@@ -329,6 +329,7 @@ $grid-rtl-headercelldiv-chkbox-padding: 0 .5em 0 2.8em !default;
 $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .5em 0 2.8em !default;
 $grid-ungroup-rtl-padding-right: -7px !default;
 $grid-headercelldiv-padding: 0 20px 0 8px !default;
+$grid-headercelldiv-sort-centeralign-padding-right: 8px !default;
 $grid-headercell-div-padding: 0 .4em !default;
 $grid-group-text-width: auto !default;
 $grid-grouptopleftcell-border-top: 2px solid !default;
@@ -379,7 +380,7 @@ $grid-bigger-group-clone-broder-radius: 6px !default;
 $grid-gd-clone-padding: 7px 4px 4px !default;
 $grid-bigger-group-clone-padding: 10px 6px 6px !default;
 $grid-columnchooser-footer-border-color: rgba($border-light, .12) !default;
-$grid-column-chooser-searchdiv: 1px !default;
+$grid-column-chooser-searchdiv: 0 0 1px 0 !default;
 $grid-bigger-columnchooser-toolbartxt-padding: 0 !default;
 $grid-columnchooser-toolbartxt-padding: 0 !default;
 $grid-bigger-header-first-last-cell-padding: 8px !default;
@@ -470,6 +471,7 @@ $grid-drag-move-icon: 10px !default;
 $grid-drag-area-border: 1px solid rgba($primary) !default;
 $grid-dragdrop-padding: 2px !default;
 $grid-dragborder-box-shadow: 0 2px 0 0 rgba($primary-border-color) !default;
+$grid-dragborder-cell-dashed: 1px dashed rgba($primary-border-color) !default;
 $grid-dragborder-position: relative !default;
 $grid-dragborder-z-index: 5 !default;
 $grid-dragicon-cell-border: 1px 0 0 0 !default;
@@ -575,11 +577,12 @@ $grid-responsive-header-padding-top: 10px !default;
 $grid-responsive-search-place-holder-margin-top: 0 !default;
 $grid-responsive-search-width: 0 !default;
 $grid-responsive-search-left-padding: 0 !default;
-$grid-responsive-filter-clear-margin: 8px !default;
+$grid-responsive-filter-clear-margin: 7px !default;
 $grid-responsive-toolbar-filter-font-size: $grid-bigger-icons-font-size !default;
 $grid-responsive-tbar-btn-bgr-padding: 0 !default;
 $grid-responsive-btn-top: -10px !default;
 $grid-responsive-apply-btn-top: 0 !default;
+$grid-responsive-column-menu-icon-margin-top: 0 !default;
 
 $grid-rtl-headercelldiv-left-align-margin: 10px !default;
 $grid-rtl-filtermenudiv-left-align-margin: -2px !default;
@@ -623,7 +626,7 @@ $grid-biggerreorderarrow-font-size: 14px !default;
 $grid-bigger-drag-count-padding: 3px 8px 4px !default;
 $grid-bigger-drag-count-top: -13px !default;
 $grid-bigger-check-select-all-font-size: 14px !default;
-$grid-adaptive-sort-clear-button-padding: 0 !default;
+$grid-adaptive-sort-clear-button-padding: 1px !default;
 $grid-cc-margin-top: 0 !default;
 $grid-bigger-rtl-cm-margin: -14px 4px -12px -16px !default;
 $grid-bigger-device-rtl-cm-margin: $grid-bigger-rtl-cm-margin !default;
@@ -633,6 +636,7 @@ $grid-rtl-group-span-padding: 6px !default;
 $grid-ungroup-rtl-padding-left: 8px !default;
 $grid-column-reorder-icon-color: rgba($primary) !default;
 $grid-bigger-headercell-top-padding: 7px !default;
+$grid-bigger-headercell-autofit-padding: 7px 8px 7px !default;
 $grid-bigger-icon-font-size: 20px !default;
 $grid-rtl-mselect-dd-indicator-left: -3px !default;
 

package/styles/grid/_tailwind-definition.scss

@@ -326,6 +326,7 @@ $grid-rtl-headercelldiv-chkbox-padding: 0 .5em 0 .45em !default;
 $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .45em 0 .4em !default;
 $grid-ungroup-rtl-padding-right: -8px !default;
 $grid-headercelldiv-padding: 0 20px 0 5px !default;
+$grid-headercelldiv-sort-centeralign-padding-right: 5px !default;
 $grid-headercell-div-padding: 0 .4em !default;
 $grid-group-text-width: auto !default;
 $grid-grouptopleftcell-border-top: 2px solid !default;
@@ -470,6 +471,7 @@ $grid-drag-move-icon: 10px !default;
 $grid-drag-area-border: 1px solid !default;
 $grid-dragdrop-padding: 2px !default;
 $grid-dragborder-box-shadow: 0 2px 0 0 $primary !default;
+$grid-dragborder-cell-dashed: 1px dashed $primary !default;
 $grid-dragborder-position: relative !default;
 $grid-dragborder-z-index: 5 !default;
 $grid-dragicon-cell-border: 1px 0 0 0 !default;
@@ -580,6 +582,7 @@ $grid-responsive-toolbar-filter-font-size: $grid-bigger-icons-font-size !default
 $grid-responsive-tbar-btn-bgr-padding: 1.5px 5.5px !default;
 $grid-responsive-btn-top: -6px !default;
 $grid-responsive-apply-btn-top: 0 !default;
+$grid-responsive-column-menu-icon-margin-top: 4px !default;
 
 $grid-rtl-headercelldiv-left-align-margin: 10px !default;
 $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
@@ -633,6 +636,7 @@ $grid-rtl-group-span-padding: $grid-grouped-headercell-span-padding !default;
 $grid-ungroup-rtl-padding-left: 8px !default;
 $grid-column-reorder-icon-color: $primary !default;
 $grid-bigger-headercell-top-padding: 12px !default;
+$grid-bigger-headercell-autofit-padding: 12px 10px 11px !default;
 $grid-bigger-icon-font-size: $text-base !default;
 $grid-rtl-mselect-dd-indicator-left: -6px !default;
 $grid-toolbar-text-opacity: .6 !default;

package/styles/grid/_theme.scss

@@ -369,9 +369,9 @@
       border-bottom-color: $frozen-border-color;
     }
 
-    .e-leftfreeze:not(.e-summarycell, .e-indentcell, .e-updatedtd, .e-selectionbackground, .e-columnselection, .e-groupcaption, .e-cellselectionbackground),
-    .e-rightfreeze:not(.e-summarycell, .e-updatedtd, .e-selectionbackground, .e-columnselection, .e-groupcaption, .e-cellselectionbackground),
-    .e-fixedfreeze:not(.e-summarycell, .e-selectionbackground, .e-updatedtd, .e-columnselection, .e-groupcaption, .e-cellselectionbackground) {
+    .e-leftfreeze:not(.e-summarycell, .e-indentcell, .e-updatedtd, .e-selectionbackground, .e-columnselection, .e-groupcaption, .e-cellselectionbackground, .e-active),
+    .e-rightfreeze:not(.e-summarycell, .e-updatedtd, .e-selectionbackground, .e-columnselection, .e-groupcaption, .e-cellselectionbackground, .e-active),
+    .e-fixedfreeze:not(.e-summarycell, .e-selectionbackground, .e-updatedtd, .e-columnselection, .e-groupcaption, .e-cellselectionbackground, .e-active) {
       @if $grid-skin == 'material' $grid-skin == 'highcontrast' {
         background-color: $grid-rows-bg-color;
       }
@@ -889,11 +889,16 @@
     }
 
     .e-ftrchk.e-chkfocus,
+    .e-menu-item.e-menufocus,
     li.e-cclist.e-colfocus {
       background-color: $grid-hover-bg-color;
     }
   }
 
+  .e-spreadsheet .e-ftrchk.e-chkfocus {
+    background-color: $grid-hover-bg-color;
+  }
+
   .e-tooltip-wrap.e-griderror,
   .e-control.e-tooltip-wrap.e-popup.e-griderror {
     background-color: $grid-val-error-bg-color;