From e7c32034791087795d3ffcbd1b49161be27c38ab Mon Sep 17 00:00:00 2001
From: Alain Dumesny <alaind831+github@gmail.com>
Date: Mon, 4 Sep 2023 16:40:17 -0700
Subject: [PATCH] more resizeToContent fixes

* more fix #404
* resizeToContentParent is now GridStackWidget var as well (local override) for widgets that needs to resize differently.
---
 doc/CHANGES.md   |  1 +
 src/gridstack.ts | 13 ++++++++-----
 src/types.ts     |  2 ++
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/doc/CHANGES.md b/doc/CHANGES.md
index beace557a..9d57f1e04 100644
--- a/doc/CHANGES.md
+++ b/doc/CHANGES.md
@@ -99,6 +99,7 @@ Change log
 ## 9.0.2-dev (TBD)
 * renamed fitToContent to sizeToContent (API BREAK)
 * feat: `sizeToContent` now supports being `boolean|number` to limit the height but user can resize past that, unlike maxH.
+* feat: `resizeToContentParent` now on GridStackWidget for those widgets that need to resize differently.
 
 ## 9.0.2 (2023-08-29)
 * fix 'resizecontent' event fix not called.
diff --git a/src/gridstack.ts b/src/gridstack.ts
index f9204f4ff..faebb9d70 100644
--- a/src/gridstack.ts
+++ b/src/gridstack.ts
@@ -1266,6 +1266,7 @@ export class GridStack {
    Note: this assumes only 1 child under '.grid-stack-item-content' (sized to gridItem minus padding) that is at the entire content size wanted */
   public resizeToContent(els: GridStackElement) {
     GridStack.getElements(els).forEach(el => {
+      if (!el.clientHeight) return; // 0 when hidden, skip
       let n = el?.gridstackNode;
       if (!n) return;
       const grid = n.grid;
@@ -1274,8 +1275,9 @@ export class GridStack {
       const cell = this.getCellHeight();
       if (!cell) return;
       let height = n.h ? n.h * cell : el.clientHeight; // getBoundingClientRect().height seem to flicker back and forth
-      if (!height) return; // 0 when hidden, skip
-      const item = el.querySelector(GridStack.resizeToContentParent);
+      let item: Element;
+      if (n.resizeToContentParent) item = el.querySelector(n.resizeToContentParent);
+      if (!item) item = el.querySelector(GridStack.resizeToContentParent);
       if (!item) return;
       const child = item.firstElementChild;
       // NOTE: clientHeight & getBoundingClientRect() is undefined for text and other leaf nodes. use <div> container!
@@ -1287,9 +1289,10 @@ export class GridStack {
       height += wantedH - itemH;
       let h = Math.ceil(height / cell);
       // check for min/max and special sizing
-      if (Number.isInteger(n.sizeToContent)) {
-        if (h > (n.sizeToContent as number)) {
-          h = n.sizeToContent as number;
+      const softMax = Number.isInteger(n.sizeToContent) ? n.sizeToContent as number : 0;
+      if (softMax) {
+        if (h > softMax) {
+          h = softMax;
           el.classList.remove('size-to-content');  // get v-scroll back
         } else el.classList.add('size-to-content');
       }
diff --git a/src/types.ts b/src/types.ts
index 51e6e00a8..37b139c34 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -324,6 +324,8 @@ export interface GridStackWidget extends GridStackPosition {
   /** local (vs grid) override - see GridStackOptions. 
    * Note: This also allow you to set a maximum h value (but user changeable during normal resizing) to prevent unlimited content from taking too much space (get scrollbar) */
   sizeToContent?: boolean | number;
+  /** local override of GridStack.resizeToContentParent that specify the class to use for the parent (actual) vs child (wanted) height */
+  resizeToContentParent?: string;
   /** optional nested grid options and list of children, which then turns into actual instance at runtime to get options from */
   subGridOpts?: GridStackOptions;
 }