@bsuite/page-builder 2.2.0 → 2.3.1

package/dist/PageGridLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageGridLayout.d.ts","sourceRoot":"","sources":["../src/PageGridLayout.tsx"],"names":[],"mappings":"AACA,OAAO,KAQN,MAAM,OAAO,CAAC;AAGf,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AAMxC,OAAO,KAAK,EAAe,mBAAmB,EAA4B,MAAM,YAAY,CAAC;AA4W7F,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,cAAc,EACd,WAAW,EACX,aAAa,EACb,WAAW,EACX,gBAAgB,EAChB,iBAAiB,EACjB,OAAO,EACP,UAAU,EACV,SAAS,EAMT,WAAkB,EAClB,aAAsC,EACtC,QAAQ,EACR,iBAAiB,EAKjB,UAAkB,EAClB,yBAAiE,EACjE,kBAAkB,EAClB,sBAAsB,EACtB,mBAAmB,EACnB,+BAA6E,EAC7E,wBAAwB,EACxB,4BAA4B,EAC5B,4BAA4B,GAC7B,EAAE,mBAAmB,qBAyzBrB"}
+{"version":3,"file":"PageGridLayout.d.ts","sourceRoot":"","sources":["../src/PageGridLayout.tsx"],"names":[],"mappings":"AACA,OAAO,KAQN,MAAM,OAAO,CAAC;AAGf,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AAMxC,OAAO,KAAK,EAAe,mBAAmB,EAA4B,MAAM,YAAY,CAAC;AAyd7F,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,cAAc,EACd,WAAW,EACX,aAAa,EACb,WAAW,EACX,gBAAgB,EAChB,iBAAiB,EACjB,OAAO,EACP,UAAU,EACV,SAAS,EAMT,WAAkB,EAClB,aAAsC,EACtC,QAAQ,EACR,iBAAiB,EAKjB,UAAkB,EAClB,yBAAiE,EACjE,kBAAkB,EAClB,sBAAsB,EACtB,mBAAmB,EACnB,+BAA6E,EAC7E,wBAAwB,EACxB,4BAA4B,EAC5B,4BAA4B,GAC7B,EAAE,mBAAmB,qBAyzBrB"}

package/dist/PageGridLayout.js

