@grafloria/element 0.4.16 → 0.4.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafloria/element",
-  "version": "0.4.16",
+  "version": "0.4.17",
   "type": "module",
   "main": "./src/index.js",
   "types": "./src/index.d.ts",

package/src/lib/dashboard-kit/dashboard.js

@@ -1128,7 +1128,7 @@ export function dashboard(options) {
              * its metadata, a fresh binder on the same group, selection carried.
              */
             function rebindContainerLayout(id, next) {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+                var _a, _b, _c, _d, _e, _f;
                 const cg = ctx.boardGroups.get(id);
                 const w = specById.get(id);
                 const b = binders.get(id);
@@ -1162,14 +1162,13 @@ export function dashboard(options) {
                 // a child escalation grew to two rows must keep them through a
                 // split → grid round trip (the visual gate caught it collapsing to one
                 // inside a two-row slab).
-                const slabRows = (_c = (_b = binders.get((_a = ctx.viewOfWidget.get(id)) !== null && _a !== void 0 ? _a : '')) === null || _b === void 0 ? void 0 : _b.cellOf(id)) === null || _c === void 0 ? void 0 : _c.h;
-                const authored = (_d = w.maxRows) !== null && _d !== void 0 ? _d : rowExtentOf((_e = w.widgets) !== null && _e !== void 0 ? _e : []);
-                bindContainer(cg, w, (_f = ctx.viewOfBoard.get(id)) !== null && _f !== void 0 ? _f : ctx.active, Math.max(authored, slabRows !== null && slabRows !== void 0 ? slabRows : 0));
-                (_g = binders.get(id)) === null || _g === void 0 ? void 0 : _g.sync();
+                void ((_b = binders.get((_a = ctx.viewOfWidget.get(id)) !== null && _a !== void 0 ? _a : '')) === null || _b === void 0 ? void 0 : _b.cellOf(id));
+                bindContainer(cg, w, (_c = ctx.viewOfBoard.get(id)) !== null && _c !== void 0 ? _c : ctx.active);
+                (_d = binders.get(id)) === null || _d === void 0 ? void 0 : _d.sync();
                 if (focused)
-                    (_h = binders.get(id)) === null || _h === void 0 ? void 0 : _h.focusWidget(focused);
+                    (_e = binders.get(id)) === null || _e === void 0 ? void 0 : _e.focusWidget(focused);
                 else if (selected)
-                    (_j = binders.get(id)) === null || _j === void 0 ? void 0 : _j.selectWidget(selected);
+                    (_f = binders.get(id)) === null || _f === void 0 ? void 0 : _f.selectWidget(selected);
             }
             (_m = ctx.attachHistory) === null || _m === void 0 ? void 0 : _m.call(ctx);
             return;
@@ -1273,7 +1272,7 @@ export function dashboard(options) {
             }
             /** Bind (or re-bind) a container's inner grid on its group. */
             function bindContainer(cg, w, viewId, innerRows) {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
                 void viewId;
                 // The LIVE switches ride on the view's binder when it exists (a
                 // container bound after a setStatic/setRtl/setDragHandle must match).
@@ -1290,7 +1289,10 @@ export function dashboard(options) {
                     binders.set(w.id, bindDashboardSplit(a, cg, Object.assign(Object.assign({}, inner), (w.tree !== undefined ? { tree: w.tree } : {}))));
                     return;
                 }
-                binders.set(w.id, bindDashboardGrid(a, cg, Object.assign(Object.assign({}, inner), { sizing: 'fit', designHeight: 0, maxRows: (_j = innerRows !== null && innerRows !== void 0 ? innerRows : w.maxRows) !== null && _j !== void 0 ? _j : rowExtentOf((_k = w.widgets) !== null && _k !== void 0 ? _k : []), float: false, escalate: w.sizing !== 'fit' })));
+                binders.set(w.id, bindDashboardGrid(a, cg, Object.assign(Object.assign({}, inner), { sizing: 'fit', designHeight: 0, 
+                    // The DESIGN: authored, else what the group was mounted with, else
+                    // the children's extent — the binder's live bound follows the cells.
+                    maxRows: (_l = (_j = innerRows !== null && innerRows !== void 0 ? innerRows : w.maxRows) !== null && _j !== void 0 ? _j : (_k = cg.getMetadata('containerWidget')) === null || _k === void 0 ? void 0 : _k.maxRows) !== null && _l !== void 0 ? _l : rowExtentOf((_m = w.widgets) !== null && _m !== void 0 ? _m : []), float: false, escalate: w.sizing !== 'fit' })));
             }
             /**
              * One reporter for every binder on a view — the view's own and each

package/src/lib/dashboard-kit/grid-binder.js

@@ -280,8 +280,17 @@ export function bindDashboardGrid(api, group, options = {}) {
     const minRowHeight = (_e = options.minRowHeight) !== null && _e !== void 0 ? _e : 28;
     const squeeze = options.squeeze !== false;
     let float = (_f = options.float) !== null && _f !== void 0 ? _f : false;
-    /** The AUTHORED bound — a nested strip's design (row-first push, escalation). */
-    const maxRows = options.maxRows;
+    /**
+     * The AUTHORED bound — a nested section's design (row-first push,
+     * escalation) — and the LIVE bound the gestures respect. A section that
+     * escalation grew holds more rows than its design; the live bound follows
+     * the members' extent on every rebuild (reload, undo, refresh), and a shrink
+     * never takes the section below `designRows`.
+     */
+    const designRows = options.maxRows;
+    let maxRows = options.maxRows;
+    const extentOf = (items) => items.reduce((m, i) => Math.max(m, i.y + i.h), 0);
+    const liveBound = (items) => designRows === undefined ? undefined : Math.max(designRows, extentOf(items));
     /** May a pull past the bound grow the slab in the parent? `false` = the pane is the bound. */
     const escalate = options.escalate !== false;
     const dragOut = (_g = options.dragOut) !== null && _g !== void 0 ? _g : 'cancel';
@@ -314,6 +323,7 @@ export function bindDashboardGrid(api, group, options = {}) {
      * kit's documented boot contract) and turning float off.
      */
     const engineFrom = (items, pack = false, at = columns) => {
+        maxRows = liveBound(items);
         const e = new GridPackEngine(items, { columns: at, float: pack ? float : true, maxRows, capacity });
         e.float = float;
         return e;
@@ -1171,6 +1181,10 @@ export function bindDashboardGrid(api, group, options = {}) {
             else {
                 engine.cancelGesture();
             }
+            if (designRows !== undefined) {
+                maxRows = liveBound(engine.getItems());
+                engine.maxRows = maxRows;
+            }
             // Restore every pixel to its gesture-start state.
             writing = true;
             try {
@@ -1375,23 +1389,24 @@ export function bindDashboardGrid(api, group, options = {}) {
         // the strip's CURRENT slab rows, whatever gesture created them; the
         // ledger just accumulates this gesture's net change for the one-batch
         // commit and for Escape.
-        // ESCALATION SCALES THE WHOLE STRIP — every tile inside taller together
-        // (s21, the model the user agreed on for a KPI strip). That is only sane
-        // when the pulled tile spans the strip's full height, which every tile of
-        // a one-row strip does. A partial-height tile in a MULTI-ROW section
-        // resizes within the section and is refused past its rows: the first
-        // version compared the tile's height with the whole section and shrank a
-        // 14-row control panel to 4 rows under a 150-px pull on a one-row
-        // drop-down (Quantia, Groups page — "boom its destroyed"). And a section
-        // never shrinks below its designed rows.
-        const pulled = engine.getItem(g.id);
-        const spansStrip = !!pulled && pulled.y === 0 && pulled.h >= (maxRows !== null && maxRows !== void 0 ? maxRows : Infinity);
-        if (maxRows !== undefined && escalate && spansStrip && g.kind === 'resize') {
+        // NESTED ESCALATION — a section is a board one level down, and a pull
+        // inside it can need rows the section does not hold. Two shapes:
+        //  · a tile spanning the section's FULL HEIGHT (every tile of a one-row
+        //    KPI strip): the section gains a row and every full-height tile grows
+        //    with it — a row of tiles pulled taller stays a row (s21) — and gives
+        //    it back when pulled up, never below the design;
+        //  · a PARTIAL tile (a one-row control in a 14-row panel): it pushes what
+        //    is below it; a row the pushed layout needs and the section does not
+        //    hold is asked of the board, one per pointer step, and rows the
+        //    layout no longer needs go back. The board decides: grow extends, fit
+        //    squeezes or refuses. The first version grew the section only for
+        //    the full-height case and REFUSED the partial one; before that it
+        //    shrank a 14-row panel to 4 (Quantia, Groups page).
+        // The live bound `maxRows` follows the section's rows through all of it.
+        if (designRows !== undefined && maxRows !== undefined && escalate && g.kind === 'resize') {
             const parent = parentPeer();
-            if (parent) {
-                const visual = boardVisualHeight();
-                const slabRows = (_h = (_g = parent.memberCell(group.id)) === null || _g === void 0 ? void 0 : _g.h) !== null && _h !== void 0 ? _h : 1;
-                const rowPx = visual / Math.max(1, slabRows);
+            const pulled = engine.getItem(g.id);
+            if (parent && pulled) {
                 const record = (res, d) => {
                     if (!res.changed || !res.cellBefore || !res.cellAfter || !res.frameBefore || !res.frameAfter)
                         return;
@@ -1408,14 +1423,83 @@ export function bindDashboardGrid(api, group, options = {}) {
                     g.esc.rowsAdded += d;
                     g.esc.cellAfter = res.cellAfter;
                     g.esc.frameAfter = res.frameAfter;
-                    project();
                 };
-                if (h > visual + 24) {
-                    record(parent.resizeMemberBy(group.id, +1), +1);
+                const setInnerRows = (n) => {
+                    maxRows = n;
+                    engine.maxRows = n;
+                };
+                const slabRows = (_h = (_g = parent.memberCell(group.id)) === null || _g === void 0 ? void 0 : _g.h) !== null && _h !== void 0 ? _h : maxRows;
+                const inner = maxRows;
+                const rhNow = rowHeightFor(geom(), rows());
+                const rowPx = rhNow + gap;
+                // The SAME rounding the resize path quantises with, or the tile shrinks
+                // through that path first and the section never gets its row back.
+                const wantRows = Math.max(1, Math.round((h + gap) / rowPx));
+                const wantsMore = wantRows > pulled.h;
+                const wantsLess = wantRows < pulled.h;
+                const fullHeight = pulled.y === 0 && pulled.h >= inner;
+                const fullOnes = engine.getItems().filter((i) => i.y === 0 && i.h >= inner).map((i) => i.id);
+                const resizeAll = (ids, rowsTo) => {
+                    for (const id of ids) {
+                        const it = engine.getItem(id);
+                        if (it)
+                            engine.resizeCheck(id, it.w, rowsTo);
+                    }
+                };
+                let touched = false;
+                if (wantsMore) {
+                    if (fullHeight) {
+                        const res = parent.resizeMemberBy(group.id, +1);
+                        if (res.changed) {
+                            record(res, +1);
+                            setInnerRows(inner + 1);
+                            resizeAll(fullOnes, inner + 1);
+                            touched = true;
+                        }
+                    }
+                    else if (!engine.resizeCheck(g.id, pulled.w, pulled.h + 1).changed) {
+                        const res = parent.resizeMemberBy(group.id, +1);
+                        if (res.changed) {
+                            record(res, +1);
+                            setInnerRows(inner + 1);
+                            engine.resizeCheck(g.id, pulled.w, pulled.h + 1);
+                            touched = true;
+                        }
+                    }
+                    else {
+                        touched = true;
+                    }
                 }
-                else if (slabRows > Math.max(1, maxRows) && h < visual - rowPx * 0.7) {
-                    record(parent.resizeMemberBy(group.id, -1), -1);
+                else if (wantsLess) {
+                    if (fullHeight) {
+                        if (slabRows > designRows && inner > 1) {
+                            resizeAll(fullOnes, inner - 1);
+                            const res = parent.resizeMemberBy(group.id, -1);
+                            if (res.changed) {
+                                record(res, -1);
+                                setInnerRows(inner - 1);
+                            }
+                            else {
+                                resizeAll(fullOnes, inner);
+                            }
+                            touched = true;
+                        }
+                    }
+                    else if (pulled.h > 1) {
+                        engine.resizeCheck(g.id, pulled.w, pulled.h - 1);
+                        const floor = Math.max(designRows, extentOf(engine.getItems()));
+                        if (slabRows > floor) {
+                            const res = parent.resizeMemberBy(group.id, -1);
+                            if (res.changed) {
+                                record(res, -1);
+                                setInnerRows(inner - 1);
+                            }
+                        }
+                        touched = true;
+                    }
                 }
+                if (touched)
+                    project();
             }
         }
         // The fluid preview must not outrun what the board can accept: on a