@aiquants/resize-panels 1.5.1 → 1.7.0

package/dist/index.js

@@ -0,0 +1,2279 @@
+import { createContext as vt, useContext as Mt, useCallback as Se, useMemo as ae, useReducer as wt, useState as Me, useRef as J, useEffect as se, useLayoutEffect as Xe, memo as it, useId as zt, useSyncExternalStore as ht } from "react";
+import { jsx as I, jsxs as fe } from "react/jsx-runtime";
+import { twMerge as $e } from "tailwind-merge";
+import { createPortal as Et } from "react-dom";
+const gt = vt(null), rt = () => {
+  const t = Mt(gt);
+  if (!t)
+    throw new Error("usePanelGroup must be used within a PanelGroup");
+  return t;
+}, xt = (t, e = 0) => {
+  if (!Number.isFinite(t))
+    return t;
+  const n = 10 ** e, d = t * n, r = Math.floor(d), c = d - r, i = Number.EPSILON * Math.max(1, Math.abs(d));
+  return c < 0.5 - i ? r / n : c > 0.5 + i ? (r + 1) / n : (r % 2 === 0 ? r : r + 1) / n;
+}, St = 12, nt = 8, Bt = 8, Rt = 8, mt = 0.05, Pt = 10, It = 0.05, Ft = 20, Nt = 0.05, ot = 0, bt = 6, Ce = (t, e) => e <= 0 ? 0 : xt(t / e * 100, bt), We = (t, e) => !t || e <= 0 ? 0 : t / 100 * e, Qe = (t, e = "percentage") => {
+  if (t !== void 0)
+    return typeof t == "number" ? { value: t, unit: e } : t;
+}, st = (t, e) => t ? t.unit === "percentage" ? t.value / 100 * e : t.value : 0, te = (t, e, n) => t ? typeof t == "number" ? t / 100 * n : t.unit === "pixels" ? t.value : t.value / 100 * n : e, me = (t, e, n) => Math.min(Math.max(t, e), n), et = (t) => {
+  if (!Number.isFinite(t) || t <= 0)
+    return ot;
+  const e = t * mt, n = Math.min(St, Pt, e);
+  return Math.max(ot, n);
+}, Ct = (t, e, n, d = {}) => {
+  if (Math.abs(e) <= 0)
+    return e;
+  const r = d.enforceAutoMinSize ?? !1, c = t.map((s, a) => ({ panel: s, index: a })).filter(({ panel: s }) => !s.collapsed && (s.sizeUnit === "pixels" || s.originalPixelSize !== void 0));
+  if (c.length === 0)
+    return e;
+  const i = e > 0, p = [...c].sort((s, a) => {
+    const o = s.panel.pixelAdjustPriority ?? s.index + 1, h = a.panel.pixelAdjustPriority ?? a.index + 1;
+    return o === h ? i ? a.index - s.index : s.index - a.index : i ? h - o : o - h;
+  });
+  let u = e;
+  const z = (s) => {
+    for (const { index: a } of p) {
+      if (Math.abs(u) <= 0)
+        break;
+      const o = t[a];
+      if (!o || o.collapsed)
+        continue;
+      const h = Qe(o.minSize, "pixels"), b = Qe(o.maxSize, "pixels"), m = h ? st(h, n) : 0, v = b ? st(b, n) : n, x = r ? te(o.autoMinSize, 0, n) : 0, C = Math.max(m, x), S = o.preferredPixelSize !== void 0 ? me(o.preferredPixelSize, C, v) : o.size, D = o.collapseFromStart || o.collapseFromEnd;
+      if (u > 0) {
+        if (Math.abs(o.size) <= 0 && (o.percentageSize ?? 0) <= 0)
+          continue;
+        const re = Math.max(o.size, S), de = s ? Math.min(v, re) : v, j = Math.max(0, de - o.size);
+        if (j <= 0)
+          continue;
+        const _ = Math.min(j, u);
+        if (_ <= 0)
+          continue;
+        const E = o.size + _, oe = Ce(E, n), U = D ? E : o.sizeBeforeCollapse, V = D ? o.measuredPixelSizeBeforeCollapse ?? o.measuredPixelSize ?? E : o.measuredPixelSizeBeforeCollapse;
+        t[a] = {
+          ...o,
+          size: E,
+          percentageSize: oe,
+          sizeBeforeCollapse: U,
+          measuredPixelSizeBeforeCollapse: V,
+          measuredPixelSize: void 0,
+          measuredPercentageSize: void 0
+        }, u -= _;
+      } else {
+        const X = s ? S : C, re = Math.max(0, o.size - X);
+        if (re <= 0)
+          continue;
+        const de = Math.min(re, Math.abs(u));
+        if (de <= 0)
+          continue;
+        const j = o.size - de, _ = Ce(j, n), E = D ? j : o.sizeBeforeCollapse, oe = D ? o.measuredPixelSizeBeforeCollapse ?? o.measuredPixelSize ?? j : o.measuredPixelSizeBeforeCollapse;
+        t[a] = {
+          ...o,
+          size: j,
+          percentageSize: _,
+          sizeBeforeCollapse: E,
+          measuredPixelSizeBeforeCollapse: oe,
+          measuredPixelSize: void 0,
+          measuredPercentageSize: void 0
+        }, u += de;
+      }
+    }
+  };
+  return z(!0), (i && u > 0 || !i && u < 0) && z(!1), u;
+}, Ve = (t) => {
+  if (!t)
+    return 0;
+  const e = parseFloat(t);
+  return Number.isFinite(e) ? e : 0;
+}, Oe = (t, e) => {
+  const n = t.getBoundingClientRect(), d = typeof window < "u" ? window.getComputedStyle(t) : null, r = d ? Ve(d.borderLeftWidth) + Ve(d.borderRightWidth) : 0, c = d ? Ve(d.borderTopWidth) + Ve(d.borderBottomWidth) : 0;
+  if (e === "horizontal") {
+    const z = n.width > 0 ? n.width : t.offsetWidth, s = n.width > 0 ? Math.max(0, n.width - r) : t.clientWidth, a = t.offsetWidth > 0 ? t.offsetWidth : t.clientWidth + r;
+    return {
+      inner: s > 0 ? s : Math.max(0, t.clientWidth),
+      outer: z > 0 ? z : Math.max(0, a)
+    };
+  }
+  const i = n.height > 0 ? n.height : t.offsetHeight, p = n.height > 0 ? Math.max(0, n.height - c) : t.clientHeight, u = t.offsetHeight > 0 ? t.offsetHeight : t.clientHeight + c;
+  return {
+    inner: p > 0 ? p : Math.max(0, t.clientHeight),
+    outer: i > 0 ? i : Math.max(0, u)
+  };
+}, At = (t, e) => {
+  try {
+    localStorage.setItem(`panel-layout-${t}`, JSON.stringify(e));
+  } catch (n) {
+    console.warn("Failed to save panel layout:", n);
+  }
+}, Lt = (t) => {
+  try {
+    const e = localStorage.getItem(`panel-layout-${t}`);
+    return e ? JSON.parse(e) : null;
+  } catch (e) {
+    return console.warn("Failed to load panel layout:", e), null;
+  }
+};
+var qe = /* @__PURE__ */ ((t) => (t[t.DEBUG = 0] = "DEBUG", t[t.INFO = 1] = "INFO", t[t.WARN = 2] = "WARN", t[t.ERROR = 3] = "ERROR", t[t.NONE = 4] = "NONE", t))(qe || {});
+const Ee = class Ee {
+  /**
+   * @constructor
+   * @param {LogLevel} [level=LogLevel.WARN] - The minimum log level to output.
+   * @param {string} [prefix="[resize-panels]"] - The prefix to add to all log messages.
+   * @param {ILogger} [impl=console] - The implementation to use for logging.
+   */
+  constructor(e = 2, n = "[resize-panels]", d = console) {
+    this.level = e, this.prefix = n, this.impl = d;
+  }
+  /**
+   * @method setLevel
+   * @description Updates the current log level for the static instance.
+   * @description 静的インスタンスの現在のログレベルを更新します。
+   * @param {LogLevel} level - The new log level.
+   */
+  static setLevel(e) {
+    Ee.instance.setLevel(e);
+  }
+  /**
+   * @method setLevel
+   * @description Updates the current log level.
+   * @description 現在のログレベルを更新します。
+   * @param {LogLevel} level - The new log level.
+   */
+  setLevel(e) {
+    this.level = e;
+  }
+  /**
+   * @method setImplementation
+   * @description Updates the logger implementation for the static instance.
+   * @description 静的インスタンスのロガーの実装を更新します。
+   * @param {ILogger} impl - The new logger implementation.
+   */
+  static setImplementation(e) {
+    Ee.instance.setImplementation(e);
+  }
+  /**
+   * @method setImplementation
+   * @description Updates the logger implementation.
+   * @description ロガーの実装を更新します。
+   * @param {ILogger} impl - The new logger implementation.
+   */
+  setImplementation(e) {
+    this.impl = e;
+  }
+  /**
+   * @method setPrefix
+   * @description Updates the log prefix for the static instance.
+   * @description 静的インスタンスのログのプレフィックスを更新します。
+   * @param {string} prefix - The new prefix.
+   */
+  static setPrefix(e) {
+    Ee.instance.setPrefix(e);
+  }
+  /**
+   * @method setPrefix
+   * @description Updates the log prefix.
+   * @description ログのプレフィックスを更新します。
+   * @param {string} prefix - The new prefix.
+   */
+  setPrefix(e) {
+    this.prefix = e;
+  }
+  formatMessage(e) {
+    return typeof e == "string" ? [`${this.prefix} ${e}`] : [this.prefix, e];
+  }
+  static debug(e, ...n) {
+    Ee.instance.debug(e, ...n);
+  }
+  debug(e, ...n) {
+    this.level <= 0 && this.impl.debug(...this.formatMessage(e), ...n);
+  }
+  static info(e, ...n) {
+    Ee.instance.info(e, ...n);
+  }
+  info(e, ...n) {
+    this.level <= 1 && this.impl.info(...this.formatMessage(e), ...n);
+  }
+  static warn(e, ...n) {
+    Ee.instance.warn(e, ...n);
+  }
+  warn(e, ...n) {
+    this.level <= 2 && this.impl.warn(...this.formatMessage(e), ...n);
+  }
+  static error(e, ...n) {
+    Ee.instance.error(e, ...n);
+  }
+  error(e, ...n) {
+    this.level <= 3 && this.impl.error(...this.formatMessage(e), ...n);
+  }
+};
+Ee.instance = new Ee(2, "[resize-panels]");
+let je = Ee;
+const ze = new je(qe.INFO, "[resize-panels]"), ve = (t) => t.map((e) => ({
+  id: e.id,
+  size: e.size,
+  percentageSize: e.percentageSize,
+  preferredPercentageSize: e.preferredPercentageSize,
+  sizeBeforeCollapse: e.sizeBeforeCollapse,
+  percentageSizeBeforeCollapse: e.percentageSizeBeforeCollapse,
+  preferredPercentageSizeBeforeCollapse: e.preferredPercentageSizeBeforeCollapse,
+  measuredPercentageSize: e.measuredPercentageSize,
+  excludeFromAutoGrowth: e.excludeFromAutoGrowth ?? !1,
+  collapsed: e.collapsed ?? !1,
+  collapseFromStart: e.collapseFromStart,
+  collapseFromEnd: e.collapseFromEnd,
+  collapsedByDirection: e.collapsedByDirection ?? null
+})), Ye = (t) => t ? ve([t])[0] : null, De = (t) => t ? !!(t.collapseFromStart || t.collapseFromEnd) : !1, Ke = (t, e) => {
+  if (!Number.isFinite(e) || e <= 0)
+    return t;
+  const n = t.map((u) => ({ ...u })), d = [];
+  for (let u = 0; u < n.length; u += 1) {
+    const z = n[u];
+    if (z.collapsed) {
+      n[u] = {
+        ...z,
+        size: 0,
+        percentageSize: 0
+      };
+      continue;
+    }
+    const s = Math.max(0, te(z.minSize, 0, e)), a = Math.max(0, te(z.autoMinSize, 0, e)), o = Math.max(s, a), h = Math.max(1e-3, o), b = te(z.maxSize, e, e), m = Math.max(o, b), v = z.sizeUnit === "pixels" || z.originalPixelSize !== void 0, x = Math.max(0, z.size);
+    let C = o;
+    if (v) {
+      const D = z.preferredPixelSize ?? z.size ?? z.originalPixelSize ?? o;
+      C = me(D, o, m);
+    } else {
+      const D = z.preferredPercentageSize ?? z.percentageSize ?? Ce(z.size, e), X = We(D, e);
+      C = me(X, o, m);
+    }
+    const S = !v && (z.excludeFromAutoGrowth ?? !1) && x <= h;
+    d.push({
+      index: u,
+      isPixelPanel: v,
+      minSize: o,
+      maxSize: m,
+      preferredSize: C,
+      priority: z.pixelAdjustPriority ?? u + 1,
+      flexPriority: v ? void 0 : z.flexAdjustPriority,
+      excludeFromGrowth: S
+    });
+  }
+  if (d.length === 0)
+    return n;
+  const r = /* @__PURE__ */ new Map();
+  let c = 0;
+  for (const u of d)
+    r.set(u.index, u.minSize), c += u.minSize;
+  let i = e - c;
+  const p = (u, z) => {
+    if (z <= 0)
+      return 0;
+    const s = r.get(u.index) ?? u.minSize, a = Math.max(0, u.maxSize - s);
+    if (a <= 0)
+      return 0;
+    const o = Math.min(z, a);
+    return r.set(u.index, s + o), o;
+  };
+  if (i > 0) {
+    const u = (s) => {
+      for (; i > 1e-6; ) {
+        let o = 0;
+        const h = [];
+        for (const v of s) {
+          if (!v.isPixelPanel && v.excludeFromGrowth)
+            continue;
+          const x = r.get(v.index) ?? v.minSize, C = Math.min(v.preferredSize, v.maxSize), S = Math.max(0, C - x);
+          S > 1e-6 && (o += S, h.push({ descriptor: v, capacity: S }));
+        }
+        if (h.length === 0 || o <= 1e-6)
+          break;
+        let b = 0;
+        const m = i;
+        for (const v of h) {
+          if (i <= 1e-6)
+            break;
+          if (!v.descriptor.isPixelPanel && v.descriptor.excludeFromGrowth)
+            continue;
+          const x = m * v.capacity / o, C = Math.min(v.capacity, x);
+          if (C <= 0)
+            continue;
+          const S = p(v.descriptor, C);
+          S > 0 && (i -= S, b += S);
+        }
+        if (b <= 1e-6)
+          break;
+      }
+    }, z = d.filter((s) => s.isPixelPanel);
+    z.sort((s, a) => a.priority - s.priority);
+    for (const s of z) {
+      if (i <= 0)
+        break;
+      const a = r.get(s.index) ?? s.minSize, o = Math.min(s.preferredSize, s.maxSize), h = Math.max(0, o - a);
+      if (h <= 0)
+        continue;
+      const b = p(s, Math.min(h, i));
+      b > 0 && (i -= b);
+    }
+    if (i > 0) {
+      const s = d.filter((a) => !a.isPixelPanel);
+      if (s.length > 0) {
+        const a = s.filter((o) => o.flexPriority !== void 0 && !o.excludeFromGrowth);
+        if (a.length > 0) {
+          a.sort((o, h) => (h.flexPriority ?? 0) - (o.flexPriority ?? 0));
+          for (const o of a) {
+            if (i <= 0)
+              break;
+            if (o.excludeFromGrowth)
+              continue;
+            const h = r.get(o.index) ?? o.minSize, b = Math.min(o.preferredSize, o.maxSize), m = Math.max(0, b - h);
+            if (m <= 0)
+              continue;
+            const v = p(o, Math.min(m, i));
+            v > 0 && (i -= v);
+          }
+        }
+        if (i > 0) {
+          const o = a.length > 0 ? s.filter((h) => h.flexPriority === void 0 && !h.excludeFromGrowth) : s.filter((h) => !h.excludeFromGrowth);
+          o.length > 0 && u(o);
+        }
+      }
+    }
+  }
+  if (i > 0) {
+    let u = i;
+    for (; ; ) {
+      let z = 0;
+      const s = [];
+      for (const o of d) {
+        if (!o.isPixelPanel && o.excludeFromGrowth)
+          continue;
+        const h = r.get(o.index) ?? o.minSize, b = o.isPixelPanel ? Math.min(o.maxSize, o.preferredSize) : o.maxSize, m = Math.max(0, b - h);
+        m > 0 && (s.push(o), z += m);
+      }
+      if (z <= 0)
+        break;
+      const a = i;
+      for (const o of s) {
+        if (i <= 0)
+          break;
+        if (!o.isPixelPanel && o.excludeFromGrowth)
+          continue;
+        const h = r.get(o.index) ?? o.minSize, b = o.isPixelPanel ? Math.min(o.maxSize, o.preferredSize) : o.maxSize, m = Math.max(0, b - h);
+        if (m <= 0)
+          continue;
+        const v = a * m / z, x = p(o, Math.min(m, v));
+        x > 0 && (i -= x);
+      }
+      if (i <= 1e-6 || Math.abs(u - i) <= 1e-6)
+        break;
+      u = i;
+    }
+    i = Math.max(0, i);
+  }
+  if (i < 0) {
+    let u = i;
+    const z = d.filter((s) => s.isPixelPanel);
+    for (z.sort((s, a) => s.priority - a.priority); !(i >= 0); ) {
+      let s = !1;
+      for (const a of z) {
+        if (i >= 0)
+          break;
+        const o = r.get(a.index) ?? a.minSize, h = me(a.preferredSize, a.minSize, a.maxSize), b = Math.max(0, o - h);
+        if (b > 0 && i < 0) {
+          const v = Math.min(b, Math.abs(i));
+          r.set(a.index, o - v), i += v, s = !0;
+          continue;
+        }
+        const m = Math.max(0, o - a.minSize);
+        if (m > 0 && i < 0) {
+          const v = Math.min(m, Math.abs(i));
+          r.set(a.index, o - v), i += v, s = !0;
+        }
+      }
+      if (!s || Math.abs(u - i) <= 1e-6)
+        break;
+      u = i;
+    }
+  }
+  for (const u of d) {
+    const z = r.get(u.index) ?? u.minSize, s = n[u.index], a = De(s), o = a ? z : s.sizeBeforeCollapse, h = a ? s.measuredPixelSizeBeforeCollapse ?? s.measuredPixelSize ?? z : s.measuredPixelSizeBeforeCollapse, b = e > 0 ? Ce(z, e) : 0;
+    n[u.index] = {
+      ...s,
+      size: z,
+      percentageSize: b,
+      preferredPercentageSize: s.preferredPercentageSize,
+      preferredPixelSize: u.isPixelPanel ? s.preferredPixelSize ?? z : s.preferredPixelSize,
+      sizeBeforeCollapse: o,
+      measuredPixelSizeBeforeCollapse: h,
+      measuredPixelSize: void 0,
+      measuredPercentageSize: void 0
+    };
+  }
+  return Le(n);
+}, Le = (t) => {
+  let e = 0;
+  for (const r of t)
+    r.collapsed || (e += Math.max(r.size, 0));
+  if (e <= 0) {
+    let r = !1;
+    const c = t.map((i) => (i.percentageSize ?? 0) !== 0 ? (r = !0, {
+      ...i,
+      percentageSize: 0,
+      measuredPercentageSize: i.measuredPercentageSize !== void 0 ? 0 : i.measuredPercentageSize
+    }) : !i.collapsed && i.sizeBeforeCollapse !== i.size ? (r = !0, {
+      ...i,
+      sizeBeforeCollapse: i.size
+    }) : i);
+    return r ? c : t;
+  }
+  let n = !1;
+  const d = t.map((r) => {
+    if (r.collapsed)
+      return (r.percentageSize ?? 0) !== 0 ? (n = !0, {
+        ...r,
+        percentageSize: 0,
+        measuredPercentageSize: r.measuredPercentageSize !== void 0 ? 0 : r.measuredPercentageSize
+      }) : r;
+    const c = Ce(r.size, e), i = r.measuredPercentageSize, z = (i !== void 0 ? Math.abs(i - c) : 1 / 0) < 1e-4 && i !== void 0 ? i : c, s = xt(z, bt), o = Math.abs((r.percentageSize ?? 0) - s) > 0 || r.percentageSize === void 0, h = r.sizeBeforeCollapse === void 0 || r.sizeBeforeCollapse !== r.size, b = De(r), m = b && h, v = r.measuredPixelSize ?? r.size, x = b && (r.measuredPixelSizeBeforeCollapse === void 0 || r.measuredPixelSizeBeforeCollapse !== v);
+    if (!(o || m || x))
+      return r;
+    n = !0;
+    const C = m ? r.size : r.sizeBeforeCollapse, S = x ? v : r.measuredPixelSizeBeforeCollapse;
+    return {
+      ...r,
+      percentageSize: s,
+      sizeBeforeCollapse: C,
+      measuredPixelSizeBeforeCollapse: S,
+      collapsedByDirection: r.collapsed ? r.collapsedByDirection ?? null : null
+    };
+  });
+  return n ? d : t;
+}, Ze = (t, e) => {
+  if (e <= 0)
+    return !1;
+  const n = [];
+  let d = 0;
+  for (let s = 0; s < t.length; s += 1) {
+    const a = t[s];
+    !a || a.collapsed || (n.push(s), d += a.size);
+  }
+  if (n.length === 0)
+    return !1;
+  let r = e - d;
+  if (Math.abs(r) <= 0)
+    return !1;
+  let c = !1;
+  const i = (s) => {
+    const a = t[s], o = te(a.minSize, 0, e), h = te(a.autoMinSize, 0, e), b = Math.max(o, h), m = te(a.maxSize, e, e), v = a.sizeUnit === "percentage" && a.originalPixelSize === void 0;
+    return {
+      index: s,
+      minSize: b,
+      maxSize: m,
+      isFlexible: v
+    };
+  }, p = (s, a) => {
+    if (!Number.isFinite(a) || Math.abs(a) <= 0)
+      return;
+    const o = t[s];
+    if (!o)
+      return;
+    const h = Math.max(0, o.size + a);
+    if (Math.abs(h - o.size) <= 0)
+      return;
+    const b = Ce(h, e), m = De(o), v = m ? h : o.sizeBeforeCollapse, x = m ? o.measuredPixelSizeBeforeCollapse ?? o.measuredPixelSize ?? h : o.measuredPixelSizeBeforeCollapse;
+    t[s] = {
+      ...o,
+      size: h,
+      percentageSize: b,
+      sizeBeforeCollapse: v,
+      measuredPixelSizeBeforeCollapse: x,
+      measuredPixelSize: void 0,
+      measuredPercentageSize: void 0
+    }, r -= a, c = !0;
+  }, u = (s) => {
+    for (const a of s) {
+      if (Math.abs(r) <= 0)
+        break;
+      const o = t[a.index];
+      if (!o || o.collapsed)
+        continue;
+      const h = o.size;
+      if (r > 0) {
+        const b = Math.max(0, a.maxSize - h);
+        if (b <= 0)
+          continue;
+        const m = Math.min(b, r);
+        if (m <= 0)
+          continue;
+        p(a.index, m);
+      } else {
+        const b = Math.max(0, h - a.minSize);
+        if (b <= 0)
+          continue;
+        const m = Math.min(b, Math.abs(r));
+        if (m <= 0)
+          continue;
+        p(a.index, -m);
+      }
+    }
+  }, z = n.map((s) => i(s)).filter((s) => s.isFlexible);
+  if (z.length > 0 && u(z), Math.abs(r) > 0) {
+    const s = r;
+    r = Ct(t, r, e, { enforceAutoMinSize: !0 }), Math.abs(r - s) > 0 && (c = !0);
+  }
+  return c;
+}, at = (t, e, n) => {
+  if (!(t.sizeUnit === "pixels" || t.originalPixelSize !== void 0) || t.pixelAdjustPriority !== void 0)
+    return t;
+  const r = e.filter((i, p) => p !== n && (i.sizeUnit === "pixels" || i.originalPixelSize !== void 0)).map((i) => i.pixelAdjustPriority).filter((i) => i !== void 0), c = r.length > 0 ? Math.max(...r) + 1 : 1;
+  return {
+    ...t,
+    pixelAdjustPriority: c
+  };
+}, Dt = (t, e) => {
+  switch (e.type) {
+    case "REGISTER_PANEL": {
+      ze.debug("REGISTER_PANEL", e.panel);
+      const n = t.findIndex((c) => c.id === e.panel.id);
+      if (n >= 0) {
+        const c = [...t], i = t[n], p = {
+          ...i,
+          minSize: e.panel.minSize,
+          maxSize: e.panel.maxSize,
+          collapseFromStart: e.panel.collapseFromStart,
+          collapseFromEnd: e.panel.collapseFromEnd,
+          collapsedByDirection: e.panel.collapsedByDirection !== void 0 ? e.panel.collapsedByDirection : i.collapsedByDirection,
+          sizeUnit: e.panel.sizeUnit,
+          originalPixelSize: e.panel.originalPixelSize,
+          preferredPercentageSize: e.panel.preferredPercentageSize !== void 0 ? e.panel.preferredPercentageSize : i.preferredPercentageSize,
+          preferredPercentageSizeBeforeCollapse: e.panel.preferredPercentageSizeBeforeCollapse !== void 0 ? e.panel.preferredPercentageSizeBeforeCollapse : i.preferredPercentageSizeBeforeCollapse,
+          percentageSizeBeforeCollapse: e.panel.percentageSizeBeforeCollapse !== void 0 ? e.panel.percentageSizeBeforeCollapse : i.percentageSizeBeforeCollapse,
+          pixelAdjustPriority: e.panel.pixelAdjustPriority !== void 0 ? e.panel.pixelAdjustPriority : i.pixelAdjustPriority,
+          autoMinSize: e.panel.autoMinSize !== void 0 ? e.panel.autoMinSize : i.autoMinSize,
+          excludeFromAutoGrowth: e.panel.excludeFromAutoGrowth !== void 0 ? e.panel.excludeFromAutoGrowth : i.excludeFromAutoGrowth
+        }, u = at(p, t, n);
+        return ze.debug("register panel (update)", {
+          panelId: u.id,
+          incoming: Ye(e.panel),
+          previous: Ye(i),
+          next: Ye(u)
+        }), c[n] = u, c;
+      }
+      const d = { ...e.panel }, r = at(d, t);
+      return ze.debug("register panel (insert)", {
+        panelId: r.id,
+        incoming: Ye(r),
+        previousLength: t.length
+      }), [...t, r];
+    }
+    case "UNREGISTER_PANEL": {
+      ze.debug("UNREGISTER_PANEL", e.id);
+      const n = t.filter((r) => r.id !== e.id), d = Le(n);
+      return ze.debug("unregister panel", {
+        panelId: e.id,
+        previous: ve(t),
+        filtered: ve(n),
+        next: ve(d)
+      }), d;
+    }
+    case "RESIZE_PANELS": {
+      ze.debug("RESIZE_PANELS", e.leftId, e.rightId, e.leftSize, e.rightSize);
+      const n = t.findIndex((G) => G.id === e.leftId), d = t.findIndex((G) => G.id === e.rightId);
+      if (n === -1 || d === -1) return t;
+      const r = [...t], c = r[n], i = r[d];
+      if (c.collapsed || i.collapsed || e.leftSize === c.size && e.rightSize === i.size)
+        return t;
+      const p = e.containerSize ?? t.reduce((G, le) => G + le.size, 0), u = te(c.minSize, 0, p), z = te(c.maxSize, p, p), s = te(i.minSize, 0, p), a = te(i.maxSize, p, p), o = c.size + i.size, h = t.reduce((G, le) => le.collapsed ? G : G + le.size, 0), b = h - o, m = u + s, v = z + a, x = me(e.leftSize + e.rightSize, m, v);
+      let C = p > 0 ? p - b : x;
+      Number.isFinite(C) || (C = x);
+      const S = me(Math.max(x, C), m, v), D = (G) => ({
+        min: Math.max(u, G - a),
+        max: Math.min(z, G - s)
+      }), X = (G) => ({
+        min: Math.max(s, G - z),
+        max: Math.min(a, G - u)
+      }), re = Math.abs(e.leftSize - c.size), de = Math.abs(e.rightSize - i.size), j = re >= de;
+      let _ = c.size, E = i.size;
+      if (j) {
+        const G = D(S);
+        if (G.min > G.max)
+          return t;
+        const le = me(e.leftSize, G.min, G.max), P = S - le;
+        if (P < s || P > a)
+          return t;
+        _ = le, E = P;
+      } else {
+        const G = X(S);
+        if (G.min > G.max)
+          return t;
+        const le = me(e.rightSize, G.min, G.max), P = S - le;
+        if (P < u || P > z)
+          return t;
+        E = le, _ = P;
+      }
+      const oe = _ + E;
+      if (S !== oe)
+        return t;
+      const U = h - c.size - i.size + oe, V = p > 0 ? p : U, O = V > 0 ? Ce(_, V) : 0, Y = V > 0 ? Ce(E, V) : 0, y = c.sizeUnit === "pixels" || c.originalPixelSize !== void 0 ? _ : c.preferredPixelSize, N = i.sizeUnit === "pixels" || i.originalPixelSize !== void 0 ? E : i.preferredPixelSize, be = te(c.autoMinSize, 0, p), ce = te(i.autoMinSize, 0, p), Pe = Math.max(1e-3, be), he = Math.max(1e-3, ce), ue = c.sizeUnit === "percentage" && c.originalPixelSize === void 0, pe = i.sizeUnit === "percentage" && i.originalPixelSize === void 0;
+      let ge = c.excludeFromAutoGrowth, ye = i.excludeFromAutoGrowth;
+      ue && (_ <= Pe ? ge = !0 : _ > Pe && (ge = !1)), pe && (E <= he ? ye = !0 : E > he && (ye = !1));
+      const Be = De(c), Re = De(i);
+      return r[n] = {
+        ...c,
+        size: _,
+        percentageSize: O,
+        preferredPercentageSize: O > 0 ? O : c.preferredPercentageSize,
+        preferredPixelSize: y,
+        sizeBeforeCollapse: Be ? _ : c.sizeBeforeCollapse,
+        measuredPixelSize: void 0,
+        measuredPercentageSize: void 0,
+        excludeFromAutoGrowth: ge
+      }, r[d] = {
+        ...i,
+        size: E,
+        percentageSize: Y,
+        preferredPercentageSize: Y > 0 ? Y : i.preferredPercentageSize,
+        preferredPixelSize: N,
+        sizeBeforeCollapse: Re ? E : i.sizeBeforeCollapse,
+        measuredPixelSize: void 0,
+        measuredPercentageSize: void 0,
+        excludeFromAutoGrowth: ye
+      }, p > 0 && Ze(r, p) ? Le(r) : r;
+    }
+    case "SET_PANELS": {
+      ze.debug("SET_PANELS", e.panels);
+      const n = e.panels.map((u) => {
+        const z = u.sizeUnit === "pixels" || u.originalPixelSize !== void 0, s = u.preferredPercentageSize !== void 0 ? u.preferredPercentageSize : u.percentageSize, a = u.preferredPixelSize !== void 0 ? u.preferredPixelSize : z ? u.size : u.preferredPixelSize;
+        return {
+          ...u,
+          preferredPercentageSize: s,
+          preferredPixelSize: a
+        };
+      }), d = ve(t), r = ve(n), c = Le(n), i = ve(c);
+      let p = d.length === i.length;
+      if (p)
+        for (let u = 0; u < i.length; u += 1) {
+          const z = i[u], s = d[u];
+          if (!s) {
+            p = !1;
+            break;
+          }
+          if (!(s.id === z.id && s.size === z.size && s.percentageSize === z.percentageSize && s.sizeBeforeCollapse === z.sizeBeforeCollapse && s.measuredPercentageSize === z.measuredPercentageSize && s.collapsed === z.collapsed)) {
+            p = !1;
+            break;
+          }
+        }
+      return p ? (ze.debug("set panels skipped (no diff)", {
+        previous: d,
+        incoming: r,
+        next: i,
+        previousLength: d.length,
+        incomingLength: r.length
+      }), t) : (ze.debug("set panels", {
+        previous: d,
+        incoming: r,
+        next: i,
+        previousLength: d.length,
+        incomingLength: r.length
+      }), c);
+    }
+    case "CONTAINER_RESIZED": {
+      if (ze.debug("CONTAINER_RESIZED", e.containerSize), e.containerSize <= 0)
+        return ze.debug("container resized skipped (non-positive size)", {
+          containerSize: e.containerSize,
+          panels: ve(t)
+        }), t;
+      ze.debug("container resized (before)", {
+        containerSize: e.containerSize,
+        panels: ve(t)
+      });
+      const n = Ke(t, e.containerSize);
+      if (ze.debug("container resized (after recalc)", {
+        containerSize: e.containerSize,
+        panels: ve(n)
+      }), e.containerSize > 0 && Ze(n, e.containerSize)) {
+        const d = Le(n);
+        return ze.debug("container resized (after reconcile)", {
+          containerSize: e.containerSize,
+          panels: ve(d)
+        }), d;
+      }
+      return ze.debug("container resized (final)", {
+        containerSize: e.containerSize,
+        panels: ve(n)
+      }), n;
+    }
+    case "COLLAPSE_PANEL": {
+      ze.debug("COLLAPSE_PANEL", e.id);
+      const n = t.findIndex((o) => o.id === e.id);
+      if (n === -1)
+        return t;
+      const d = t[n], r = e.from === "start" ? d.collapseFromStart : d.collapseFromEnd;
+      if (!(De(d) && r) || d.collapsed)
+        return t;
+      const i = d.size, p = d.measuredPixelSize ?? i, u = d.percentageSize ?? d.preferredPercentageSize ?? 0, z = {
+        ...d,
+        collapsed: !0,
+        collapsedByDirection: e.from,
+        sizeBeforeCollapse: i,
+        percentageSizeBeforeCollapse: u,
+        preferredPercentageSizeBeforeCollapse: d.preferredPercentageSize ?? u,
+        preferredPixelSizeBeforeCollapse: d.preferredPixelSize ?? i,
+        measuredPixelSizeBeforeCollapse: p,
+        size: 0,
+        percentageSize: 0,
+        preferredPercentageSize: d.preferredPercentageSize,
+        measuredPixelSize: d.measuredPixelSize !== void 0 ? 0 : d.measuredPixelSize,
+        measuredPercentageSize: d.measuredPercentageSize !== void 0 ? 0 : d.measuredPercentageSize
+      }, s = [...t];
+      s[n] = z;
+      const a = Ke(s, e.containerSize);
+      return e.containerSize > 0 && Ze(a, e.containerSize) ? Le(a) : a;
+    }
+    case "EXPAND_PANEL": {
+      ze.debug("EXPAND_PANEL", e.id, e.targetSize);
+      const n = t.findIndex((S) => S.id === e.id);
+      if (n === -1)
+        return t;
+      const d = e.containerSize, r = t[n], c = e.from === "start" ? r.collapseFromStart : r.collapseFromEnd;
+      if (!(De(r) && c && r.collapsed) || r.collapsedByDirection && r.collapsedByDirection !== e.from)
+        return t;
+      const p = [e.targetSize, r.sizeBeforeCollapse, r.measuredPixelSizeBeforeCollapse, r.preferredPixelSizeBeforeCollapse, r.originalPixelSize].find((S) => S !== void 0) ?? 0, u = te(r.minSize, 0, d), z = te(r.maxSize, d, d), s = me(p, u, z), a = Ce(s, d), o = r.measuredPixelSizeBeforeCollapse ?? s, h = Ce(o, d), b = r.preferredPercentageSizeBeforeCollapse ?? r.percentageSizeBeforeCollapse ?? a, m = r.preferredPixelSizeBeforeCollapse ?? r.preferredPixelSize ?? s, v = {
+        ...r,
+        collapsed: !1,
+        collapsedByDirection: null,
+        size: s,
+        percentageSize: a,
+        preferredPercentageSize: b,
+        preferredPixelSize: m,
+        sizeBeforeCollapse: s,
+        percentageSizeBeforeCollapse: void 0,
+        preferredPercentageSizeBeforeCollapse: void 0,
+        preferredPixelSizeBeforeCollapse: void 0,
+        measuredPixelSize: s,
+        measuredPixelSizeBeforeCollapse: o,
+        measuredPercentageSize: h
+      }, x = [...t];
+      x[n] = v;
+      const C = Ke(x, d);
+      return d > 0 && Ze(C, d) ? Le(C) : C;
+    }
+    default:
+      return t;
+  }
+}, Ue = new je(qe.INFO, "[resize-panels]"), Ot = ({ direction: t, style: e, onLayout: n, autoSaveId: d, showDebugInfo: r = !1 }) => {
+  const [c, i] = wt(Dt, []), [p, u] = Me({ width: 0, height: 0 }), [z, s] = Me(!1), [a, o] = Me(!1), [h, b] = Me(null), [m, v] = Me({}), [x, C] = Me({}), S = J(null), D = J(n), X = J(!1), re = J(0), de = J(p), j = J(p), _ = J(z), E = J(h?.reason ?? null), oe = J({}), U = J(null), V = J(null), O = J(null), Y = J({ width: 0, height: 0 }), y = J({ width: 0, height: 0 }), N = J({}), be = J({}), ce = Se((l) => l.map((g) => ({ ...g })), []);
+  se(() => {
+    j.current = p;
+  }, [p]), se(() => {
+    _.current = z;
+  }, [z]), se(() => {
+    E.current = h?.reason ?? null;
+  }, [h?.reason]), se(() => {
+    if (h)
+      return;
+    const l = t === "horizontal" ? p.width : p.height;
+    !Number.isFinite(l) || l <= 4 || c.length !== 0 && (U.current = ce(c));
+  }, [h, c, t, p.width, p.height, ce]), se(() => {
+    const l = V.current;
+    if (h) {
+      V.current = h;
+      return;
+    }
+    if (l && !h && U.current) {
+      V.current = null;
+      const g = ce(U.current);
+      i({ type: "SET_PANELS", panels: g });
+      return;
+    }
+    V.current = h;
+  }, [h, ce]), Xe(() => {
+    if (!S.current) return;
+    const l = new ResizeObserver((g) => {
+      for (const w of g) {
+        const M = w.target, A = M ? Oe(M, "horizontal") : null, B = M ? Oe(M, "vertical") : null, H = A ? A.inner : 0, Z = B ? B.inner : 0, T = w.contentRect.width, R = w.contentRect.height, F = H > 0 ? H : T, k = Z > 0 ? Z : R;
+        Y.current = { width: F, height: k };
+        const Q = y.current, ne = Math.abs(Q.width - F) >= 0.5, K = Math.abs(Q.height - k) >= 0.5;
+        ne || K ? (O.current && (clearTimeout(O.current), O.current = null), !z && F > 0 && k > 0 && s(!0), u({ width: F, height: k }), y.current = { width: F, height: k }) : (O.current && clearTimeout(O.current), O.current = setTimeout(() => {
+          const W = Y.current;
+          u(W), y.current = W, O.current = null;
+        }, 150));
+      }
+    });
+    return l.observe(S.current), () => {
+      l.disconnect(), O.current && clearTimeout(O.current);
+    };
+  }, [z]), se(() => () => {
+    Object.values(N.current).forEach(clearTimeout);
+  }, []), Xe(() => {
+    const l = de.current, g = p, w = t === "horizontal" ? Math.abs(l.width - g.width) >= 0.5 : Math.abs(l.height - g.height) >= 0.5;
+    if (a && w) {
+      const M = t === "horizontal" ? g.width : g.height;
+      i({ type: "CONTAINER_RESIZED", containerSize: M, direction: t });
+    }
+    de.current = g;
+  }, [p, a, t]);
+  const Pe = Se(() => {
+    Ue.debug("panels[0]?.id", c[0]?.id);
+    const l = c.some((f) => {
+      if (f.collapsed || f.sizeUnit !== "percentage")
+        return !1;
+      const ee = f.collapseFromStart || f.collapseFromEnd ? f.sizeBeforeCollapse ?? f.measuredPixelSizeBeforeCollapse ?? f.originalPixelSize ?? f.measuredPixelSize ?? 0 : f.measuredPixelSize ?? f.originalPixelSize ?? f.size, ie = f.percentageSize !== void 0 && f.percentageSize > 0;
+      return f.size <= 0 && (ee > 0 || ie);
+    }), g = t === "horizontal" ? p.width : p.height, w = g > 0;
+    if (h || !w || !(c.length > 0 && (c.length !== re.current || !a || l)))
+      return;
+    const B = c.filter((f) => !f.collapsed && (f.originalPixelSize !== void 0 || f.sizeUnit === "pixels")).reduce((f, L) => {
+      const ee = L.preferredPixelSize ?? L.originalPixelSize ?? L.size;
+      return f + Math.max(0, ee ?? 0);
+    }, 0), H = c.filter((f) => f.sizeUnit === "percentage" && !f.collapsed), Z = H.map((f) => f.id), T = H.map((f) => {
+      const L = f.preferredPercentageSize ?? f.percentageSize;
+      return L !== void 0 && L > 0 ? We(L, g) : f.size > 0 ? f.size : 0;
+    }), R = T.reduce((f, L) => f + L, 0), F = g - B, k = Math.max(0, F), Q = k > 0, ne = c.map((f) => {
+      if (f.collapsed) {
+        const L = f.sizeBeforeCollapse ?? f.measuredPixelSizeBeforeCollapse ?? f.originalPixelSize ?? (f.sizeUnit === "pixels" ? f.size : void 0), ee = f.sizeUnit === "percentage" && f.percentageSize !== void 0 ? We(f.percentageSize, g) : void 0, ie = L ?? ee ?? 0, xe = f.measuredPixelSizeBeforeCollapse ?? f.measuredPixelSize ?? ie;
+        return {
+          ...f,
+          size: 0,
+          percentageSize: 0,
+          preferredPercentageSize: f.preferredPercentageSize,
+          sizeBeforeCollapse: ie,
+          percentageSizeBeforeCollapse: f.percentageSizeBeforeCollapse ?? f.percentageSize ?? f.preferredPercentageSize ?? 0,
+          preferredPercentageSizeBeforeCollapse: f.preferredPercentageSizeBeforeCollapse ?? f.preferredPercentageSize ?? f.percentageSize ?? void 0,
+          preferredPixelSizeBeforeCollapse: f.preferredPixelSizeBeforeCollapse ?? f.preferredPixelSize ?? ie,
+          measuredPixelSizeBeforeCollapse: xe
+        };
+      }
+      if (f.sizeUnit === "pixels" || f.originalPixelSize !== void 0) {
+        const L = f.size, ee = g > 0 ? Ce(L, g) : 0, ie = {
+          ...f,
+          size: L,
+          percentageSize: ee,
+          preferredPixelSize: f.preferredPixelSize ?? f.originalPixelSize ?? L,
+          preferredPercentageSize: f.preferredPercentageSize !== void 0 ? f.preferredPercentageSize : ee > 0 ? ee : void 0
+        };
+        if (f.collapseFromStart || f.collapseFromEnd) {
+          const xe = f.sizeBeforeCollapse ?? L, Ne = f.measuredPixelSizeBeforeCollapse ?? f.measuredPixelSize ?? xe;
+          ie.sizeBeforeCollapse = xe, ie.measuredPixelSizeBeforeCollapse = Ne, ie.preferredPixelSizeBeforeCollapse = f.preferredPixelSizeBeforeCollapse ?? f.preferredPixelSize ?? xe;
+        }
+        return ie;
+      }
+      if (f.sizeUnit === "percentage") {
+        const L = Z.indexOf(f.id), ee = L !== -1 ? T[L] : 0, ie = te(f.minSize, 0, g), xe = te(f.maxSize, g, g), Ne = Math.max(
+          ie,
+          f.sizeBeforeCollapse ?? 0,
+          f.measuredPixelSizeBeforeCollapse ?? 0,
+          f.measuredPixelSize ?? 0,
+          f.originalPixelSize ?? 0,
+          f.size > 0 ? f.size : 0,
+          f.percentageSize !== void 0 ? We(f.percentageSize, g) : 0,
+          1
+        ), ke = ee > 0 ? ee : Ne;
+        let Ae;
+        if (!Q)
+          Ae = ie;
+        else if (L !== -1 && R > 0) {
+          const we = ke / R, Ie = k * we;
+          Ae = me(Ie, ie, xe);
+        } else {
+          const we = f.percentageSize !== void 0 ? We(f.percentageSize, g) : f.size, Ie = we > 0 ? we : ke;
+          Ae = me(Ie, ie, xe);
+        }
+        const Ge = g > 0 ? Ce(Ae, g) : 0, Te = {
+          ...f,
+          size: Ae,
+          percentageSize: Ge,
+          preferredPercentageSize: f.preferredPercentageSize !== void 0 ? f.preferredPercentageSize : Ge > 0 ? Ge : void 0
+        };
+        if (f.collapseFromStart || f.collapseFromEnd) {
+          const we = f.sizeBeforeCollapse ?? Ae, Ie = f.measuredPixelSizeBeforeCollapse ?? f.measuredPixelSize ?? we;
+          Te.sizeBeforeCollapse = we, Te.measuredPixelSizeBeforeCollapse = Ie, Te.preferredPixelSizeBeforeCollapse = f.preferredPixelSizeBeforeCollapse ?? f.preferredPixelSize ?? we;
+        }
+        return Te;
+      }
+      return f;
+    }), K = [];
+    for (let f = 0; f < ne.length; f += 1) {
+      const L = ne[f];
+      L.sizeUnit === "percentage" && !L.collapsed && K.push(f);
+    }
+    const W = K.reduce((f, L) => f + ne[L].size, 0), q = F - W;
+    Math.abs(q) > 0 && Ct(ne, q, g, { enforceAutoMinSize: !0 }), i({ type: "SET_PANELS", panels: ne }), re.current = c.length, o(!0);
+  }, [c, t, p.width, p.height, a, h]);
+  se(() => {
+    const l = t === "horizontal" ? p.width : p.height, g = l > 0, w = g && c.length > 0, M = w ? c.reduce((R, F) => {
+      if (F.collapsed)
+        return R;
+      const k = te(F.minSize, 0, l);
+      return R + Math.max(0, k);
+    }, 0) : null, A = w ? c.reduce((R, F) => {
+      if (F.collapsed)
+        return R;
+      const k = te(F.maxSize, l, l);
+      return R + Math.max(0, k);
+    }, 0) : null, B = M ?? h?.totalMinimumSize ?? null, H = A ?? h?.totalMaximumSize ?? null;
+    if (!g) {
+      h && b((R) => !R || R.availableContainerSize === l ? R : {
+        reason: R.reason,
+        // totalMinimumSize: previous.totalMinimumSize,
+        // totalMaximumSize: previous.totalMaximumSize,
+        totalMinimumSize: null,
+        totalMaximumSize: null,
+        availableContainerSize: l
+      });
+      return;
+    }
+    const Z = B !== null && B - l > Number.EPSILON, T = H !== null && l - H > Number.EPSILON;
+    if (Z || T) {
+      const F = {
+        reason: Z ? "minimum-exceeded" : "maximum-insufficient",
+        totalMinimumSize: B,
+        totalMaximumSize: H,
+        availableContainerSize: l
+      };
+      b((k) => k && k.reason === F.reason && Math.abs((k.totalMinimumSize ?? 0) - (F.totalMinimumSize ?? 0)) <= Number.EPSILON && Math.abs((k.totalMaximumSize ?? 0) - (F.totalMaximumSize ?? 0)) <= Number.EPSILON && Math.abs(k.availableContainerSize - F.availableContainerSize) <= Number.EPSILON ? k : F);
+      return;
+    }
+    if (h) {
+      const R = h.reason === "minimum-exceeded", F = h.reason === "maximum-insufficient";
+      (!R || B !== null) && (!F || H !== null) && !Z && !T && b((W) => W && null);
+    }
+  }, [c, t, p.width, p.height, h]), se(() => {
+    Pe();
+  }, [Pe]), se(() => {
+    D.current = n;
+  }, [n]);
+  const he = ae(() => c.map((l) => l.size), [c]);
+  Xe(() => {
+    he.length > 0 && D.current && D.current(he);
+  }, [he]), se(() => {
+    if (d && he.length > 0) {
+      const l = setTimeout(() => {
+        At(d, he);
+      }, 200);
+      return () => clearTimeout(l);
+    }
+  }, [d, he]), se(() => {
+    if (!d || c.length === 0 || X.current)
+      return;
+    const l = t === "horizontal" ? p.width : p.height;
+    if (l <= 0)
+      return;
+    const g = Lt(d);
+    if (g && g.length === c.length) {
+      const w = c.map((M, A) => {
+        const B = te(M.minSize, 0, l), H = te(M.maxSize, l, l), Z = me(g[A], B, H), T = Ce(Z, l), R = M.sizeUnit === "pixels" || M.originalPixelSize !== void 0 ? Z : M.preferredPixelSize;
+        return {
+          ...M,
+          size: Z,
+          percentageSize: T,
+          preferredPercentageSize: T > 0 ? T : M.preferredPercentageSize,
+          preferredPixelSize: R
+        };
+      });
+      i({ type: "SET_PANELS", panels: w }), X.current = !0;
+    }
+  }, [d, c, p.width, p.height, t]);
+  const ue = Se((l) => {
+    const g = j.current, w = oe.current, M = JSON.stringify({
+      id: l.id,
+      size: l.size ?? null,
+      percentageSize: l.percentageSize ?? null,
+      preferredPercentageSize: l.preferredPercentageSize ?? null,
+      preferredPixelSize: l.preferredPixelSize ?? null,
+      sizeUnit: l.sizeUnit,
+      originalPixelSize: l.originalPixelSize ?? null,
+      minSize: l.minSize ?? null,
+      maxSize: l.maxSize ?? null,
+      collapseFromStart: l.collapseFromStart,
+      collapseFromEnd: l.collapseFromEnd,
+      collapsed: l.collapsed ?? !1,
+      collapsedByDirection: l.collapsedByDirection ?? null,
+      sizeBeforeCollapse: l.sizeBeforeCollapse ?? null,
+      percentageSizeBeforeCollapse: l.percentageSizeBeforeCollapse ?? null,
+      preferredPercentageSizeBeforeCollapse: l.preferredPercentageSizeBeforeCollapse ?? null,
+      preferredPixelSizeBeforeCollapse: l.preferredPixelSizeBeforeCollapse ?? null,
+      pixelAdjustPriority: l.pixelAdjustPriority ?? null
+    });
+    if (w[l.id] === M) {
+      Ue.debug("useResizablePanels.registerPanel skipped", {
+        panelId: l.id,
+        reason: "duplicate-registration"
+      });
+      return;
+    }
+    w[l.id] = M, Ue.debug("useResizablePanels.registerPanel", {
+      panelId: l.id,
+      containerReady: _.current,
+      violationReason: E.current,
+      containerSize: {
+        width: g.width,
+        height: g.height
+      }
+    }), i({ type: "REGISTER_PANEL", panel: l });
+  }, []), pe = Se((l) => {
+    const g = j.current;
+    Ue.debug("useResizablePanels.unregisterPanel", {
+      panelId: l,
+      containerReady: _.current,
+      violationReason: E.current,
+      containerSize: {
+        width: g.width,
+        height: g.height
+      }
+    }), i({ type: "UNREGISTER_PANEL", id: l }), delete oe.current[l], v((w) => {
+      if (!(l in w))
+        return w;
+      const M = { ...w };
+      return delete M[l], M;
+    });
+  }, []), ge = Se(
+    (l, g, w, M) => {
+      const A = t === "horizontal" ? p.width : p.height, B = c.find((W) => W.id === l), H = c.find((W) => W.id === g);
+      if (!(B && H)) {
+        i({ type: "RESIZE_PANELS", leftId: l, rightId: g, leftSize: w, rightSize: M, containerSize: A });
+        return;
+      }
+      if (B.collapsed || H.collapsed)
+        return;
+      const Z = te(B.minSize, 0, A), T = te(B.maxSize, A, A), R = te(H.minSize, 0, A), F = te(H.maxSize, A, A);
+      let k = me(w, Z, T), Q = me(M, R, F);
+      const ne = k + Q, K = w + M;
+      if (Math.abs(ne - K) > 1e-9) {
+        const W = K - ne;
+        if (W > 0) {
+          const q = T - k, f = F - Q, L = q + f;
+          if (L > 0) {
+            const ee = Math.min(W * (q / L), q), ie = Math.min(W - ee, f);
+            k += ee, Q += ie;
+          }
+        } else if (W < 0) {
+          const q = Math.abs(W), f = k - Z, L = Q - R, ee = f + L;
+          if (ee > 0) {
+            const ie = Math.min(q * (f / ee), f), xe = Math.min(q - ie, L);
+            k -= ie, Q -= xe;
+          }
+        }
+      }
+      k = me(k, Z, T), Q = me(Q, R, F), Math.abs(k + Q - K) > 1e-9 && Ue.error("Total size after constraints should be close to the original total size.", { constrainedLeftSize: k, constrainedRightSize: Q, originalTotalSize: K }), i({ type: "RESIZE_PANELS", leftId: l, rightId: g, leftSize: k, rightSize: Q, containerSize: A });
+    },
+    [t, p.width, p.height, c]
+  ), ye = Se(
+    (l, g) => {
+      const w = t === "horizontal" ? p.width : p.height;
+      i({ type: "COLLAPSE_PANEL", id: l, from: g, containerSize: w });
+    },
+    [t, p.width, p.height]
+  ), Be = Se(
+    (l, g, w) => {
+      const M = t === "horizontal" ? p.width : p.height;
+      i({ type: "EXPAND_PANEL", id: l, from: g, containerSize: M, targetSize: w });
+    },
+    [t, p.width, p.height]
+  ), Re = Se(
+    (l) => c.find((g) => g.id === l),
+    [c]
+  ), G = Se((l, g) => {
+    v((w) => {
+      if (g === null) {
+        if (!(l in w))
+          return w;
+        const H = { ...w };
+        return delete H[l], H;
+      }
+      const M = w[l], A = M && Math.abs(M.pixelSize - g.pixelSize) < 0.1, B = M && Math.abs(M.percentageSize - g.percentageSize) < 0.01;
+      return A && B ? (N.current[l] && clearTimeout(N.current[l]), be.current[l] = g, N.current[l] = setTimeout(() => {
+        const H = be.current[l];
+        H && v((Z) => ({
+          ...Z,
+          [l]: H
+        })), delete N.current[l];
+      }, 200), w) : (N.current[l] && (clearTimeout(N.current[l]), delete N.current[l]), {
+        ...w,
+        [l]: g
+      });
+    });
+  }, []), le = Se((l, g) => {
+    C((w) => {
+      if (g === null) {
+        if (!(l in w))
+          return w;
+        const A = { ...w };
+        return delete A[l], A;
+      }
+      const M = w[l];
+      return M && Math.abs(M.thickness - g.thickness) <= 0.25 && M.visible === g.visible && M.direction === g.direction && M.startPanelId === g.startPanelId && M.endPanelId === g.endPanelId ? w : {
+        ...w,
+        [l]: g
+      };
+    });
+  }, []), P = ae(
+    () => ({
+      direction: t,
+      panels: c,
+      containerSize: p,
+      isContainerReady: z,
+      showDebugInfo: r,
+      registerPanel: ue,
+      unregisterPanel: pe,
+      resizePanels: ge,
+      collapsePanel: ye,
+      expandPanel: Be,
+      getPanel: Re,
+      reportPanelMeasurement: G,
+      panelMeasurements: m,
+      reportHandleMeasurement: le,
+      handleMeasurements: x,
+      layoutConstraintViolation: h
+    }),
+    [t, c, p, z, r, ue, pe, ge, ye, Be, Re, G, m, le, x, h]
+  ), $ = ae(
+    () => ({
+      display: "flex",
+      flexDirection: t === "horizontal" ? "row" : "column",
+      alignItems: "stretch",
+      width: "100%",
+      height: "100%",
+      minWidth: "0px",
+      minHeight: "0px",
+      position: "relative",
+      overflow: "hidden",
+      // リサイズハンドルのはみ出しでスクロールバーを表示させない
+      ...e
+    }),
+    [t, e]
+  );
+  return {
+    groupRef: S,
+    contextValue: P,
+    groupStyle: $
+  };
+}, di = (t) => {
+  const { getPanel: e, collapsePanel: n, expandPanel: d } = rt(), r = e(t), c = Se(
+    (u) => {
+      n(t, u);
+    },
+    [n, t]
+  ), i = Se(
+    (u, z) => {
+      d(t, u, z);
+    },
+    [d, t]
+  ), p = Se(
+    (u, z) => {
+      r?.collapsed ? i(u, z) : c(u);
+    },
+    [r?.collapsed, c, i]
+  );
+  return ae(
+    () => ({
+      panel: r,
+      isCollapsed: r?.collapsed ?? !1,
+      canCollapseFromStart: r?.collapseFromStart ?? !1,
+      canCollapseFromEnd: r?.collapseFromEnd ?? !1,
+      collapse: c,
+      expand: i,
+      toggle: p
+    }),
+    [r, c, i, p]
+  );
+}, Tt = ({ panel: t, measuredPixelSize: e, measuredPercentageSize: n, containerAxisSize: d, containerLabel: r }) => {
+  const c = t?.size, i = typeof c == "number" && Number.isFinite(c) ? `${c.toFixed(3)}px` : "-", p = t?.percentageSize !== void 0 ? `${t.percentageSize.toFixed(3)}%` : "-", u = Number.isFinite(e) ? `${e.toFixed(3)}px` : "-", z = Number.isFinite(n) ? `${n.toFixed(3)}%` : "-", s = Number.isFinite(d) ? `${d.toFixed(3)}px` : "-", a = `${i} / ${p}`, o = `${u} / ${z}`, h = t?.sizeUnit === "pixels" ? "Fixed" : "Flexible", b = [h, `${r}: ${s}`, `size (state): ${a}`, `size (measured): ${o}`];
+  return {
+    stateValueDisplay: a,
+    measuredValueDisplay: o,
+    containerDisplay: s,
+    headlineLabel: h,
+    titleText: b.join(`
+`)
+  };
+}, _t = it(({ panel: t, measuredPixelSize: e, measuredPercentageSize: n, containerAxisSize: d, direction: r }) => {
+  const c = r === "horizontal" ? "container width" : "container height", { stateValueDisplay: i, measuredValueDisplay: p, containerDisplay: u, headlineLabel: z, titleText: s } = ae(
+    () => Tt({
+      panel: t,
+      measuredPixelSize: e,
+      measuredPercentageSize: n,
+      containerAxisSize: d,
+      containerLabel: c
+    }),
+    [t, e, n, d, c]
+  ), a = {
+    position: "absolute",
+    top: "2px",
+    right: "4px",
+    backgroundColor: "rgba(30, 41, 59, 0.6)",
+    color: "#fff",
+    padding: "4px 8px",
+    borderRadius: "6px",
+    fontSize: "11px",
+    fontFamily: "monospace",
+    pointerEvents: "auto",
+    zIndex: 10,
+    boxShadow: "0 2px 4px rgba(0,0,0,0.3)",
+    border: "1px solid rgba(255,255,255,0.1)",
+    maxWidth: "calc(100% - 12px)",
+    minWidth: "60px",
+    width: "fit-content",
+    overflow: "hidden"
+  }, o = {
+    display: "flex",
+    flexDirection: "column",
+    gap: "1px",
+    minWidth: "0",
+    width: "100%"
+  }, h = {
+    display: "flex",
+    justifyContent: "flex-start",
+    alignItems: "center",
+    gap: "6px",
+    fontSize: "10px",
+    color: "#ccc",
+    whiteSpace: "nowrap",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    minWidth: "0",
+    width: "100%"
+  }, b = {
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+    gap: "6px",
+    whiteSpace: "nowrap",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    minWidth: "0",
+    width: "100%"
+  }, m = {
+    marginLeft: "auto",
+    fontVariantNumeric: "tabular-nums",
+    whiteSpace: "nowrap"
+  };
+  return /* @__PURE__ */ I("div", { style: a, title: s, children: /* @__PURE__ */ fe("div", { style: o, children: [
+    /* @__PURE__ */ I("div", { style: h, children: /* @__PURE__ */ I("span", { children: z }) }),
+    /* @__PURE__ */ fe("div", { style: b, children: [
+      /* @__PURE__ */ I("span", { children: c }),
+      /* @__PURE__ */ I("span", { style: m, children: u })
+    ] }),
+    /* @__PURE__ */ fe("div", { style: b, children: [
+      /* @__PURE__ */ I("span", { children: "size (state)" }),
+      /* @__PURE__ */ I("span", { style: m, children: i })
+    ] }),
+    /* @__PURE__ */ fe("div", { style: b, children: [
+      /* @__PURE__ */ I("span", { children: "size (measured)" }),
+      /* @__PURE__ */ I("span", { style: m, children: p })
+    ] })
+  ] }) });
+}), tt = new je(qe.INFO, "[resize-panels]"), kt = {
+  both: {
+    collapseFromStart: !0,
+    collapseFromEnd: !0
+  },
+  start: {
+    collapseFromStart: !0,
+    collapseFromEnd: !1
+  },
+  end: {
+    collapseFromStart: !1,
+    collapseFromEnd: !0
+  }
+}, Gt = (t) => {
+  if (!t)
+    return {
+      collapseFromStart: !1,
+      collapseFromEnd: !1
+    };
+  const e = kt[t.from];
+  if (!e)
+    throw new Error("Invalid collapsible configuration: unsupported 'from' value");
+  return e;
+}, lt = ({ ref: t, setState: e, panelIdRef: n, label: d, timerRef: r }) => (c) => {
+  if (!Number.isFinite(c))
+    return;
+  const i = c < 0 ? 0 : c, p = d === "pixel" ? 0.1 : 0.01;
+  if (Math.abs(t.current - i) < p) {
+    r && (r.current && clearTimeout(r.current), r.current = setTimeout(() => {
+      t.current = i, e(i), r.current = null;
+    }, 200));
+    return;
+  }
+  r?.current && (clearTimeout(r.current), r.current = null), t.current = i, tt.debug(`commit ${d}`, {
+    panelId: n.current,
+    [d]: i
+  }), e(i);
+}, ui = it(
+  ({ id: t, defaultSize: e = { value: 50, unit: "percentage" }, minSize: n, maxSize: d, autoMinSize: r, className: c, style: i, children: p, order: u = 0, collapsible: z, defaultCollapsed: s = !1, pixelAdjustPriority: a, flexAdjustPriority: o, contentOverflow: h = "auto" }) => {
+    const { direction: b, registerPanel: m, unregisterPanel: v, getPanel: x, showDebugInfo: C, isContainerReady: S, reportPanelMeasurement: D, containerSize: X } = rt(), re = J(null), de = zt(), j = J(t || `panel-${de}`), _ = ae(() => Gt(z), [z]), E = _.collapseFromStart || _.collapseFromEnd, oe = ae(() => E ? _.collapseFromStart ? "start" : _.collapseFromEnd ? "end" : null : null, [E, _.collapseFromStart, _.collapseFromEnd]), U = E && s, V = ae(() => Qe(e), [e]), O = V?.unit === "pixels", Y = O ? void 0 : V?.value, y = x(j.current), N = !!y?.collapsed, be = (y?.size ?? 0) <= 0, ce = N || be, [Pe, he] = Me(() => O && V ? V.value : y?.size !== void 0 ? y.size : 0), [ue, pe] = Me(() => !O && V ? V.value : y?.percentageSize !== void 0 ? y.percentageSize : 0), ge = J(Pe), ye = J(ue), Be = J(null), Re = J(null);
+    se(() => () => {
+      Be.current && clearTimeout(Be.current), Re.current && clearTimeout(Re.current);
+    }, []);
+    const G = ae(
+      () => lt({
+        ref: ge,
+        setState: he,
+        panelIdRef: j,
+        label: "pixel",
+        timerRef: Be
+      }),
+      []
+    ), le = ae(
+      () => lt({
+        ref: ye,
+        setState: pe,
+        panelIdRef: j,
+        label: "percentage",
+        timerRef: Re
+      }),
+      []
+    ), P = Se(() => {
+      ge.current !== 0 && (ge.current = 0, he(0)), ye.current !== 0 && (ye.current = 0, pe(0));
+    }, []);
+    se(() => {
+      if (!S)
+        return;
+      let T = 0;
+      if (O && V) {
+        let q = V.value;
+        n && typeof n == "object" && n.unit === "pixels" && (q = Math.max(q, n.value)), d && typeof d == "object" && d.unit === "pixels" && (q = Math.min(q, d.value)), T = q;
+      }
+      const R = U, F = R ? oe : null;
+      s && !E && tt.warn("Panel defaultCollapsed is ignored because collapsible configuration is not provided.");
+      const k = E && R && O ? T : void 0, Q = E ? Y : void 0, ne = O ? T : void 0, K = {
+        id: j.current,
+        size: R ? 0 : T,
+        percentageSize: R ? 0 : Y,
+        preferredPercentageSize: Y,
+        preferredPixelSize: ne,
+        sizeUnit: V?.unit || "percentage",
+        originalPixelSize: O ? T : void 0,
+        minSize: n,
+        maxSize: d,
+        collapseFromStart: _.collapseFromStart,
+        collapseFromEnd: _.collapseFromEnd,
+        collapsedByDirection: F,
+        collapsed: R,
+        sizeBeforeCollapse: k,
+        percentageSizeBeforeCollapse: Q,
+        preferredPercentageSizeBeforeCollapse: E ? Y : void 0,
+        preferredPixelSizeBeforeCollapse: E ? ne : void 0,
+        pixelAdjustPriority: a,
+        flexAdjustPriority: o,
+        autoMinSize: r
+      };
+      m(K);
+    }, [
+      r,
+      _.collapseFromEnd,
+      _.collapseFromStart,
+      s,
+      V,
+      o,
+      E,
+      S,
+      O,
+      d,
+      n,
+      a,
+      oe,
+      Y,
+      m,
+      U
+    ]), se(() => () => {
+      v(j.current), D(j.current, null);
+    }, [v, D]);
+    const $ = y?.size ?? 0;
+    se(() => {
+      const T = re.current;
+      if (!T) return;
+      const R = () => {
+        if (!y)
+          return;
+        const K = T.parentElement;
+        if (!K) return;
+        const W = T.getBoundingClientRect(), q = Oe(K, "horizontal"), f = Oe(K, "vertical"), L = b === "horizontal" ? W.width : W.height, ee = b === "horizontal" ? q.inner : f.inner, ie = et(ee);
+        if (ce) {
+          P();
+          return;
+        }
+        const xe = y.size ?? 0, Ne = Math.max(2, ie * 0.5);
+        if (xe > ie && L < Ne) {
+          tt.debug("skip noisy measurement", {
+            panelId: j.current,
+            expectedPanelSize: xe,
+            measured: L,
+            noiseThreshold: Ne
+          });
+          return;
+        }
+        if (L > 0) {
+          G(L), ee > 0 && le(L / ee * 100);
+          return;
+        }
+        y.size !== void 0 && G(y.size), y.percentageSize !== void 0 ? le(y.percentageSize) : y.sizeUnit === "pixels" && y.size !== void 0 && ee > 0 && le(y.size / ee * 100);
+      }, F = new ResizeObserver(() => {
+        R();
+      });
+      F.observe(T), R();
+      const k = [], Q = new MutationObserver(() => {
+        (() => {
+          if (!re.current) return !1;
+          const W = re.current.getBoundingClientRect();
+          return (b === "horizontal" ? W.width : W.height) !== ge.current;
+        })() && setTimeout(R, 0);
+      }), ne = T.parentElement;
+      return ne && Q.observe(ne, {
+        childList: !0,
+        subtree: !0,
+        attributes: !0,
+        attributeFilter: ["style", "class"]
+      }), () => {
+        F.disconnect(), Q.disconnect();
+        for (const K of k)
+          clearTimeout(K);
+      };
+    }, [le, G, y, b, ce, P]);
+    const l = y?.size, g = y?.percentageSize, w = y?.sizeUnit;
+    se(() => {
+      if (y) {
+        if (ce) {
+          P();
+          return;
+        }
+        if (l !== void 0 && G(l), g !== void 0)
+          le(g);
+        else if (w === "pixels" && l !== void 0) {
+          const T = re.current, R = T?.parentElement;
+          if (T && R) {
+            const { width: F, height: k } = T.getBoundingClientRect(), Q = R.clientWidth, ne = R.clientHeight, K = b === "horizontal" ? F : k, W = b === "horizontal" ? Q : ne;
+            if (K > 0 && W > 0) {
+              const q = K / W * 100;
+              le(q);
+            }
+          }
+        }
+      }
+    }, [le, G, y, g, l, w, b, ce, P]), se(() => {
+      D(j.current, {
+        pixelSize: Pe,
+        percentageSize: ue
+      });
+    }, [D, Pe, ue]);
+    const M = () => ce ? "0px" : y?.originalPixelSize !== void 0 ? `${$}px` : y?.percentageSize !== void 0 ? `${y.percentageSize}%` : `${$}px`, A = y?.sizeUnit === "percentage" && !y?.collapsed ? 1 : 0, B = {
+      flexBasis: M(),
+      flexGrow: 0,
+      flexShrink: A,
+      overflow: "hidden",
+      position: "relative",
+      boxSizing: "border-box",
+      minHeight: "0px",
+      minWidth: "0px",
+      ...i
+    };
+    b === "horizontal" ? (B.height = "100%", B.minWidth = 0) : (B.width = "100%", B.minHeight = 0), ce && (b === "horizontal" ? (B.width = "0px", B.minWidth = "0px") : (B.height = "0px", B.minHeight = "0px"), B.flexGrow = 0, B.flexShrink = 0, B.pointerEvents = "none", B.visibility = "hidden", N && (B.display = "none"));
+    const H = b === "horizontal" ? X.width : X.height, Z = ae(
+      () => ({
+        position: "absolute",
+        inset: "0px",
+        overflow: h,
+        display: "flex",
+        flexDirection: "column",
+        width: "100%",
+        height: "100%",
+        minWidth: "0px",
+        minHeight: "0px"
+      }),
+      [h]
+    );
+    return /* @__PURE__ */ fe(
+      "div",
+      {
+        ref: re,
+        className: $e("panel", c),
+        style: B,
+        "data-panel-id": j.current,
+        "data-panel-size": $,
+        "data-panel-size-unit": y?.sizeUnit || "percentage",
+        "data-panel-pixel-size": y?.sizeUnit === "pixels" ? y?.originalPixelSize : null,
+        "data-panel-order": u,
+        "data-panel-collapsible": E,
+        "data-panel-collapse-start": _.collapseFromStart,
+        "data-panel-collapse-end": _.collapseFromEnd,
+        "data-panel-collapsed": y?.collapsed,
+        "aria-hidden": ce,
+        children: [
+          /* @__PURE__ */ I("div", { style: Z, children: p }),
+          C && /* @__PURE__ */ I(_t, { panel: y, measuredPixelSize: Pe, measuredPercentageSize: ue, containerAxisSize: H, direction: b })
+        ]
+      }
+    );
+  }
+), Ht = (t) => JSON.stringify(
+  t.map((e) => ({
+    id: e.id,
+    size: e.size,
+    percentageSize: e.percentageSize ?? null,
+    preferredPercentageSize: e.preferredPercentageSize ?? null,
+    preferredPixelSize: e.preferredPixelSize ?? null,
+    sizeUnit: e.sizeUnit,
+    originalPixelSize: e.originalPixelSize ?? null,
+    minSize: e.minSize ?? null,
+    maxSize: e.maxSize ?? null,
+    autoMinSize: e.autoMinSize ?? null,
+    collapseFromStart: e.collapseFromStart,
+    collapseFromEnd: e.collapseFromEnd,
+    collapsedByDirection: e.collapsedByDirection ?? null,
+    collapsed: e.collapsed ?? !1,
+    sizeBeforeCollapse: e.sizeBeforeCollapse ?? null,
+    preferredPercentageSizeBeforeCollapse: e.preferredPercentageSizeBeforeCollapse ?? null,
+    preferredPixelSizeBeforeCollapse: e.preferredPixelSizeBeforeCollapse ?? null,
+    measuredPixelSizeBeforeCollapse: e.measuredPixelSizeBeforeCollapse ?? null,
+    pixelAdjustPriority: e.pixelAdjustPriority ?? null,
+    flexAdjustPriority: e.flexAdjustPriority ?? null,
+    measuredPixelSize: e.measuredPixelSize ?? null,
+    measuredPercentageSize: e.measuredPercentageSize ?? null
+  }))
+), Ut = (t) => JSON.stringify(
+  t.map((e) => ({
+    id: e.id,
+    thickness: e.thickness,
+    visible: e.visible,
+    direction: e.direction,
+    startPanelId: e.startPanelId ?? null,
+    endPanelId: e.endPanelId ?? null
+  }))
+), Wt = () => {
+  const t = /* @__PURE__ */ new Set(), e = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set();
+  let d = null, r = 0, c = !0, i = [], p = {
+    ownerId: null,
+    groups: i
+  };
+  const u = () => {
+    for (const x of t)
+      x();
+  }, z = () => {
+    c = !0, u();
+  }, s = () => {
+    const x = d;
+    if (x && n.has(x))
+      return !1;
+    d = null;
+    const C = n.values().next();
+    return C.done || (d = C.value), x !== d;
+  };
+  return {
+    subscribe: (x) => (t.add(x), () => {
+      t.delete(x);
+    }),
+    getSnapshot: () => (s() && (c = !0), c && (i = Array.from(e.values()).sort((C, S) => C.index - S.index).map(({ serializedPanels: C, serializedHandles: S, ...D }) => D), p = {
+      ownerId: d,
+      groups: i
+    }, c = !1), p),
+    getOwnerId: () => (s() && (c = !0), d),
+    enableGroup: (x) => {
+      const C = n.size;
+      n.add(x), n.size !== C && s() && z();
+    },
+    disableGroup: (x) => {
+      n.delete(x) && s() && z();
+    },
+    updateGroup: (x, C) => {
+      const S = e.get(x), D = S?.index ?? r++, X = Ht(C.panels), re = Ut(C.handles), de = S?.displayName !== C.displayName, j = S?.direction !== C.direction, _ = S ? S.containerSize.width !== C.containerSize.width || S.containerSize.height !== C.containerSize.height : !0;
+      let E = S?.serializedPanels !== X;
+      if (!E && S)
+        if (S.panels.length !== C.panels.length)
+          E = !0;
+        else
+          for (let Y = 0; Y < C.panels.length; Y += 1) {
+            const y = S.panels[Y], N = C.panels[Y];
+            if (!(y && N)) {
+              E = !0;
+              break;
+            }
+            if (y.id !== N.id || y.size !== N.size || y.percentageSize !== N.percentageSize || y.collapsed !== N.collapsed || y.measuredPixelSize !== N.measuredPixelSize || y.measuredPercentageSize !== N.measuredPercentageSize) {
+              E = !0;
+              break;
+            }
+          }
+      let oe = S?.serializedHandles !== re;
+      if (!oe && S)
+        if (S.handles.length !== C.handles.length)
+          oe = !0;
+        else
+          for (let Y = 0; Y < C.handles.length; Y += 1) {
+            const y = S.handles[Y], N = C.handles[Y];
+            if (!(y && N)) {
+              oe = !0;
+              break;
+            }
+            if (y.id !== N.id || y.thickness !== N.thickness || y.visible !== N.visible || y.direction !== N.direction || y.startPanelId !== N.startPanelId || y.endPanelId !== N.endPanelId) {
+              oe = !0;
+              break;
+            }
+          }
+      if (!S && C.panels.length === 0 && C.handles.length === 0 || S && !de && !j && !_ && !E && !oe)
+        return;
+      const U = C.panels.map((Y) => ({ ...Y })), V = C.handles.map((Y) => ({ ...Y })), O = { ...C.containerSize };
+      e.set(x, {
+        groupId: x,
+        displayName: C.displayName,
+        direction: C.direction,
+        containerSize: O,
+        panels: U,
+        handles: V,
+        index: D,
+        serializedPanels: X,
+        serializedHandles: re
+      }), z();
+    },
+    removeGroup: (x) => {
+      const C = e.delete(x), S = n.delete(x), D = s();
+      (C || S || D) && z();
+    }
+  };
+}, Fe = Wt(), $t = () => ht(Fe.subscribe, Fe.getOwnerId, Fe.getOwnerId), jt = () => ht(Fe.subscribe, Fe.getSnapshot, Fe.getSnapshot), Vt = (t) => {
+  Fe.enableGroup(t);
+}, ct = (t) => {
+  Fe.disableGroup(t);
+}, Yt = (t, e) => {
+  Fe.updateGroup(t, e);
+}, dt = (t) => {
+  Fe.removeGroup(t);
+};
+let ut = 0;
+const Zt = () => (ut += 1, `panel-group-${ut}`), _e = (t, e) => typeof t != "number" || !Number.isFinite(t) ? "—" : `${(t < 0 ? 0 : t).toFixed(8)}${e}`, Xt = {
+  position: "fixed",
+  left: "50%",
+  bottom: "20px",
+  transform: "translate(-50%, 0)",
+  zIndex: 100,
+  maxWidth: "min(90vw, 1120px)",
+  width: "100%",
+  borderRadius: "14px",
+  backgroundColor: "rgba(15, 23, 42, 0.72)",
+  color: "#e2e8f0",
+  fontFamily: "monospace",
+  fontSize: "11px",
+  lineHeight: 1.6,
+  boxShadow: "0 22px 45px rgba(15,23,42,0.45)",
+  border: "1px solid rgba(148, 163, 184, 0.22)",
+  backdropFilter: "blur(10px)",
+  WebkitBackdropFilter: "blur(10px)",
+  pointerEvents: "auto",
+  overflow: "auto"
+}, qt = {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  flexWrap: "wrap",
+  gap: "12px"
+}, Jt = {
+  display: "flex",
+  flexDirection: "column",
+  gap: "4px"
+}, Kt = {
+  padding: "6px 10px",
+  borderRadius: "9999px",
+  border: "1px solid rgba(148, 163, 184, 0.35)",
+  color: "#e2e8f0",
+  fontWeight: 600,
+  fontSize: "10px",
+  letterSpacing: "0.03em",
+  textTransform: "uppercase",
+  cursor: "pointer",
+  transition: "background-color 0.18s ease, border-color 0.18s ease"
+}, Qt = {
+  padding: "10px 12px",
+  borderRadius: "10px",
+  backgroundColor: "rgba(30, 41, 59, 0.55)",
+  border: "1px solid rgba(148, 163, 184, 0.18)",
+  display: "flex",
+  flexDirection: "column",
+  gap: "10px"
+}, ei = {
+  padding: "8px 10px",
+  borderRadius: "8px",
+  backgroundColor: "rgba(15, 23, 42, 0.55)",
+  border: "1px solid rgba(148, 163, 184, 0.16)",
+  display: "flex",
+  flexDirection: "column",
+  gap: "4px"
+}, ft = {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  gap: "6px"
+}, ti = {
+  display: "grid",
+  gridTemplateColumns: "auto 1fr",
+  gap: "2px 10px",
+  color: "#e2e8f0"
+}, ii = {
+  padding: "2px 6px",
+  borderRadius: "9999px",
+  fontSize: "10px",
+  textTransform: "uppercase"
+}, ri = (t) => {
+  const e = t.reason === "minimum-exceeded", n = e ? "Layout unavailable: minimum panel sizes exceed the container." : "Layout unavailable: panels cannot fill the container with their maximum sizes.", d = e ? `Min required: ${Math.ceil(t.totalMinimumSize ?? 0)}px | Available: ${Math.floor(t.availableContainerSize)}px` : `Max total: ${Math.floor(t.totalMaximumSize ?? 0)}px | Needed: ${Math.floor(t.availableContainerSize)}px`;
+  return { summary: n, detail: d };
+}, ni = (t, e) => {
+  let n = !1;
+  const d = t.map((r) => {
+    const c = e[r.id];
+    return !c || r.measuredPixelSize === c.pixelSize && r.measuredPercentageSize === c.percentageSize ? r : (n = !0, {
+      ...r,
+      measuredPixelSize: c.pixelSize,
+      measuredPercentageSize: c.percentageSize
+    });
+  });
+  return n ? d : t;
+}, pt = (t, e, n) => {
+  const d = Oe(t, "horizontal"), r = Oe(t, "vertical"), c = t.getBoundingClientRect(), i = d.inner > 0 ? d.inner : e ?? c.width, p = r.inner > 0 ? r.inner : n ?? c.height;
+  return { width: i, height: p };
+}, fi = (t) => {
+  const { id: e, className: n, style: d, children: r, direction: c } = t, { groupRef: i, contextValue: p, groupStyle: u } = Ot(t), [z, s] = Me({ width: 0, height: 0 }), a = p.layoutConstraintViolation, o = !!a, h = ae(() => {
+    if (!a)
+      return null;
+    const { summary: U, detail: V } = ri(a);
+    return /* @__PURE__ */ fe(
+      "div",
+      {
+        className: "flex w-full flex-1 flex-col items-center justify-center gap-2 rounded-lg border border-slate-300 border-dashed bg-slate-100/70 px-6 py-8 text-center text-slate-600 text-sm dark:border-slate-600 dark:bg-slate-800/50 dark:text-slate-200",
+        "data-panel-group-placeholder": "constraint-violation",
+        children: [
+          /* @__PURE__ */ I("span", { children: U }),
+          /* @__PURE__ */ I("span", { className: "text-slate-500 text-xs dark:text-slate-400", children: V })
+        ]
+      }
+    );
+  }, [a]), m = J(e ?? Zt()).current, v = e ?? m, x = p.showDebugInfo && p.panels.length > 0, C = x ? p.panels : [], S = x ? p.panelMeasurements : {}, D = ae(() => {
+    if (!x)
+      return [];
+    const U = Object.values(p.handleMeasurements);
+    return U.length <= 1 ? U : U.slice().sort((V, O) => V.id.localeCompare(O.id));
+  }, [p.handleMeasurements, x]), X = p.containerSize, re = z.width > 0 ? z.width : X.width, de = z.height > 0 ? z.height : X.height, j = $t(), _ = x && j === m;
+  Xe(() => {
+    if (!x) {
+      s({ width: 0, height: 0 });
+      return;
+    }
+    if (typeof window > "u" || typeof ResizeObserver > "u")
+      return;
+    const U = i.current;
+    if (!U)
+      return;
+    const V = (Y) => {
+      s((y) => y.width === Y.width && y.height === Y.height ? y : Y);
+    }, O = new ResizeObserver((Y) => {
+      for (const y of Y) {
+        if (y.target !== U)
+          continue;
+        const N = pt(U, y.contentRect.width, y.contentRect.height);
+        V(N);
+      }
+    });
+    return O.observe(U), V(pt(U)), () => {
+      O.disconnect();
+    };
+  }, [i, x]);
+  const E = ae(() => ni(C, S), [C, S]);
+  se(() => {
+    if (!x) {
+      ct(m), dt(m);
+      return;
+    }
+    return Vt(m), () => {
+      ct(m), dt(m);
+    };
+  }, [x, m]), se(() => {
+    x && Yt(m, {
+      displayName: v,
+      direction: c,
+      containerSize: {
+        width: re,
+        height: de
+      },
+      panels: E,
+      handles: D
+    });
+  }, [x, m, v, c, re, de, E, D]);
+  const oe = ae(() => {
+    const U = {
+      ...u,
+      ...d
+    };
+    return U.position || (U.position = "relative"), U;
+  }, [u, d]);
+  return /* @__PURE__ */ fe(gt.Provider, { value: p, children: [
+    /* @__PURE__ */ fe("div", { ref: i, className: $e("panel-group", c === "horizontal" ? "flex-row" : "flex-col", n), style: oe, "data-panel-group-id": e, "data-panel-group-direction": c, children: [
+      r,
+      o && h ? /* @__PURE__ */ I(
+        "div",
+        {
+          className: "pointer-events-auto",
+          style: {
+            position: "absolute",
+            inset: 0,
+            zIndex: 40,
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            justifyContent: "center",
+            backgroundColor: "rgba(248, 250, 252, 0.82)",
+            backdropFilter: "blur(2px)"
+          },
+          children: h
+        }
+      ) : null
+    ] }),
+    _ && /* @__PURE__ */ I(oi, {})
+  ] });
+}, oi = () => {
+  const e = jt().groups, [n, d] = Me(!0);
+  if (e.length === 0 || typeof document > "u")
+    return null;
+  const r = e.reduce((u, z) => u + z.panels.length, 0), c = e.reduce((u, z) => u + (z.handles?.length ?? 0), 0), i = () => d((u) => !u), p = /* @__PURE__ */ fe(
+    "div",
+    {
+      style: {
+        ...Xt,
+        padding: n ? "10px 18px" : "14px 18px",
+        maxHeight: n ? "52px" : "min(65vh, 520px)",
+        transition: "max-height 0.24s ease, padding 0.24s ease"
+      },
+      children: [
+        /* @__PURE__ */ fe(
+          "div",
+          {
+            style: {
+              ...qt,
+              marginBottom: n ? 0 : "12px"
+            },
+            children: [
+              /* @__PURE__ */ fe("div", { style: Jt, children: [
+                /* @__PURE__ */ I(
+                  "span",
+                  {
+                    style: {
+                      fontWeight: 700,
+                      fontSize: "12px",
+                      letterSpacing: "0.03em"
+                    },
+                    children: "Panel Overview"
+                  }
+                ),
+                /* @__PURE__ */ fe("span", { style: { color: "#cbd5f5" }, children: [
+                  "groups: ",
+                  e.length,
+                  " / panels: ",
+                  r,
+                  " / resizers: ",
+                  c
+                ] })
+              ] }),
+              /* @__PURE__ */ I(
+                "button",
+                {
+                  type: "button",
+                  onClick: i,
+                  style: {
+                    ...Kt,
+                    backgroundColor: n ? "rgba(59, 130, 246, 0.2)" : "rgba(71, 85, 105, 0.45)"
+                  },
+                  title: n ? "Panel Overview を開く" : "Panel Overview を閉じる",
+                  children: n ? "開く" : "閉じる"
+                }
+              )
+            ]
+          }
+        ),
+        !n && /* @__PURE__ */ I(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              gap: "12px",
+              maxHeight: "45vh",
+              overflowY: "auto",
+              paddingRight: "6px"
+            },
+            children: e.map((u, z) => {
+              const s = u.direction === "horizontal" ? u.containerSize.width : u.containerSize.height;
+              return /* @__PURE__ */ fe("div", { style: Qt, children: [
+                /* @__PURE__ */ fe(
+                  "div",
+                  {
+                    style: {
+                      ...ft,
+                      flexWrap: "wrap",
+                      gap: "10px",
+                      color: "#dbeafe"
+                    },
+                    children: [
+                      /* @__PURE__ */ fe(
+                        "span",
+                        {
+                          style: {
+                            fontWeight: 600,
+                            fontSize: "11px",
+                            letterSpacing: "0.02em",
+                            textTransform: "uppercase"
+                          },
+                          children: [
+                            "group ",
+                            z + 1,
+                            ": ",
+                            u.displayName
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ fe("span", { children: [
+                        "direction: ",
+                        u.direction,
+                        " / container: ",
+                        _e(u.containerSize.width, "px"),
+                        " × ",
+                        _e(u.containerSize.height, "px")
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ I(
+                  "div",
+                  {
+                    style: {
+                      display: "grid",
+                      gridTemplateColumns: "repeat(auto-fill, minmax(220px, 1fr))",
+                      gap: "10px"
+                    },
+                    children: u.panels.map((a, o) => {
+                      const h = a.measuredPixelSize ?? a.size, b = a.size, m = _e(b, "px"), v = a.percentageSize ?? (s > 0 ? a.size / s * 100 : void 0), x = a.measuredPercentageSize !== void 0 ? a.measuredPercentageSize : s > 0 ? h / s * 100 : void 0, C = a.collapsed || h <= St, S = a.collapsed ? "collapsed" : C ? "hidden" : "visible", D = _e(v, "%"), X = _e(x, "%"), re = _e(h, "px");
+                      return /* @__PURE__ */ fe("div", { style: ei, children: [
+                        /* @__PURE__ */ fe("div", { style: ft, children: [
+                          /* @__PURE__ */ I("span", { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis" }, children: a.id }),
+                          /* @__PURE__ */ I(
+                            "span",
+                            {
+                              style: {
+                                ...ii,
+                                backgroundColor: a.collapsed ? "rgba(251, 113, 133, 0.25)" : C ? "rgba(250, 204, 21, 0.25)" : "rgba(74, 222, 128, 0.25)",
+                                color: a.collapsed ? "#fecdd3" : C ? "#fef08a" : "#bbf7d0"
+                              },
+                              children: S
+                            }
+                          )
+                        ] }),
+                        /* @__PURE__ */ fe("div", { style: ti, children: [
+                          /* @__PURE__ */ I("span", { children: "size (state):" }),
+                          /* @__PURE__ */ I("span", { children: m }),
+                          /* @__PURE__ */ I("span", { children: "size (measured):" }),
+                          /* @__PURE__ */ I("span", { children: re }),
+                          /* @__PURE__ */ I("span", { children: "percentage (state):" }),
+                          /* @__PURE__ */ I("span", { children: D }),
+                          /* @__PURE__ */ I("span", { children: "percentage (measured):" }),
+                          /* @__PURE__ */ I("span", { children: X }),
+                          /* @__PURE__ */ I("span", { children: "unit:" }),
+                          /* @__PURE__ */ I("span", { children: a.sizeUnit }),
+                          /* @__PURE__ */ I("span", { children: "min:" }),
+                          /* @__PURE__ */ I("span", { children: a.minSize !== void 0 ? JSON.stringify(a.minSize) : "—" }),
+                          /* @__PURE__ */ I("span", { children: "auto min:" }),
+                          /* @__PURE__ */ I("span", { children: a.autoMinSize !== void 0 ? JSON.stringify(a.autoMinSize) : "—" }),
+                          /* @__PURE__ */ I("span", { children: "max:" }),
+                          /* @__PURE__ */ I("span", { children: a.maxSize !== void 0 ? JSON.stringify(a.maxSize) : "—" }),
+                          /* @__PURE__ */ I("span", { children: "priority:" }),
+                          /* @__PURE__ */ I("span", { children: a.pixelAdjustPriority ?? "—" }),
+                          /* @__PURE__ */ I("span", { children: "flex priority:" }),
+                          /* @__PURE__ */ I("span", { children: a.flexAdjustPriority ?? "—" })
+                        ] })
+                      ] }, a.id || o);
+                    })
+                  }
+                )
+              ] }, u.groupId);
+            })
+          }
+        )
+      ]
+    }
+  );
+  return Et(p, document.body);
+}, pi = it(({ id: t, disabled: e = !1, className: n, style: d, children: r, onDragging: c }) => {
+  const { direction: i, resizePanels: p, getPanel: u, collapsePanel: z, expandPanel: s, panels: a, reportHandleMeasurement: o, containerSize: h, layoutConstraintViolation: b } = rt(), [m, v] = Me(!1), x = J(null), C = J(null), S = J(""), D = J(""), [X, re] = Me({ left: null, right: null }), de = zt(), j = J(t ?? `resize-handle-${de}`), _ = J(null), E = t ?? j.current, oe = !!b, U = e || oe;
+  se(() => {
+    if (x.current) {
+      const P = x.current.parentElement;
+      if (P) {
+        C.current = P;
+        const $ = Array.from(P.children), l = x.current, g = $.indexOf(l);
+        if (g > 0 && g < $.length - 1) {
+          let w = null, M = null;
+          for (let A = g - 1; A >= 0; A -= 1) {
+            const B = $[A];
+            if (B.dataset.panelId) {
+              w = B;
+              break;
+            }
+          }
+          for (let A = g + 1; A < $.length; A += 1) {
+            const B = $[A];
+            if (B.dataset.panelId) {
+              M = B;
+              break;
+            }
+          }
+          S.current = w?.dataset.panelId || "", D.current = M?.dataset.panelId || "", re({
+            left: S.current || null,
+            right: D.current || null
+          });
+        }
+      }
+    }
+  }, []), se(() => {
+    if (E === j.current)
+      return;
+    const P = j.current;
+    j.current = E, _.current = null, P !== E && o(P, null);
+  }, [o, E]), se(() => {
+    const P = j.current;
+    return () => {
+      o(P, null);
+    };
+  }, [o]);
+  const V = Se(
+    (P) => {
+      if (U || !C.current) return;
+      P.preventDefault(), P.stopPropagation();
+      const $ = C.current, { inner: l } = Oe($, i), g = { x: P.clientX, y: P.clientY }, w = u(S.current), M = u(D.current);
+      if (!(w && M)) return;
+      const A = w.size, B = M.size;
+      let H = 0;
+      const Z = Rt;
+      v(!0), c?.(!0), P.currentTarget.setPointerCapture(P.pointerId);
+      const T = (F) => {
+        if (!x.current) return;
+        F.preventDefault(), F.stopPropagation();
+        const k = performance.now();
+        if (k - H < Z) return;
+        H = k;
+        const Q = i === "horizontal" ? F.clientX - g.x : F.clientY - g.y;
+        if (Q === 0)
+          return;
+        const ne = A + Q, K = B - Q, W = u(S.current), q = u(D.current);
+        if (W && q && S.current && D.current) {
+          const f = te(W.minSize, 0, l), L = te(q.minSize, 0, l), ee = f, ie = L, xe = Math.min(l * mt, Pt), Ne = Math.min(l * It, Ft), ke = q.collapseFromStart, Ae = q.collapsedByDirection ?? "start";
+          if (ke && !q.collapsed && K <= Math.max(L * 0.3, xe)) {
+            z(D.current, "start");
+            return;
+          }
+          const Ge = W.collapseFromEnd, Te = W.collapsedByDirection ?? "end";
+          if (Ge && !W.collapsed && ne <= Math.max(f * 0.3, xe)) {
+            z(S.current, "end");
+            return;
+          }
+          if (q.collapsed && K > Math.max(L * 0.3, Ne)) {
+            s(D.current, Ae, K);
+            return;
+          }
+          if (W.collapsed && ne > Math.max(f * 0.3, Ne)) {
+            s(S.current, Te, ne);
+            return;
+          }
+          if (l > 0) {
+            const we = W.size + q.size, Ie = et(l);
+            let Je = !1;
+            if (ee <= Ie && ne <= Ie && A !== 0) {
+              const He = Math.max(0, we - 0);
+              He >= ie && (p(S.current, D.current, 0, He), Je = !0);
+            } else if (ie <= Ie && K <= Ie && B !== 0) {
+              const He = Math.max(0, we - 0);
+              He >= ee && (p(S.current, D.current, He, 0), Je = !0);
+            }
+            if (Je)
+              return;
+          }
+          if (W.collapsed || q.collapsed)
+            return;
+          p(S.current, D.current, ne, K);
+        }
+      }, R = () => {
+        v(!1), c?.(!1), document.removeEventListener("pointermove", T), document.removeEventListener("pointerup", R);
+      };
+      document.addEventListener("pointermove", T), document.addEventListener("pointerup", R);
+    },
+    [U, i, p, u, z, s, c]
+  ), O = i === "horizontal", y = $e(
+    "group absolute z-20 flex select-none items-center justify-center border-none bg-transparent transition-colors duration-150 overflow-visible",
+    O ? "cursor-col-resize" : "cursor-row-resize",
+    O ? "h-full" : "w-full",
+    !U && "hover:bg-gray-200/70 dark:hover:bg-gray-700/70",
+    !U && "active:bg-blue-300/60 dark:active:bg-blue-700/60",
+    m && "bg-blue-200/80 dark:bg-blue-800/60",
+    U && "cursor-not-allowed opacity-50",
+    "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50",
+    n
+  ), N = ae(() => {
+    const P = ($) => {
+      if (!$)
+        return -1;
+      for (let l = 0; l < a.length; l += 1)
+        if (a[l].id === $)
+          return l;
+      return -1;
+    };
+    return {
+      left: P(X.left),
+      right: P(X.right)
+    };
+  }, [X.left, X.right, a]), be = O ? h.width : h.height, ce = ae(() => {
+    const P = ($, l) => {
+      if ($ > l)
+        return 0;
+      let g = 0;
+      for (let w = $; w <= l; w += 1) {
+        const M = a[w];
+        if (!M)
+          continue;
+        const A = M.size ?? 0, B = Math.max(0, A);
+        g += M.collapsed ? 0 : B;
+      }
+      return g;
+    };
+    return N.left >= 0 ? P(0, N.left) : N.right > 0 ? P(0, N.right - 1) : 0;
+  }, [N.left, N.right, a]), Pe = ae(() => !Number.isFinite(ce) || ce < 0 ? 0 : be > 0 && ce > be ? be : ce, [ce, be]), he = ae(() => {
+    const P = {
+      position: "absolute",
+      zIndex: 20,
+      touchAction: "none"
+    };
+    return O ? (P.top = 0, P.left = `${Pe}px`, P.transform = "translateX(-50%)", P.width = `${nt}px`, P.height = "100%") : (P.left = 0, P.top = `${Pe}px`, P.transform = "translateY(-50%)", P.height = `${nt}px`, P.width = "100%"), P;
+  }, [Pe, O]), ue = ae(() => {
+    const P = et(be), $ = (Z) => {
+      if (Z < 0 || Z >= a.length)
+        return !1;
+      const T = a[Z];
+      return T ? T.collapsed ? !0 : T.size <= P : !1;
+    }, l = (Z, T) => {
+      if (!$(Z))
+        return 0;
+      let R = 0;
+      for (let F = Z; F >= 0 && F < a.length && $(F); F += T)
+        R += 1;
+      return R;
+    }, g = N.left, w = N.right, M = g >= 0 ? l(g, -1) : 0, A = w >= 0 ? l(w, 1) : 0;
+    return {
+      groupSize: M + A + 1,
+      overlapIndex: M
+    };
+  }, [N.left, N.right, a, be]), pe = ae(() => {
+    if (oe)
+      return !0;
+    if (ue.groupSize <= 1)
+      return !1;
+    const P = ue.groupSize - 1;
+    return ue.overlapIndex > 0 && ue.overlapIndex < P;
+  }, [ue, oe]), ge = ae(() => {
+    if (ue.groupSize <= 1 || pe)
+      return 0;
+    const P = ue.groupSize > 1 ? 2 : 1;
+    if (P === 1)
+      return 0;
+    const $ = ue.overlapIndex === 0 ? 0 : P - 1, l = (P - 1) / 2;
+    return ($ - l) * Bt;
+  }, [ue, pe]), ye = ae(() => {
+    if (pe)
+      return { display: "none" };
+    if (ge !== 0)
+      return O ? { transform: `translateX(${ge}px)` } : { transform: `translateY(${ge}px)` };
+  }, [ge, O, pe]), Be = $e(
+    "flex items-center justify-center rounded-full bg-white text-slate-700 ring-1 ring-inset ring-white/80 backdrop-blur-sm transition-colors duration-150 shadow-[0_0_0_1px_rgba(255,255,255,0.85),0_1px_3px_rgba(15,23,42,0.18)]",
+    "dark:bg-slate-800/95 dark:text-slate-200 dark:ring-slate-500/60 dark:shadow-[0_0_0_1px_rgba(148,163,184,0.45),0_1px_3px_rgba(2,6,23,0.55)]",
+    O ? "h-12 w-[6px] px-[2px]" : "h-[6px] w-20 py-[2px]",
+    m && "bg-blue-200/80 ring-blue-300 shadow-[0_0_0_1px_rgba(191,219,254,0.65),0_1px_4px_rgba(59,130,246,0.45)] dark:bg-blue-900/70 dark:ring-blue-400 dark:shadow-[0_0_0_1px_rgba(147,197,253,0.5),0_1px_4px_rgba(59,130,246,0.55)]"
+  ), Re = $e(
+    "rounded-full bg-slate-600 transition-colors duration-150 shadow-[0_0_0_1px_rgba(255,255,255,0.9)] dark:bg-slate-200 dark:shadow-[0_0_0_1px_rgba(15,23,42,0.55)]",
+    O ? "h-8 w-[2px]" : "h-[2px] w-16",
+    m && "bg-blue-500 dark:bg-blue-300",
+    !U && "group-hover:bg-slate-700 dark:group-hover:bg-slate-100"
+  ), G = Se(() => {
+    const P = x.current;
+    if (!P)
+      return;
+    let $ = 0;
+    if (!pe) {
+      const w = i === "horizontal" ? P.offsetWidth : P.offsetHeight;
+      let M = 0, A = 0;
+      if (typeof window < "u") {
+        const H = window.getComputedStyle(P);
+        i === "horizontal" ? (M = Number.parseFloat(H.marginLeft || "0"), A = Number.parseFloat(H.marginRight || "0")) : (M = Number.parseFloat(H.marginTop || "0"), A = Number.parseFloat(H.marginBottom || "0"));
+      }
+      $ = [w, M, A].reduce((H, Z) => Number.isFinite(Z) ? H + Z : H, 0);
+    }
+    (!Number.isFinite($) || $ < 0) && ($ = 0);
+    const l = {
+      id: E,
+      thickness: $,
+      direction: i,
+      visible: !pe && $ > Nt,
+      startPanelId: X.left,
+      endPanelId: X.right
+    }, g = _.current;
+    g && Math.abs(g.thickness - l.thickness) <= 0.25 && g.visible === l.visible && g.direction === l.direction && g.startPanelId === l.startPanelId && g.endPanelId === l.endPanelId || (_.current = l, o(E, l));
+  }, [i, X.left, X.right, o, E, pe]);
+  se(() => {
+    G();
+  }, [G]), se(() => {
+    const P = x.current;
+    if (!P)
+      return;
+    if (typeof ResizeObserver > "u") {
+      G();
+      return;
+    }
+    const $ = new ResizeObserver(() => {
+      G();
+    });
+    return $.observe(P), () => {
+      $.disconnect();
+    };
+  }, [G]);
+  const le = ae(() => {
+    const P = d ? { ...he, ...d } : he;
+    return pe ? {
+      ...P,
+      display: "none",
+      pointerEvents: "none",
+      visibility: "hidden"
+    } : P;
+  }, [he, pe, d]);
+  return /* @__PURE__ */ I(
+    "button",
+    {
+      type: "button",
+      ref: x,
+      className: y,
+      style: le,
+      onPointerDown: V,
+      disabled: U,
+      "aria-hidden": pe || void 0,
+      "aria-label": `Resize ${O ? "columns" : "rows"} - Drag to collapse/expand panels`,
+      "data-resize-handle-id": E,
+      title: `ドラッグして${O ? "列" : "行"}をリサイズ、端まで移動して折りたたみ/展開`,
+      children: r || /* @__PURE__ */ I("div", { className: Be, style: ye, children: /* @__PURE__ */ I("span", { className: Re }) })
+    }
+  );
+}), zi = (t) => document.querySelector(`[data-panel-id="${t}"]`), hi = (t) => document.querySelector(`[data-panel-group-id="${t}"]`), gi = (t) => document.querySelector(`[data-resize-handle-id="${t}"]`);
+export {
+  ui as Panel,
+  fi as PanelGroup,
+  gt as PanelGroupContext,
+  pi as PanelResizeHandle,
+  me as clamp,
+  te as getConstraintInPixels,
+  Oe as getContainerSize,
+  zi as getPanelElement,
+  hi as getPanelGroupElement,
+  gi as getResizeHandleElement,
+  Lt as loadLayout,
+  Qe as normalizeSizeConfig,
+  At as saveLayout,
+  di as usePanelControls,
+  rt as usePanelGroup,
+  Ot as useResizablePanels
+};