From dc7b50f4caf2cace783c9db5754d098404520a83 Mon Sep 17 00:00:00 2001
From: ghiscoding <gbeaulac@gmail.com>
Date: Thu, 23 May 2024 20:30:15 -0400
Subject: [PATCH] fix: Draggable Grouping drop zone in preheader should take
 full width - also use `auto` instead of `100%` to take full width but without
 being wider than its actual container

---
 src/models/gridOption.interface.ts | 3 +++
 src/slick.grid.ts                  | 5 +++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/models/gridOption.interface.ts b/src/models/gridOption.interface.ts
index f5f06ba5..4c174d2c 100644
--- a/src/models/gridOption.interface.ts
+++ b/src/models/gridOption.interface.ts
@@ -251,6 +251,9 @@ export interface GridOption<C extends BaseColumn = BaseColumn> {
   /** Extra pre-header panel height (on top of column header) */
   preHeaderPanelHeight?: number;
 
+  /** Defaults to "auto", extra pre-header panel (on top of column header) width, it could be a number (pixels) or a string ("100%" or "auto") */
+  preHeaderPanelWidth?: number | string;
+
   /** Do we want to preserve copied selection on paste? */
   preserveCopiedSelectionOnPaste?: boolean;
 
diff --git a/src/slick.grid.ts b/src/slick.grid.ts
index f4cb9a6a..0c18cfc4 100644
--- a/src/slick.grid.ts
+++ b/src/slick.grid.ts
@@ -245,6 +245,7 @@ export class SlickGrid<TData = any, C extends Column<TData> = Column<TData>, O e
     preHeaderPanelHeight: 25,
     showTopPanel: false,
     topPanelHeight: 25,
+    preHeaderPanelWidth: 'auto', // mostly useful for Draggable Grouping dropzone to take full width
     formatterFactory: null,
     editorFactory: null,
     cellFlashingCssClass: 'flashing',
@@ -1230,7 +1231,7 @@ export class SlickGrid<TData = any, C extends Column<TData> = Column<TData>, O e
           Utils.width(this._footerRowR, this.canvasWidthR);
         }
         if (this._options.createPreHeaderPanel) {
-          Utils.width(this._preHeaderPanel, this.canvasWidth);
+          Utils.width(this._preHeaderPanel, this._options.preHeaderPanelWidth ?? this.canvasWidth);
         }
         Utils.width(this._viewportTopL, this.canvasWidthL);
         Utils.width(this._viewportTopR, this.viewportW - this.canvasWidthL);
@@ -1257,7 +1258,7 @@ export class SlickGrid<TData = any, C extends Column<TData> = Column<TData>, O e
         }
 
         if (this._options.createPreHeaderPanel) {
-          Utils.width(this._preHeaderPanel, this.canvasWidth);
+          Utils.width(this._preHeaderPanel, this._options.preHeaderPanelWidth ?? this.canvasWidth);
         }
         Utils.width(this._viewportTopL, '100%');