@dynamix-layout/solid 1.0.2 → 1.1.0

package/dist/index.es.js

@@ -1,10 +1,10 @@
-import { spread as T, mergeProps as $, insert as y, memo as ie, effect as Ee, setStyleProperty as De, template as H, createComponent as v, use as Te } from "solid-js/web";
-import { DynamixLayoutCore as D, Node as x, setElementRect as Y, createFrameScheduler as $e, getTabBodyRect as Se, getNavbarDropPreview as Ne, getRootSplitPreview as Re, isSameDropPreview as ze, getTabsetDropPreview as Oe } from "@dynamix-layout/core";
-import { splitProps as He, createMemo as se, createSignal as W, onMount as Pe, onCleanup as Ce, For as L } from "solid-js";
-var P = H("<div>"), _e = H("<div><div style=display:flex;align-items:center;gap:4px;height:100%>"), Ie = H('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="lucide lucide-grip-vertical size-2.5"><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'), We = H('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round style=transform:rotate(90deg)><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>');
-const Le = (e) => (() => {
-  var a = P();
-  return T(a, $(e, {
+import { spread as O, mergeProps as _, insert as y, memo as ee, effect as le, setStyleProperty as Fe, createComponent as p, setAttribute as W, template as I, style as Ae, use as Ee, delegateEvents as Be } from "solid-js/web";
+import { DynamixLayoutCore as C, Node as w, setElementRect as ve, placeTabbar as je, getTabbarPlacement as De, createFrameScheduler as Ue, getTabBodyRect as qe, getNavbarDropPreview as Ke, getRootSplitPreview as Xe, isSameDropPreview as Ve, getTabsetDropPreview as Ye } from "@dynamix-layout/core";
+import { onMount as $e, splitProps as Je, createMemo as ze, onCleanup as Se, createSignal as G, For as Q } from "solid-js";
+var A = I("<div>"), Ze = I("<div><div style=display:flex;align-items:center;gap:4px;height:100%>"), Ge = I('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="lucide lucide-grip-vertical size-2.5"><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'), Qe = I('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round style=transform:rotate(90deg)><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'), et = I('<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round aria-hidden=true><path>'), tt = I("<div class=DefaultTabsetToolbar>"), pe = I("<button type=button class=DefaultTabsetToolbarButton>");
+const rt = (e) => (() => {
+  var a = A();
+  return O(a, _(e, {
     get class() {
       return `DefaultWrapTabLabel ${e.class || ""}`;
     },
@@ -22,9 +22,9 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(a, () => e.children), a;
-})(), ke = (e) => (() => {
-  var a = P();
-  return T(a, $(e, {
+})(), nt = (e) => (() => {
+  var a = A();
+  return O(a, _(e, {
     get class() {
       return `DefaultWrapTabBody hide-scrollbar ${e.class || ""}`;
     },
@@ -41,9 +41,9 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(a, () => e.children), a;
-})(), Be = (e) => (() => {
-  var a = P();
-  return T(a, $(e, {
+})(), at = (e) => (() => {
+  var a = A();
+  return O(a, _(e, {
     get class() {
       return `DefaultWrapTabHead hide-scrollbar ${e.class || ""}`;
     },
@@ -67,9 +67,9 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(a, () => e.children), a;
-})(), Me = (e) => (() => {
-  var a = P();
-  return T(a, $(e, {
+})(), ot = (e) => (() => {
+  var a = A();
+  return O(a, _(e, {
     get class() {
       return `DefaultWrapTabPanel ${e.class || ""}`;
     },
@@ -85,9 +85,9 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(a, () => e.children), a;
-})(), Ae = (e) => (() => {
-  var a = P();
-  return T(a, $(e, {
+})(), it = (e) => (() => {
+  var a = A();
+  return O(a, _(e, {
     get class() {
       return `DefaultHoverElement ${e.class || ""}`;
     },
@@ -109,9 +109,9 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(a, () => e.children), a;
-})(), je = (e) => (() => {
-  var a = _e(), h = a.firstChild;
-  return T(a, $(e, {
+})(), lt = (e) => (() => {
+  var a = Ze(), h = a.firstChild;
+  return O(a, _(e, {
     get class() {
       return `DefaultSliderElement ${e.class || ""}`;
     },
@@ -128,44 +128,44 @@ const Le = (e) => (() => {
       };
     }
   }), !1, !0), y(h, (() => {
-    var g = ie(() => !e.direction);
-    return () => g() ? Ie() : We();
-  })()), y(a, () => e.children, null), Ee((g) => De(h, "flex-direction", e.direction ? "column" : "row")), a;
-})(), Fe = (e) => {
-  const [a, h] = He(e, ["area", "size", "gap", "class", "style", "children"]), g = se(() => {
-    const s = a.size || {
+    var s = ee(() => !e.direction);
+    return () => s() ? Ge() : Qe();
+  })()), y(a, () => e.children, null), le((s) => Fe(h, "flex-direction", e.direction ? "column" : "row")), a;
+})(), dt = (e) => {
+  const [a, h] = Je(e, ["area", "size", "gap", "class", "style", "children"]), s = ze(() => {
+    const o = a.size || {
       h: "20%",
       w: "6px"
-    }, b = a.gap || "0px", u = {};
-    return a.area === "left" ? (Object.assign(u, {
+    }, u = a.gap || "0px", c = {};
+    return a.area === "left" ? (Object.assign(c, {
       "border-top-right-radius": "16px",
       "border-bottom-right-radius": "16px",
-      height: s.h,
-      left: b,
-      width: s.w
-    }), u.top = `calc(50% - ${s.h} / 2)`) : a.area === "top" ? (Object.assign(u, {
+      height: o.h,
+      left: u,
+      width: o.w
+    }), c.top = `calc(50% - ${o.h} / 2)`) : a.area === "top" ? (Object.assign(c, {
       "border-bottom-left-radius": "16px",
       "border-bottom-right-radius": "16px",
-      width: s.h,
-      top: b,
-      height: s.w
-    }), u.left = `calc(50% - ${s.h} / 2)`) : a.area === "right" ? (Object.assign(u, {
+      width: o.h,
+      top: u,
+      height: o.w
+    }), c.left = `calc(50% - ${o.h} / 2)`) : a.area === "right" ? (Object.assign(c, {
       "border-top-left-radius": "16px",
       "border-bottom-left-radius": "16px",
-      height: s.h,
-      right: b,
-      width: s.w
-    }), u.top = `calc(50% - ${s.h} / 2)`) : a.area === "bottom" && (Object.assign(u, {
+      height: o.h,
+      right: u,
+      width: o.w
+    }), c.top = `calc(50% - ${o.h} / 2)`) : a.area === "bottom" && (Object.assign(c, {
       "border-top-left-radius": "16px",
       "border-top-right-radius": "16px",
-      width: s.h,
-      bottom: b,
-      height: s.w
-    }), u.left = `calc(50% - ${s.h} / 2)`), u;
+      width: o.h,
+      bottom: u,
+      height: o.w
+    }), c.left = `calc(50% - ${o.h} / 2)`), c;
   });
   return (() => {
-    var s = P();
-    return T(s, $(h, {
+    var o = A();
+    return O(o, _(h, {
       get class() {
         return `RootSplitterHoverEl ${a.class || ""}`;
       },
@@ -178,146 +178,253 @@ const Le = (e) => (() => {
           "background-color": "#0081f9",
           cursor: "grab",
           ...a.style,
-          ...g()
+          ...s()
         };
       }
-    }), !1, !0), y(s, () => a.children), s;
+    }), !1, !0), y(o, () => a.children), o;
   })();
-}, Ue = ({
+}, Te = (e) => (() => {
+  var a = et(), h = a.firstChild;
+  return le((s) => {
+    var o = e.rotate ? {
+      transform: `rotate(${e.rotate}deg)`
+    } : {}, u = e.path;
+    return s.e = Ae(a, o, s.e), u !== s.t && W(h, "d", s.t = u), s;
+  }, {
+    e: void 0,
+    t: void 0
+  }), a;
+})(), st = "M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3", ct = "M8 3v3a2 2 0 0 1-2 2H3M21 8h-3a2 2 0 0 1-2-2V3M3 16h3a2 2 0 0 1 2 2v3M16 21v-3a2 2 0 0 1 2-2h3", ut = "m15 18-6-6 6-6", gt = (e) => {
+  const a = () => (e.rowIsHorizontal ? 0 : 90) + (e.folded ? 180 : 0), h = () => e.rotated ? -90 : 0;
+  let s;
+  return $e(() => {
+    const o = s?.parentElement;
+    if (!s || !o) return;
+    const u = () => {
+      s.style.transform = `translateX(${o.scrollLeft}px)`;
+    };
+    u(), o.addEventListener("scroll", u, {
+      passive: !0
+    }), Se(() => o.removeEventListener("scroll", u));
+  }), (() => {
+    var o = tt();
+    o.$$dblclick = (c) => c.stopPropagation();
+    var u = s;
+    return typeof u == "function" ? Ee(u, o) : s = o, y(o, (() => {
+      var c = ee(() => !!e.showMaximize);
+      return () => c() && (() => {
+        var v = pe();
+        return v.$$click = () => e.onToggleMaximize(), y(v, p(Te, {
+          get path() {
+            return e.maximized ? ct : st;
+          },
+          get rotate() {
+            return h();
+          }
+        })), le((f) => {
+          var T = e.maximized ? "Restore" : "Maximize", k = e.maximized, z = e.maximized ? "Restore (⌥ +)" : "Maximize (⌥ +)";
+          return T !== f.e && W(v, "aria-label", f.e = T), k !== f.t && W(v, "aria-pressed", f.t = k), z !== f.a && W(v, "title", f.a = z), f;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0
+        }), v;
+      })();
+    })(), null), y(o, (() => {
+      var c = ee(() => !!e.showFold);
+      return () => c() && (() => {
+        var v = pe();
+        return v.$$click = () => e.onToggleFold(), y(v, p(Te, {
+          path: ut,
+          get rotate() {
+            return a() + h();
+          }
+        })), le((f) => {
+          var T = e.folded ? "Unfold" : "Fold", k = !e.folded, z = e.folded ? "Unfold (⌥ -)" : "Fold (⌥ -)";
+          return T !== f.e && W(v, "aria-label", f.e = T), k !== f.t && W(v, "aria-expanded", f.t = k), z !== f.a && W(v, "title", f.a = z), f;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0
+        }), v;
+      })();
+    })(), null), o;
+  })();
+};
+Be(["dblclick", "click"]);
+const ft = ({
   tabOutput: e,
   rootId: a,
   layoutTree: h,
-  updateJSON: g,
-  dimensions: s,
-  tabHeadHeight: b,
-  enableTabbar: u,
-  bondWidth: J,
-  minTabHeight: k,
-  minTabWidth: R,
-  sliderUpdateTimeout: K,
-  windowResizeTimeout: B,
-  disableSliderTimeout: C,
-  disableResizeTimeout: _
+  updateJSON: s,
+  dimensions: o,
+  tabHeadHeight: u,
+  enableTabbar: c,
+  bondWidth: v,
+  minTabHeight: f,
+  minTabWidth: T,
+  sliderUpdateTimeout: k,
+  windowResizeTimeout: z,
+  disableSliderTimeout: B,
+  disableResizeTimeout: j,
+  keyboardShortcuts: U = !0,
+  enableDoubleClickMaximize: de = !0
 }) => {
-  const z = /* @__PURE__ */ new Map(), M = /* @__PURE__ */ new Map(), O = /* @__PURE__ */ new Map(), A = /* @__PURE__ */ new Map(), w = { current: void 0 }, I = [], [j, G] = W(
+  const q = /* @__PURE__ */ new Map(), te = /* @__PURE__ */ new Map(), K = /* @__PURE__ */ new Map(), re = /* @__PURE__ */ new Map(), D = { current: void 0 }, X = [], [V, F] = G(
     h
-  ), [F, S] = W(
+  ), [se, ne] = G(
     /* @__PURE__ */ new Map()
-  ), [Q, U] = W(
+  ), [ce, ae] = G(
     /* @__PURE__ */ new Map()
-  ), [V, p] = W(!1);
-  let E = null;
-  const [Z, m] = W(!1), o = {
+  ), [ue, $] = G(!1);
+  let S = null;
+  const [ge, fe] = G(!1), i = {
     src: void 0,
     des: void 0,
     area: void 0,
     drag: !1
-  }, n = {
+  }, R = {
     sliderId: void 0,
     isSliding: !1
-  }, d = u ? Math.max(k, b) : k, c = new D({
+  }, oe = c ? Math.max(f, u) : f, M = new C({
     tabs: e.keys,
-    tree: j(),
-    minW: R,
-    minH: d,
-    bond: J,
+    tree: V(),
+    minW: T,
+    minH: oe,
+    bond: v,
     uqid: a,
-    tabsIds: e.name
-  }), ne = (t) => {
+    tabsIds: e.name,
+    collapsedSize: c ? u : oe
+  }), Y = (t) => {
     const r = new Map(t);
-    S(r);
-  }, ae = (t) => {
+    ne(r);
+  }, J = (t) => {
     const r = new Map(t);
-    U(r);
-  }, q = () => {
-    const t = u ? b : 0;
-    x.cache.tabOpts.get().forEach((r, l) => {
-      const i = A.get(l);
-      if (!i) return;
-      const f = Se(r.nodDims, t);
-      Y(i, f), i.style.display = r.nodOpen && f.h > 0 ? "block" : "none";
+    ae(r);
+  }, b = () => {
+    const t = c ? u : 0;
+    w.cache.tabOpts.get().forEach((r, d) => {
+      const l = re.get(d);
+      if (!l) return;
+      const g = qe(r.nodDims, t);
+      ve(l, g);
+      const we = r.nodOpen && !r.nodFold && !r.nodHidden && g.h > 0;
+      l.style.display = we ? "block" : "none";
     });
-  }, le = x.cache.nodOpts.onChange(
+  }, N = w.cache.nodOpts.onChange(
     (t) => {
-      t.forEach((r, l) => {
-        const i = O.get(l);
-        i && Y(i, r.nodDims);
-        const f = z.get(l);
-        f && u && Y(f, {
-          ...r.nodDims,
-          h: b
-        });
+      t.forEach((r, d) => {
+        const l = K.get(d);
+        l && ve(l, r.nodDims);
+        const g = q.get(d);
+        g && c && (g.toggleAttribute("data-dx-hidden", !!r.nodHidden), je(
+          g,
+          De(r, u)
+        ));
       });
     }
-  ), de = x.cache.tabOpts.onChange(() => q()), ce = x.cache.bndOpts.onChange(
+  ), n = w.cache.tabOpts.onChange(() => b()), m = w.cache.bndOpts.onChange(
     (t) => {
-      t.forEach((r, l) => {
-        const i = M.get(l);
-        i && Y(i, r.nodDims);
+      t.forEach((r, d) => {
+        const l = te.get(d);
+        l && (ve(l, r.nodDims), l.toggleAttribute("data-dx-hidden", !!r.nodHidden), l.style.pointerEvents = r.nodLocked ? "none" : "");
       });
     }
-  ), ee = $e(
-    ({ id: t, point: r }) => c.updateSlider(
+  ), x = Ue(
+    ({ id: t, point: r }) => M.updateSlider(
       t,
       r,
-      C,
-      K
+      B,
+      k
     )
-  ), oe = (t) => {
-    const r = n.sliderId;
-    !n.isSliding || !r || ee.schedule({ id: r, point: { x: t.clientX, y: t.clientY } });
-  }, X = (t) => {
-    if (!n.isSliding) return;
-    ee.flush();
+  ), Z = (t) => {
+    const r = R.sliderId;
+    !R.isSliding || !r || x.schedule({ id: r, point: { x: t.clientX, y: t.clientY } });
+  }, P = (t) => {
+    if (!R.isSliding) return;
+    x.flush();
     const r = t.currentTarget;
-    n.isSliding = !1, n.sliderId = void 0, p(!1), g && g(D._root.toJSON()), r.releasePointerCapture(t.pointerId), r.removeEventListener("pointermove", oe), r.removeEventListener("pointerup", X), r.removeEventListener("pointercancel", X);
-  }, ue = (t) => {
+    R.isSliding = !1, R.sliderId = void 0, $(!1), s && s(C._root.toJSON()), r.releasePointerCapture(t.pointerId), r.removeEventListener("pointermove", Z), r.removeEventListener("pointerup", P), r.removeEventListener("pointercancel", P);
+  }, E = (t) => {
     t.preventDefault();
     const r = t.currentTarget;
-    n.isSliding = !0, n.sliderId = r.id, p(!0), r.setPointerCapture(t.pointerId), r.addEventListener("pointermove", oe), r.addEventListener("pointerup", X), r.addEventListener("pointercancel", X);
+    R.isSliding = !0, R.sliderId = r.id, $(!0), r.setPointerCapture(t.pointerId), r.addEventListener("pointermove", Z), r.addEventListener("pointerup", P), r.addEventListener("pointercancel", P);
   };
-  let te = {};
-  const ge = (t, r, l) => {
-    if (!w.current || !o || !l)
+  let H = {};
+  const Me = (t, r, d) => {
+    if (!D.current || !i || !d)
       return null;
-    const i = Oe(
-      l.getBoundingClientRect(),
+    const l = Ye(
+      d.getBoundingClientRect(),
       t,
       r
     );
-    re(i), o.des = l, o.area = i.area;
-  }, fe = (t) => {
+    ie(l), i.des = d, i.area = l.area;
+  }, Ce = (t) => {
     t.preventDefault(), t.stopPropagation(), t.dataTransfer && (t.dataTransfer.dropEffect = "move");
-    const r = t.currentTarget, l = Array.from(
-      r.childNodes
+    const r = t.currentTarget;
+    if (r.hasAttribute("data-rotated")) {
+      if (!D.current || !i) return;
+      const g = r.getBoundingClientRect();
+      ie({
+        area: "contain",
+        left: g.left,
+        top: g.top,
+        width: g.width,
+        height: g.height
+      }), i.des = r, i.area = "contain";
+      return;
+    }
+    const d = Array.from(
+      r.querySelectorAll(
+        ':scope > [data-type="tab"]'
+      )
     );
-    if (!w.current || !o) return;
-    const i = Ne(
+    if (!D.current || !i) return;
+    const l = Ke(
       r.getBoundingClientRect(),
-      l.map((f) => f.getBoundingClientRect()),
+      d.map((g) => g.getBoundingClientRect()),
       t.clientX,
       t.clientY
     );
-    i && (re(i), o.des = l[i.index], o.area = i.area);
-  }, me = (t) => {
+    l && (ie(l), i.des = d[l.index], i.area = l.area);
+  }, ke = (t) => {
     t.preventDefault(), t.stopPropagation(), t.dataTransfer && (t.dataTransfer.dropEffect = "move");
-    const r = t.currentTarget, { area: l, uid: i } = r.dataset;
-    if (!l || !i || !w.current || !o)
+    const r = t.currentTarget, { area: d, uid: l } = r.dataset;
+    if (!d || !l || !D.current || !i)
       return;
-    const f = l;
-    o.des = r, o.area = f, re(Re(s(), f));
-  }, re = (t) => {
-    const r = w.current;
-    !r || ze(te, t) || (Object.assign(r.style, {
+    const g = d;
+    i.des = r, i.area = g, ie(Xe(o(), g));
+  }, ie = (t) => {
+    const r = D.current;
+    !r || Ve(H, t) || (Object.assign(r.style, {
       left: `${t.left}px`,
       top: `${t.top}px`,
       width: `${t.width}px`,
       height: `${t.height}px`,
       display: "block",
       zIndex: "100"
-    }), te = t);
-  }, he = (t) => {
-    if (t.stopPropagation(), p(!0), document.body.style.cursor = "move", t.currentTarget) {
+    }), H = t);
+  };
+  let me = null;
+  const he = () => {
+    Y(w.cache.nodOpts.get()), J(w.cache.bndOpts.get()), b(), s && s(C._root.toJSON());
+  }, be = (t) => {
+    M.toggleMaximize(t) && he();
+  }, ye = (t) => {
+    M.toggleCollapse(t) && he();
+  }, Re = (t) => {
+    const r = t.target.closest("[data-uid]"), d = r?.dataset.uid ? w.cache.mapElem.get(r.dataset.uid) : void 0;
+    d instanceof w && (d.type === "tabset" ? me = d.unId : d.type === "tab" && d.host && (me = d.host.unId));
+  }, Ne = (t) => {
+    const r = t.currentTarget.dataset.uid;
+    de && r && be(r);
+  }, xe = (t) => {
+    if (!U || !t.altKey || t.ctrlKey || t.metaKey) return;
+    const r = me ?? M.maximizedId;
+    r && (t.code === "Equal" || t.code === "NumpadAdd" ? (t.preventDefault(), be(r)) : (t.code === "Minus" || t.code === "NumpadSubtract") && (t.preventDefault(), ye(r)));
+  }, He = (t) => {
+    if (t.stopPropagation(), M.restore() && he(), $(!0), document.body.style.cursor = "move", t.currentTarget) {
       if (t.dataTransfer) {
         t.dataTransfer.effectAllowed = "move";
         const r = document.createElement("div");
@@ -325,202 +432,212 @@ const Le = (e) => (() => {
           r.parentNode && r.parentNode.removeChild(r);
         }, 0);
       }
-      I.forEach((r) => {
+      X.forEach((r) => {
         r && (r.style.display = "block", r.style.zIndex = "99");
-      }), O.forEach((r) => {
+      }), K.forEach((r) => {
         r && (r.style.display = "block", r.style.zIndex = "95");
-      }), o.src = t.currentTarget, o.drag = !0;
+      }), i.src = t.currentTarget, i.drag = !0;
     }
-  }, be = (t) => {
-    if (t.preventDefault(), t.stopPropagation(), document.body.style.cursor = "move", t.dataTransfer && (t.dataTransfer.dropEffect = "move"), !o?.src)
+  }, Ie = (t) => {
+    if (t.preventDefault(), t.stopPropagation(), document.body.style.cursor = "move", t.dataTransfer && (t.dataTransfer.dropEffect = "move"), !i?.src)
       return;
-    const r = t.currentTarget, l = t.clientX, i = t.clientY;
-    E && cancelAnimationFrame(E), E = requestAnimationFrame(() => {
-      ge(l, i, r);
+    const r = t.currentTarget, d = t.clientX, l = t.clientY;
+    S && cancelAnimationFrame(S), S = requestAnimationFrame(() => {
+      Me(d, l, r);
     });
-  }, ye = () => {
-    if (document.body.style.cursor = "default", I.forEach((t) => {
+  }, Oe = () => {
+    if (document.body.style.cursor = "default", X.forEach((t) => {
       t && (t.style.display = "none", t.style.zIndex = "-1");
-    }), E && (cancelAnimationFrame(E), E = null), w.current && (w.current.style.display = "none", w.current.style.zIndex = "-1"), te = {}, o.drag = !1, !o?.src || !o?.des) {
-      o.area = void 0, o.src = void 0, o.des = void 0, p(!1);
+    }), S && (cancelAnimationFrame(S), S = null), D.current && (D.current.style.display = "none", D.current.style.zIndex = "-1"), H = {}, i.drag = !1, !i?.src || !i?.des) {
+      i.area = void 0, i.src = void 0, i.des = void 0, $(!1);
       return;
     }
-    if (o.src === o.des) {
-      o.area = void 0, o.src = void 0, o.des = void 0, p(!1);
+    if (i.src === i.des) {
+      i.area = void 0, i.src = void 0, i.des = void 0, $(!1);
       return;
     }
-    if (o.src && o.des) {
-      if (!o.area) {
-        console.warn("No area specified for drag and drop"), p(!1);
+    if (i.src && i.des) {
+      if (!i.area) {
+        console.warn("No area specified for drag and drop"), $(!1);
         return;
       }
-      if (!c.updateTree(
-        o.src.dataset.uid,
-        o.des.dataset.uid,
-        o.area || "contain"
+      if (!M.updateTree(
+        i.src.dataset.uid,
+        i.des.dataset.uid,
+        i.area || "contain"
       )) {
-        console.warn("Failed to update layout tree"), p(!1);
+        console.warn("Failed to update layout tree"), $(!1);
         return;
       }
       requestAnimationFrame(() => {
-        ne(x.cache.nodOpts.get()), ae(x.cache.bndOpts.get()), q(), g && g(D._root.toJSON());
+        Y(w.cache.nodOpts.get()), J(w.cache.bndOpts.get()), b(), s && s(C._root.toJSON());
       });
     }
-    o.area = void 0, o.src = void 0, o.des = void 0, p(!1);
-  }, ve = (t) => {
+    i.area = void 0, i.src = void 0, i.des = void 0, $(!1);
+  }, _e = (t) => {
     t.preventDefault(), t.stopPropagation(), t.dataTransfer && (t.dataTransfer.dropEffect = "move");
-  }, pe = (t) => {
+  }, Pe = (t) => {
     t.preventDefault(), t.stopPropagation();
-  }, xe = (t) => {
+  }, Le = (t) => {
     t.preventDefault(), t.stopPropagation(), t.dataTransfer && t.dataTransfer.getData("text/plain");
-  }, we = (t) => {
-    const r = t.currentTarget, l = r.dataset.uid;
-    if (!l) return;
-    const i = x.cache.mapElem.get(l);
-    if (!(i instanceof x)) {
-      console.warn(`Element with uid ${l} is not a Node instance`);
+  }, We = (t) => {
+    const r = t.currentTarget, d = r.dataset.uid;
+    if (!d) return;
+    const l = w.cache.mapElem.get(d);
+    if (!(l instanceof w)) {
+      console.warn(`Element with uid ${d} is not a Node instance`);
       return;
     }
-    if (!i || !i.host || !i.host.unId) {
-      console.warn(`Node with uid ${l} not found in mapNode`);
+    if (!l || !l.host || !l.host.unId) {
+      console.warn(`Node with uid ${d} not found in mapNode`);
       return;
     }
-    if (i.host.open == i.name) {
-      console.warn(`Node ${i.name} is already open`);
+    if (l.host.open == l.name) {
+      console.warn(`Node ${l.name} is already open`);
       return;
     }
-    const f = x.cache.nodOpts.get().get(i.host.unId);
-    if (!f || f.nodOpen && i?.open)
+    const g = w.cache.nodOpts.get().get(l.host.unId);
+    if (!g || g.nodOpen && l?.open)
       return;
-    i.host.open = i.name, f.nodOpen = i.name, f.nodKids?.forEach((N) => {
-      N.nodOpen = N.nodName === i.name;
-    }), r?.parentElement?.childNodes?.forEach((N) => {
-      N instanceof HTMLDivElement && N.dataset.uid !== l ? N.dataset.state = "inactive" : N.dataset.state = "active";
-    }), q();
+    l.host.open = l.name, g.nodOpen = l.name, g.nodKids?.forEach((L) => {
+      L.nodOpen = L.nodName === l.name;
+    }), r?.parentElement?.childNodes?.forEach((L) => {
+      L instanceof HTMLDivElement && L.dataset.uid !== d ? L.dataset.state = "inactive" : L.dataset.state = "active";
+    }), b();
   };
-  return Pe(() => {
-    const t = (l) => {
-      c.updateDimension(
-        s(),
-        l,
-        B
+  return $e(() => {
+    const t = (d) => {
+      M.updateDimension(
+        o(),
+        d,
+        z
       );
     };
     t(!0);
-    const r = () => t(_ ?? !1);
-    window.addEventListener("resize", r), ne(x.cache.nodOpts.get()), ae(x.cache.bndOpts.get()), q(), g && g(D._root.toJSON()), Ce(() => {
-      window.removeEventListener("resize", r), le(), ce(), de(), ee.cancel(), E && cancelAnimationFrame(E);
+    const r = () => t(j ?? !1);
+    window.addEventListener("resize", r), window.addEventListener("keydown", xe), Y(w.cache.nodOpts.get()), J(w.cache.bndOpts.get()), b(), s && s(C._root.toJSON()), Se(() => {
+      window.removeEventListener("resize", r), window.removeEventListener("keydown", xe), N(), m(), n(), x.cancel(), S && cancelAnimationFrame(S);
     });
   }), {
-    tabsets: F,
-    sliders: Q,
-    tabsetsRef: z,
-    panelsRef: O,
-    tabsRef: A,
-    slidersRef: M,
-    layoutJSON: j,
-    layoutInstance: c,
-    hoverElementRef: w,
-    rootSplitHoverEl: I,
-    dragging: V,
-    isUpdating: Z,
-    setIsUpdating: m,
-    setDragging: p,
-    setTabsets: S,
-    setSliders: U,
-    setLayoutJSON: G,
-    onDragStart: he,
-    onDragOver: be,
-    onDragEnd: ye,
-    onDragEnter: ve,
-    onDragLeave: pe,
-    onDrop: xe,
-    onPointerDown: ue,
-    updateActiveTab: we,
-    handleRootSplit: me,
-    handleNavbarDragOver: fe
+    tabsets: se,
+    sliders: ce,
+    tabsetsRef: q,
+    panelsRef: K,
+    tabsRef: re,
+    slidersRef: te,
+    layoutJSON: V,
+    layoutInstance: M,
+    hoverElementRef: D,
+    rootSplitHoverEl: X,
+    dragging: ue,
+    isUpdating: ge,
+    setIsUpdating: fe,
+    setDragging: $,
+    setTabsets: ne,
+    setSliders: ae,
+    setLayoutJSON: F,
+    onDragStart: He,
+    onDragOver: Ie,
+    onDragEnd: Oe,
+    onDragEnter: _e,
+    onDragLeave: Pe,
+    onDrop: Le,
+    onPointerDown: E,
+    updateActiveTab: We,
+    handleRootSplit: ke,
+    handleNavbarDragOver: Ce,
+    toggleMaximize: be,
+    toggleCollapse: ye,
+    onRootPointerDown: Re,
+    onTabbarDoubleClick: Ne
   };
 };
-var qe = H("<div>"), Xe = H('<div class="flex items-center justify-center h-full"><span class=text-gray-500>No content');
-const Ye = (e) => {
-  const a = [], h = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map();
-  for (const [s, b] of e) {
-    const u = crypto.randomUUID();
-    a.push(s), h.set(s, {
-      uqid: u,
-      name: s,
-      node: b
-    }), g.set(s, u);
+var mt = I("<div>"), ht = I('<div class="flex items-center justify-center h-full"><span class=text-gray-500>No content');
+const bt = (e) => {
+  const a = [], h = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map();
+  for (const [o, u] of e) {
+    const c = crypto.randomUUID();
+    a.push(o), h.set(o, {
+      uqid: c,
+      name: o,
+      node: u
+    }), s.set(o, c);
   }
   return {
     keys: a,
     maps: h,
-    name: g
+    name: s
   };
-}, Ve = (e) => {
-  const a = se(() => Ye(e.tabs));
+}, wt = (e) => {
+  const a = ze(() => bt(e.tabs));
   let h;
-  const g = () => {
-    const m = h;
-    if (!m) return {
+  const s = () => {
+    const b = h;
+    if (!b) return {
       w: 0,
       h: 0,
       x: 0,
       y: 0
     };
-    const o = m.getBoundingClientRect(), n = e.pad || {
+    const N = b.getBoundingClientRect(), n = e.pad || {
       t: 0,
       b: 0,
       l: 0,
       r: 0
     };
     return {
-      w: o.width - (n.l + n.r),
-      h: o.height - (n.t + n.b),
-      x: o.left + n.l,
-      y: o.top + n.t
+      w: N.width - (n.l + n.r),
+      h: N.height - (n.t + n.b),
+      x: N.left + n.l,
+      y: N.top + n.t
     };
   }, {
-    tabsetsRef: s,
-    slidersRef: b,
-    sliders: u,
-    tabsets: J,
-    hoverElementRef: k,
-    onDragEnd: R,
-    onDragOver: K,
-    onDragStart: B,
-    onDragEnter: C,
-    onDragLeave: _,
-    onDrop: z,
-    dragging: M,
-    panelsRef: O,
-    onPointerDown: A,
-    handleNavbarDragOver: w,
-    updateActiveTab: I,
-    rootSplitHoverEl: j,
-    handleRootSplit: G,
-    tabsRef: F,
-    isUpdating: S
-  } = Ue({
+    tabsetsRef: o,
+    slidersRef: u,
+    sliders: c,
+    tabsets: v,
+    hoverElementRef: f,
+    onDragEnd: T,
+    onDragOver: k,
+    onDragStart: z,
+    onDragEnter: B,
+    onDragLeave: j,
+    onDrop: U,
+    dragging: de,
+    panelsRef: q,
+    onPointerDown: te,
+    handleNavbarDragOver: K,
+    updateActiveTab: re,
+    rootSplitHoverEl: D,
+    handleRootSplit: X,
+    tabsRef: V,
+    isUpdating: F,
+    toggleMaximize: se,
+    toggleCollapse: ne,
+    onRootPointerDown: ce,
+    onTabbarDoubleClick: ae
+  } = ft({
     tabOutput: a(),
     rootId: e.rootId || "dynamix-layout-root",
     updateJSON: e.updateJSON,
     enableTabbar: e.enableTabbar === void 0 ? !0 : e.enableTabbar,
     layoutTree: e.layoutTree,
-    tabHeadHeight: e.tabHeadHeight || D._minH,
-    dimensions: g,
+    tabHeadHeight: e.tabHeadHeight || C._minH,
+    dimensions: s,
     sliderUpdateTimeout: e.sliderUpdateTimeout || 2,
     windowResizeTimeout: e.windowResizeTimeout || 2,
-    bondWidth: e.bondWidth || D._bond,
-    minTabHeight: e.minTabHeight || D._minH,
-    minTabWidth: e.minTabWidth || D._minW,
+    bondWidth: e.bondWidth || C._bond,
+    minTabHeight: e.minTabHeight || C._minH,
+    minTabWidth: e.minTabWidth || C._minW,
     disableSliderTimeout: e.disableSliderTimeout === void 0 ? !0 : e.disableSliderTimeout,
     disableResizeTimeout: e.disableResizeTimeout === void 0 ? !0 : e.disableResizeTimeout,
-    hoverElementStyles: e.hoverElementStyles
-  }), Q = e.WrapTabPanel || Me, U = e.WrapTabHead || Be, V = e.WrapTabLabel || Le, p = e.WrapTabBody || ke, E = e.SliderElement || je, Z = e.HoverElement || Ae;
+    hoverElementStyles: e.hoverElementStyles,
+    keyboardShortcuts: e.keyboardShortcuts ?? !0,
+    enableDoubleClickMaximize: e.enableDoubleClickMaximize ?? !0
+  }), ue = e.WrapTabPanel || ot, $ = e.WrapTabHead || at, S = e.WrapTabLabel || rt, ge = e.WrapTabBody || nt, fe = e.SliderElement || lt, i = e.HoverElement || it, R = e.TabsetToolbar || gt, oe = e.tabHeadHeight || C._minH, M = e.enableTabbar ?? !0, Y = e.enableMaximize ?? !0, J = (e.enableCollapse ?? !0) && M;
   return (() => {
-    var m = qe(), o = h;
-    return typeof o == "function" ? Te(o, m) : h = m, T(m, $({
+    var b = mt(), N = h;
+    return typeof N == "function" ? Ee(N, b) : h = b, O(b, _({
       get id() {
         return e.rootId || "dynamix-layout-root";
       }
@@ -529,8 +646,9 @@ const Ye = (e) => {
         return e.rootId || "dynamix-layout-root";
       },
       get class() {
-        return M() ? "is-dragging" : "";
+        return de() ? "is-dragging" : "";
       },
+      onPointerDown: ce,
       get style() {
         return {
           position: "relative",
@@ -540,118 +658,159 @@ const Ye = (e) => {
           ...e.style
         };
       }
-    }), !1, !0), y(m, v(L, {
+    }), !1, !0), y(b, p(Q, {
       get each() {
-        return Array.from(J().values());
+        return Array.from(v().values());
       },
-      children: (n) => [v(Q, {
-        ref: (d) => {
-          const c = n.uidNode;
-          d ? O.set(c, d) : O.delete(c);
-        },
-        onDragEnd: R,
-        onDragOver: K,
-        onDragEnter: C,
-        onDragLeave: _,
-        onDrop: z,
-        get "data-uid"() {
-          return n.uidNode;
-        },
-        get "data-type"() {
-          return n.typNode;
-        },
-        get class() {
-          return "hide-scrollbar DefaultWrapTabPanel " + (e.tabPanelElementClass || "");
-        },
-        get style() {
-          return {
-            position: "absolute",
-            ...e.tabPanelElementStyles,
-            width: `${n.nodDims.w}px`,
-            height: `${n.nodDims.h}px`,
-            left: `${n.nodDims.x}px`,
-            top: `${n.nodDims.y}px`,
-            "background-color": "transparent"
-          };
-        }
-      }), v(U, {
-        get draggable() {
-          return !S();
-        },
-        get "data-uid"() {
-          return n.uidNode;
-        },
-        "data-type": "tabset",
-        onDragOver: w,
-        onDragStart: B,
-        onDragEnd: R,
-        onDragEnter: C,
-        onDragLeave: _,
-        onDrop: z,
-        ref: (d) => {
-          const c = n.uidNode;
-          d ? s.set(c, d) : s.delete(c);
-        },
-        get class() {
-          return "hide-scrollbar " + (e.tabHeadElementClass || "");
-        },
-        get style() {
-          return {
-            ...e.tabHeadElementStyles,
-            position: "absolute",
-            "z-index": 99,
-            width: `${n.nodDims.w}px`,
-            height: `${e.tabHeadHeight || D._minH}px`,
-            left: `${n.nodDims.x}px`,
-            top: `${n.nodDims.y}px`,
-            cursor: S() ? "wait" : "pointer"
-          };
-        },
-        get children() {
-          return v(L, {
-            get each() {
-              return n.nodKids;
-            },
-            children: (d) => v(V, {
-              get "data-uid"() {
-                return d.uidNode;
+      children: (n) => {
+        const m = De(n, oe), x = Y && !!n.nodMaximizable, Z = J && !!n.nodFoldable && !n.nodMaxd, P = x || Z;
+        return [p(ue, {
+          ref: (E) => {
+            const H = n.uidNode;
+            E ? q.set(H, E) : q.delete(H);
+          },
+          onDragEnd: T,
+          onDragOver: k,
+          onDragEnter: B,
+          onDragLeave: j,
+          onDrop: U,
+          get "data-uid"() {
+            return n.uidNode;
+          },
+          get "data-type"() {
+            return n.typNode;
+          },
+          get class() {
+            return "hide-scrollbar DefaultWrapTabPanel " + (e.tabPanelElementClass || "");
+          },
+          get style() {
+            return {
+              position: "absolute",
+              ...e.tabPanelElementStyles,
+              width: `${n.nodDims.w}px`,
+              height: `${n.nodDims.h}px`,
+              left: `${n.nodDims.x}px`,
+              top: `${n.nodDims.y}px`,
+              "background-color": "transparent"
+            };
+          }
+        }), p($, {
+          get draggable() {
+            return !F();
+          },
+          get "data-uid"() {
+            return n.uidNode;
+          },
+          "data-type": "tabset",
+          "data-tabbar": "",
+          get "data-folded"() {
+            return n.nodFold ? "" : void 0;
+          },
+          get "data-maximized"() {
+            return n.nodMaxd ? "" : void 0;
+          },
+          get "data-dx-hidden"() {
+            return n.nodHidden ? "" : void 0;
+          },
+          get "data-rotated"() {
+            return m.rotated ? "" : void 0;
+          },
+          onDblClick: ae,
+          onDragOver: K,
+          onDragStart: z,
+          onDragEnd: T,
+          onDragEnter: B,
+          onDragLeave: j,
+          onDrop: U,
+          ref: (E) => {
+            const H = n.uidNode;
+            E ? o.set(H, E) : o.delete(H);
+          },
+          get class() {
+            return "hide-scrollbar " + (e.tabHeadElementClass || "");
+          },
+          get style() {
+            return {
+              ...e.tabHeadElementStyles,
+              position: "absolute",
+              "z-index": 99,
+              width: `${m.rect.w}px`,
+              height: `${m.rect.h}px`,
+              left: `${m.rect.x}px`,
+              top: `${m.rect.y}px`,
+              "transform-origin": "0 0",
+              ...m.rotated ? {
+                transform: "rotate(90deg)"
+              } : {},
+              ...P ? {
+                "padding-right": "64px"
+              } : {},
+              cursor: F() ? "wait" : "pointer"
+            };
+          },
+          get children() {
+            return [p(Q, {
+              get each() {
+                return n.nodKids;
               },
-              "data-type": "tab",
-              onDragStart: B,
-              onDragEnd: R,
-              get draggable() {
-                return !S();
+              children: (E) => p(S, {
+                get "data-uid"() {
+                  return E.uidNode;
+                },
+                "data-type": "tab",
+                onDragStart: z,
+                onDragEnd: T,
+                get draggable() {
+                  return !F();
+                },
+                get active() {
+                  return !!E.nodOpen;
+                },
+                get class() {
+                  return "hide-scrollbar " + (e.tabLabelElementClass || "");
+                },
+                get style() {
+                  return {
+                    cursor: F() ? "wait" : "pointer",
+                    ...e.tabLabelElementStyles
+                  };
+                },
+                onClick: re,
+                get children() {
+                  return ee(() => !!e.tabNames)() && e.tabNames.get(E.nodName) || E.nodName;
+                }
+              })
+            }), ee(() => P && p(R, {
+              get maximized() {
+                return !!n.nodMaxd;
               },
-              get active() {
-                return !!d.nodOpen;
+              get folded() {
+                return !!n.nodFold;
               },
-              get class() {
-                return "hide-scrollbar " + (e.tabLabelElementClass || "");
+              get rotated() {
+                return m.rotated;
               },
-              get style() {
-                return {
-                  cursor: S() ? "wait" : "pointer",
-                  ...e.tabLabelElementStyles
-                };
+              get rowIsHorizontal() {
+                return n.nodeDir === !1;
               },
-              onClick: I,
-              get children() {
-                return ie(() => !!e.tabNames)() && e.tabNames.get(d.nodName) || d.nodName;
-              }
-            })
-          });
-        }
-      })]
-    }), null), y(m, v(L, {
+              showMaximize: x,
+              showFold: Z,
+              onToggleMaximize: () => se(n.uidNode),
+              onToggleFold: () => ne(n.uidNode)
+            }))];
+          }
+        })];
+      }
+    }), null), y(b, p(Q, {
       get each() {
         return a().keys;
       },
       children: (n) => {
-        const d = a().maps.get(n)?.uqid;
-        return v(p, {
-          id: d,
+        const m = a().maps.get(n)?.uqid;
+        return p(ge, {
+          id: m,
           draggable: !1,
-          "data-uid": d,
+          "data-uid": m,
           get class() {
             return "hide-scrollbar " + (e.tabBodyElementClass || "");
           },
@@ -663,35 +822,38 @@ const Ye = (e) => {
               ...e.tabBodyElementStyles
             };
           },
-          ref: (c) => {
-            d && (c ? F.set(d, c) : F.delete(d));
+          ref: (x) => {
+            m && (x ? V.set(m, x) : V.delete(m));
           },
           get children() {
-            return a().maps.get(n)?.node || Xe();
+            return a().maps.get(n)?.node || ht();
           }
         });
       }
-    }), null), y(m, v(L, {
+    }), null), y(b, p(Q, {
       get each() {
-        return Array.from(u().values());
+        return Array.from(c().values());
       },
-      children: (n) => v(E, {
+      children: (n) => p(fe, {
         get id() {
           return n.uidNode;
         },
         get "data-uid"() {
           return n.uidNode;
         },
+        get "data-dx-hidden"() {
+          return n.nodHidden ? "" : void 0;
+        },
         get direction() {
           return n.nodeDir;
         },
-        onPointerDown: A,
+        onPointerDown: te,
         get class() {
           return "hide-scrollbar " + (e.sliderElementClass || "");
         },
-        ref: (d) => {
-          const c = n.uidNode;
-          d ? b.set(c, d) : b.delete(c);
+        ref: (m) => {
+          const x = n.uidNode;
+          m ? u.set(x, m) : u.delete(x);
         },
         get style() {
           return {
@@ -700,11 +862,14 @@ const Ye = (e) => {
             left: `${n.nodDims.x}px`,
             top: `${n.nodDims.y}px`,
             cursor: n.nodeDir ? "ns-resize" : "ew-resize",
+            ...n.nodLocked ? {
+              "pointer-events": "none"
+            } : {},
             ...e.sliderElementStyles
           };
         }
       })
-    }), null), y(m, v(Z, {
+    }), null), y(b, p(i, {
       get class() {
         return "hide-scrollbar " + (e.hoverElementClass || "");
       },
@@ -713,15 +878,15 @@ const Ye = (e) => {
           ...e.hoverElementStyles
         };
       },
-      ref: (n) => k.current = n
-    }), null), y(m, v(L, {
+      ref: (n) => f.current = n
+    }), null), y(b, p(Q, {
       each: ["left", "right", "top", "bottom"],
-      children: (n, d) => v(Fe, {
-        onDragOver: G,
-        onDragEnd: R,
-        onDragEnter: C,
-        onDragLeave: _,
-        onDrop: z,
+      children: (n, m) => p(dt, {
+        onDragOver: X,
+        onDragEnd: T,
+        onDragEnter: B,
+        onDragLeave: j,
+        onDrop: U,
         get "data-uid"() {
           return e.rootId || "dynamix-layout-root";
         },
@@ -729,8 +894,8 @@ const Ye = (e) => {
         get class() {
           return "hide-scrollbar " + (e.RootSplitterHoverElClass || "");
         },
-        ref: (c) => {
-          c && (j[d()] = c);
+        ref: (x) => {
+          x && (D[m()] = x);
         },
         get style() {
           return {
@@ -743,18 +908,19 @@ const Ye = (e) => {
           w: "8px"
         }
       })
-    }), null), m;
+    }), null), b;
   })();
 };
 export {
-  Ae as DefaultHoverElement,
-  je as DefaultSliderElement,
-  ke as DefaultWrapTabBody,
-  Be as DefaultWrapTabHead,
-  Le as DefaultWrapTabLabel,
-  Me as DefaultWrapTabPanel,
-  Ve as DynamixLayout,
-  Fe as RootSplitterHoverEl,
-  Ye as getTabOutput,
-  Ue as useDynamixLayout
+  it as DefaultHoverElement,
+  lt as DefaultSliderElement,
+  gt as DefaultTabsetToolbar,
+  nt as DefaultWrapTabBody,
+  at as DefaultWrapTabHead,
+  rt as DefaultWrapTabLabel,
+  ot as DefaultWrapTabPanel,
+  wt as DynamixLayout,
+  dt as RootSplitterHoverEl,
+  bt as getTabOutput,
+  ft as useDynamixLayout
 };