@@ -84,6 +84,61 @@ const DEFAULT_ADD_RELATIONSHIP_WIDGET_EVENT_NAMES = [
 const RGLResizeHandle = React.forwardRef(function RGLResizeHandle({ axis = 'se', className: injectedClassName, ...rest }, ref) {
     return (_jsx("span", { ref: ref, "data-no-drag": true, className: `react-resizable-handle react-resizable-handle-${axis}${injectedClassName ? ' ' + injectedClassName : ''}`, ...rest }));
 });
+/* A ZERO MEASUREMENT IS DISCARDED SILENTLY, AND THAT IS HOW A CARD GOES INVISIBLE.
+ *
+ * `reportRows` is guarded by `contentPx > 0` — correctly, because a zero reading
+ * during mount would converge the card to nothing. But a card whose content
+ * genuinely measures zero then keeps whatever row count it had, inside a wrapper
+ * that is `overflow-hidden`. The card renders. The content does not. Nothing
+ * fails, and nothing says so.
+ *
+ * The reachable cause is a percentage height. The measuring div is deliberately
+ * UNCONSTRAINED so the observer reads intrinsic height rather than the clipped
+ * flex box — that is the whole reason it exists. An unconstrained parent has
+ * `height: auto`, and a child asking for `height: 100%` against `auto` resolves
+ * to auto, i.e. its own content height. A chart, a canvas or a map that sizes
+ * itself from its parent therefore collapses to nothing, and the taller the
+ * intended element the more invisible it is. The same CSS rule produced a
+ * 1184x0 schema-builder canvas in production with 45 laid-out nodes inside it.
+ *
+ * This does NOT change layout. Constraining the wrapper would break the
+ * measurement it exists to take, and changing the autoHeight default is how
+ * page-builder 2.0.0 discarded every saved layout across 1,729 cards. It makes
+ * the silent case audible in development and leaves production untouched, which
+ * is the same trade @bsuite/theme 1.3.0 made for its missing-provider warning.
+ */
+let warnedAboutCollapsedContent = false;
+function warnOnceAboutCollapsedContent(el) {
+    if (warnedAboutCollapsedContent)
+        return;
+    /* THE SIGNATURE, not merely "height is zero".
+     *
+     * Requiring childElementCount > 0 is not enough, and jsdom is why: it has no
+     * layout engine, so getBoundingClientRect().height is 0 for EVERY element in
+     * every test. A warning keyed on that fires on every mounted card in the suite
+     * and means nothing — the recorded lesson is that jsdom cannot model the bug
+     * this exists to catch, so the check must not pretend it can.
+     *
+     * The real defect has a distinctive shape, measured in production: laid-out
+     * content inside a zero-height box — scrollHeight 1938 against clientHeight 0.
+     * Requiring scrollHeight > 0 selects exactly that, and jsdom reports 0 for
+     * both, so it stays silent there rather than crying wolf. */
+    if (el.scrollHeight <= 0)
+        return;
+    const isDev = typeof import.meta !== 'undefined' &&
+        import.meta.env?.DEV === true;
+    if (!isDev)
+        return;
+    warnedAboutCollapsedContent = true;
+    console.error('[@bsuite/page-builder] An autoHeight card measured 0px with content inside it, '
+        + 'so its height was left unchanged and the content is clipped by overflow-hidden — '
+        + 'the card looks empty rather than broken. The usual cause is a child sized with '
+        + 'height:100% (a chart, canvas or map): the measuring wrapper is intentionally '
+        + 'unconstrained so the observer can read intrinsic height, and a percentage height '
+        + 'against an auto-height parent resolves to auto. Give the child an intrinsic height '
+        + '(an aspect ratio, a px/rem height, or min-height), or pass autoHeight={false} on '
+        + 'this card so it renders into the constrained scrollable wrapper instead.');
+}
 const GridItem = React.memo(React.forwardRef(function GridItem({ id, content, isEditing, label, onHide, autoHeight, onAutoHeightChange, chrome = false, children: injectedChildren, className: injectedClassName, style: injectedStyle, ...rest }, ref) {
     // Auto-height measurement (blueprint amendment A1). `measureRef` wraps
     // `content` with NO height constraint of its own — its parent has
@@ -161,6 +216,8 @@ const GridItem = React.memo(React.forwardRef(function GridItem({ id, content, is
         latestContentPxRef.current = contentPx;
         if (contentPx > 0)
             reportRows(contentPx);
+        else
+            warnOnceAboutCollapsedContent(el);
     }, [autoHeight, onAutoHeightChange, reportRows]);
     useEffect(() => {
         if (!autoHeight || !onAutoHeightChange)
@@ -214,7 +271,7 @@ const GridItem = React.memo(React.forwardRef(function GridItem({ id, content, is
     return (_jsxs("div", { ref: ref, className: outerClass, style: injectedStyle, ...rest, children: [_jsxs("div", { className: "h-full w-full relative", children: [isEditing && (_jsx("div", { className: "absolute inset-0 z-10 pointer-events-none rounded-3xl border-2 border-transparent group-hover:border-primary/50 transition-colors bg-primary/5" })), isEditing && (_jsx("div", { className: "absolute top-2 left-2 z-30 flex items-center gap-1 pointer-events-none", children: _jsx("span", { className: "text-[10px] px-1.5 py-0.5 rounded-md opacity-80 font-medium bg-muted text-muted-foreground", children: label }) })), isEditing && (_jsx("button", { className: "absolute top-2 right-2 z-30 h-6 w-6 rounded-full flex items-center justify-center bg-destructive/80 hover:bg-destructive text-destructive-foreground shadow transition-colors", "data-no-drag": true, onPointerDown: (event) => event.stopPropagation(), onClick: (event) => {
                             event.stopPropagation();
                             onHide(id);
-                        }, title: `Hide ${label}`, "aria-label": `Hide ${label}`, children: _jsx(EyeOff, { className: "h-3 w-3", "aria-hidden": "true" }) })), _jsx("div", { "data-slot": "grid-item-surface", "data-chrome": chrome ? 'on' : 'off', className: chrome
+                        }, title: `Hide ${label}`, "aria-label": `Hide ${label}`, children: _jsx(EyeOff, { className: "h-3 w-3", "aria-hidden": "true" }) })), _jsx("div", { "data-slot": "grid-item-surface", "data-chrome": chrome ? 'on' : 'off', "data-grid-slot-key": id, className: chrome
                             ? // ONE radius token, read by the grid item AND available to any
                                 // app card that opts into the same surface. Two surfaces
                                 // reading the SAME var is what makes their corners align, and

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bsuite/page-builder",
-  "version": "2.2.0",
+  "version": "2.3.1",
   "description": "Shared BSuite responsive page-builder grid and layout persistence primitives",
   "type": "module",
   "license": "UNLICENSED",