"use client"; import { jsx as q } from "react/jsx-runtime"; import { useState as N, useCallback as Pe, useId as Ke, useLayoutEffect as Xe, useEffect as Re, useRef as E, createContext as qe, useImperativeHandle as Ce, useMemo as re, useSyncExternalStore as Ye, useContext as Ze } from "react"; function z(e, t = "Assertion error") { if (!e) throw Error(t); } function B({ group: e }) { const { orientation: t, panels: n } = e; return n.reduce((o, i) => (o += t === "horizontal" ? i.element.offsetWidth : i.element.offsetHeight, o), 0); } function ie(e, t) { return t.sort( e === "horizontal" ? Je : Qe ); } function Je(e, t) { const n = e.element.offsetLeft - t.element.offsetLeft; return n !== 0 ? n : e.element.offsetWidth - t.element.offsetWidth; } function Qe(e, t) { const n = e.element.offsetTop - t.element.offsetTop; return n !== 0 ? n : e.element.offsetHeight - t.element.offsetHeight; } function Me(e) { return e !== null && typeof e == "object" && "nodeType" in e && e.nodeType === Node.ELEMENT_NODE; } function Ee(e, t) { return { x: e.x >= t.left && e.x <= t.right ? 0 : Math.min( Math.abs(e.x - t.left), Math.abs(e.x - t.right) ), y: e.y >= t.top && e.y <= t.bottom ? 0 : Math.min( Math.abs(e.y - t.top), Math.abs(e.y - t.bottom) ) }; } function et({ orientation: e, rects: t, targetRect: n }) { const o = { x: n.x + n.width / 2, y: n.y + n.height / 2 }; let i, s = Number.MAX_VALUE; for (const l of t) { const { x: r, y: a } = Ee(o, l), u = e === "horizontal" ? r : a; u < s && (s = u, i = l); } return z(i, "No rect found"), i; } function Ie(e) { const { element: t, orientation: n, panels: o, separators: i } = e, s = ie( n, Array.from(t.children).filter(Me).map((f) => ({ element: f })) ).map(({ element: f }) => f), l = []; let r = !1, a, u = []; for (const f of s) if (f.hasAttribute("data-panel")) { const p = o.find( (m) => m.element === f ); if (p) { if (a) { const m = a.element.getBoundingClientRect(), h = f.getBoundingClientRect(); let c; if (r) { const d = n === "horizontal" ? new DOMRect(m.right, m.top, 0, m.height) : new DOMRect( m.left, m.bottom, m.width, 0 ), y = n === "horizontal" ? new DOMRect(h.left, h.top, 0, h.height) : new DOMRect(h.left, h.top, h.width, 0); switch (u.length) { case 0: { c = [ d, y ]; break; } case 1: { const g = u[0], v = et({ orientation: n, rects: [m, h], targetRect: g.element.getBoundingClientRect() }); c = [ g, v === m ? y : d ]; break; } default: { c = u; break; } } } else u.length ? c = u : c = [ n === "horizontal" ? new DOMRect( m.right, h.top, h.left - m.right, h.height ) : new DOMRect( h.left, m.bottom, h.width, h.top - m.bottom ) ]; for (const d of c) l.push({ group: e, groupSize: B({ group: e }), panels: [a, p], separator: "width" in d ? void 0 : d, rect: "width" in d ? d : d.element.getBoundingClientRect() }); } r = !1, a = p, u = []; } } else if (f.hasAttribute("data-separator")) { const p = i.find( (m) => m.element === f ); p ? u.push(p) : (a = void 0, u = []); } else r = !0; return l; } function tt(e, t) { const n = getComputedStyle(e), o = parseFloat(n.fontSize); return t * o; } function nt(e, t) { const n = getComputedStyle(e.ownerDocument.body), o = parseFloat(n.fontSize); return t * o; } function ot(e) { return e / 100 * window.innerHeight; } function rt(e) { return e / 100 * window.innerWidth; } function it(e) { switch (typeof e) { case "number": return [e, "px"]; case "string": { const t = parseFloat(e); return e.endsWith("%") ? [t, "%"] : e.endsWith("px") ? [t, "px"] : e.endsWith("rem") ? [t, "rem"] : e.endsWith("em") ? [t, "em"] : e.endsWith("vh") ? [t, "vh"] : e.endsWith("vw") ? [t, "vw"] : [t, "%"]; } } } function Q({ groupSize: e, panelElement: t, styleProp: n }) { let o; const [i, s] = it(n); switch (s) { case "%": { o = i / 100 * e; break; } case "px": { o = i; break; } case "rem": { o = nt(t, i); break; } case "em": { o = tt(t, i); break; } case "vh": { o = ot(i); break; } case "vw": { o = rt(i); break; } } return o; } function G(e) { return parseFloat(e.toFixed(3)); } function pe(e) { const { panels: t } = e, n = B({ group: e }); return n === 0 ? t.map((o) => ({ collapsedSize: 0, collapsible: o.panelConstraints.collapsible === !0, defaultSize: void 0, minSize: 0, maxSize: 100, panelId: o.id })) : t.map((o) => { const { element: i, panelConstraints: s } = o; let l = 0; if (s.collapsedSize) { const f = Q({ groupSize: n, panelElement: i, styleProp: s.collapsedSize }); l = G(f / n * 100); } let r; if (s.defaultSize) { const f = Q({ groupSize: n, panelElement: i, styleProp: s.defaultSize }); r = G(f / n * 100); } let a = 0; if (s.minSize) { const f = Q({ groupSize: n, panelElement: i, styleProp: s.minSize }); a = G(f / n * 100); } let u = 100; if (s.maxSize) { const f = Q({ groupSize: n, panelElement: i, styleProp: s.maxSize }); u = G(f / n * 100); } return { collapsedSize: l, collapsible: s.collapsible === !0, defaultSize: r, minSize: a, maxSize: u, panelId: o.id }; }); } class st { #e = {}; addListener(t, n) { const o = this.#e[t]; return o === void 0 ? this.#e[t] = [n] : o.includes(n) || o.push(n), () => { this.removeListener(t, n); }; } emit(t, n) { const o = this.#e[t]; if (o !== void 0) if (o.length === 1) o[0].call(null, n); else { let i = !1, s = null; const l = Array.from(o); for (let r = 0; r < l.length; r++) { const a = l[r]; try { a.call(null, n); } catch (u) { s === null && (i = !0, s = u); } } if (i) throw s; } } removeAllListeners() { this.#e = {}; } removeListener(t, n) { const o = this.#e[t]; if (o !== void 0) { const i = o.indexOf(n); i >= 0 && o.splice(i, 1); } } } function R(e, t, n = 0) { return Math.abs(G(e) - G(t)) <= n; } let M = { cursorFlags: 0, interactionState: { state: "inactive" }, mountedGroups: /* @__PURE__ */ new Map() }; const T = new st(); function D() { return M; } function I(e) { const t = typeof e == "function" ? e(M) : e; if (M === t) return M; const n = M; return M = { ...M, ...t }, t.cursorFlags !== void 0 && T.emit("cursorFlagsChange", M.cursorFlags), t.interactionState !== void 0 && T.emit("interactionStateChange", M.interactionState), t.mountedGroups !== void 0 && (M.mountedGroups.forEach((o, i) => { o.derivedPanelConstraints.forEach((s) => { if (s.collapsible) { const { layout: l } = n.mountedGroups.get(i) ?? {}; if (l) { const r = R( s.collapsedSize, o.layout[s.panelId] ), a = R( s.collapsedSize, l[s.panelId] ); r && !a && (i.inMemoryLastExpandedPanelSizes[s.panelId] = l[s.panelId]); } } }); }), T.emit("mountedGroupsChange", M.mountedGroups)), M; } function at(e, t) { if (e.length !== t.length) return !1; for (let n = 0; n < e.length; n++) if (e[n] != t[n]) return !1; return !0; } function Y(e, t) { return R(e, t) ? 0 : e > t ? 1 : -1; } function H({ panelConstraints: e, size: t }) { const { collapsedSize: n = 0, collapsible: o, maxSize: i = 100, minSize: s = 0 } = e; if (Y(t, s) < 0) if (o) { const l = (n + s) / 2; Y(t, l) < 0 ? t = n : t = s; } else t = s; return t = Math.min(i, t), t = G(t), t; } function Z({ delta: e, initialLayout: t, panelConstraints: n, pivotIndices: o, prevLayout: i, trigger: s }) { if (R(e, 0)) return t; const l = Object.values(t), r = Object.values(i), a = [...l], [u, f] = o; z(u != null, "Invalid first pivot index"), z(f != null, "Invalid second pivot index"); let p = 0; if (s === "keyboard") { { const c = e < 0 ? f : u, d = n[c]; z( d, `Panel constraints not found for index ${c}` ); const { collapsedSize: y = 0, collapsible: g, minSize: v = 0 } = d; if (g) { const x = l[c]; if (z( x != null, `Previous layout not found for panel index ${c}` ), R(x, y)) { const S = v - x; Y(S, Math.abs(e)) > 0 && (e = e < 0 ? 0 - S : S); } } } { const c = e < 0 ? u : f, d = n[c]; z( d, `No panel constraints found for index ${c}` ); const { collapsedSize: y = 0, collapsible: g, minSize: v = 0 } = d; if (g) { const x = l[c]; if (z( x != null, `Previous layout not found for panel index ${c}` ), R(x, v)) { const S = x - y; Y(S, Math.abs(e)) > 0 && (e = e < 0 ? 0 - S : S); } } } } { const c = e < 0 ? 1 : -1; let d = e < 0 ? f : u, y = 0; for (; ; ) { const v = l[d]; z( v != null, `Previous layout not found for panel index ${d}` ); const S = H({ panelConstraints: n[d], size: 100 }) - v; if (y += S, d += c, d < 0 || d >= n.length) break; } const g = Math.min(Math.abs(e), Math.abs(y)); e = e < 0 ? 0 - g : g; } { let d = e < 0 ? u : f; for (; d >= 0 && d < n.length; ) { const y = Math.abs(e) - Math.abs(p), g = l[d]; z( g != null, `Previous layout not found for panel index ${d}` ); const v = g - y, x = H({ panelConstraints: n[d], size: v }); if (!R(g, x) && (p += g - x, a[d] = x, p.toFixed(3).localeCompare(Math.abs(e).toFixed(3), void 0, { numeric: !0 }) >= 0)) break; e < 0 ? d-- : d++; } } if (at(r, a)) return i; { const c = e < 0 ? f : u, d = l[c]; z( d != null, `Previous layout not found for panel index ${c}` ); const y = d + p, g = H({ panelConstraints: n[c], size: y }); if (a[c] = g, !R(g, y)) { let v = y - g, S = e < 0 ? f : u; for (; S >= 0 && S < n.length; ) { const b = a[S]; z( b != null, `Previous layout not found for panel index ${S}` ); const w = b + v, C = H({ panelConstraints: n[S], size: w }); if (R(b, C) || (v -= C - b, a[S] = C), R(v, 0)) break; e > 0 ? S-- : S++; } } } const m = Object.values(a).reduce( (c, d) => d + c, 0 ); if (!R(m, 100, 0.1)) return i; const h = Object.keys(i); return a.reduce((c, d, y) => (c[h[y]] = d, c), {}); } function te(e) { const t = e.parentElement; z(t, "Parent group element not found"); const { mountedGroups: n } = D(); for (const [o] of n) if (o.element === t) return o; throw Error("Could not find parent Group for separator element"); } function W(e, t) { if (Object.keys(e).length !== Object.keys(t).length) return !1; for (const n in e) if (t[n] === void 0 || Y(e[n], t[n]) !== 0) return !1; return !0; } function _({ layout: e, panelConstraints: t }) { const o = [...Object.values(e)], i = o.reduce( (r, a) => r + a, 0 ); if (o.length !== t.length) throw Error( `Invalid ${t.length} panel layout: ${o.map((r) => `${r}%`).join(", ")}` ); if (!R(i, 100) && o.length > 0) for (let r = 0; r < t.length; r++) { const a = o[r]; z(a != null, `No layout data found for index ${r}`); const u = 100 / i * a; o[r] = u; } let s = 0; for (let r = 0; r < t.length; r++) { const a = o[r]; z(a != null, `No layout data found for index ${r}`); const u = H({ panelConstraints: t[r], size: a }); a != u && (s += a - u, o[r] = u); } if (!R(s, 0)) for (let r = 0; r < t.length; r++) { const a = o[r]; z(a != null, `No layout data found for index ${r}`); const u = a + s, f = H({ panelConstraints: t[r], size: u }); if (a !== f && (s -= f - a, o[r] = f, R(s, 0))) break; } const l = Object.keys(e); return o.reduce((r, a, u) => (r[l[u]] = a, r), {}); } function ke({ groupId: e }) { const t = () => { const { mountedGroups: n } = D(); for (const [o, i] of n) if (o.id === e) return { group: o, ...i }; throw Error(`Could not find Group with id "${e}"`); }; return { getLayout() { const { defaultLayoutDeferred: n, layout: o } = t(); return n ? {} : o; }, setLayout(n) { const { defaultLayoutDeferred: o, derivedPanelConstraints: i, group: s, layout: l, separatorToPanels: r } = t(), a = _({ layout: n, panelConstraints: i }); return o ? l : (W(l, a) || I((u) => ({ mountedGroups: new Map(u.mountedGroups).set(s, { defaultLayoutDeferred: o, derivedPanelConstraints: i, layout: a, separatorToPanels: r }) })), a); } }; } function Ge(e) { const { mountedGroups: t } = D(), n = t.get(e); return z(n, `Mounted Group ${e.id} not found`), n; } function O(e, t) { const n = te(e), o = Ge(n), i = n.separators.find( (p) => p.element === e ); z(i, "Matching separator not found"); const s = o.separatorToPanels.get(i); z(s, "Matching panels not found"); const l = s.map((p) => n.panels.indexOf(p)), a = ke({ groupId: n.id }).getLayout(), u = Z({ delta: t, initialLayout: a, panelConstraints: o.derivedPanelConstraints, pivotIndices: l, prevLayout: a, trigger: "keyboard" }), f = _({ layout: u, panelConstraints: o.derivedPanelConstraints }); W(a, f) || I((p) => ({ mountedGroups: new Map(p.mountedGroups).set(n, { defaultLayoutDeferred: o.defaultLayoutDeferred, derivedPanelConstraints: o.derivedPanelConstraints, layout: f, separatorToPanels: o.separatorToPanels }) })); } function me(e) { if (e.defaultPrevented) return; const t = e.currentTarget, n = te(t); if (!n.disabled) switch (e.key) { case "ArrowDown": { e.preventDefault(), n.orientation === "vertical" && O(t, 5); break; } case "ArrowLeft": { e.preventDefault(), n.orientation === "horizontal" && O(t, -5); break; } case "ArrowRight": { e.preventDefault(), n.orientation === "horizontal" && O(t, 5); break; } case "ArrowUp": { e.preventDefault(), n.orientation === "vertical" && O(t, -5); break; } case "End": { e.preventDefault(), O(t, 100); break; } case "Enter": { e.preventDefault(); const o = te(t), { derivedPanelConstraints: i, layout: s, separatorToPanels: l } = Ge(o), r = o.separators.find( (p) => p.element === t ); z(r, "Matching separator not found"); const a = l.get(r); z(a, "Matching panels not found"); const u = a[0], f = i.find( (p) => p.panelId === u.id ); if (z(f, "Panel metadata not found"), f.collapsible) { const p = s[u.id], m = f.collapsedSize === p ? o.inMemoryLastExpandedPanelSizes[u.id] ?? f.minSize : f.collapsedSize; O(t, m - p); } break; } case "F6": { e.preventDefault(); const i = te(t).separators.map( (a) => a.element ), s = Array.from(i).findIndex( (a) => a === e.currentTarget ); z(s !== null, "Index not found"); const l = e.shiftKey ? s > 0 ? s - 1 : i.length - 1 : s + 1 < i.length ? s + 1 : 0; i[l].focus(); break; } case "Home": { e.preventDefault(), O(t, -100); break; } } } const lt = (e) => e, ne = () => { }, De = 1, Oe = 2, Te = 4, Ne = 8, he = { coarse: 10, precise: 5 }; function ut(e, t, n) { let o, i = { x: 1 / 0, y: 1 / 0 }; for (const s of t) { const l = Ee(n, s.rect); switch (e) { case "horizontal": { l.x <= i.x && (o = s, i = l); break; } case "vertical": { l.y <= i.y && (o = s, i = l); break; } } } return o ? { distance: i, hitRegion: o } : void 0; } let ee; function ct() { return ee === void 0 && (typeof matchMedia == "function" ? ee = !!matchMedia("(pointer:coarse)").matches : ee = !1), ee; } function ft(e) { return e !== null && typeof e == "object" && "nodeType" in e && e.nodeType === Node.DOCUMENT_FRAGMENT_NODE; } function dt(e, t) { if (e === t) throw new Error("Cannot compare node with itself"); const n = { a: Se(e), b: Se(t) }; let o; for (; n.a.at(-1) === n.b.at(-1); ) e = n.a.pop(), t = n.b.pop(), o = e; z( o, "Stacking order can only be calculated for elements with a common ancestor" ); const i = { a: ge(ye(n.a)), b: ge(ye(n.b)) }; if (i.a === i.b) { const s = o.childNodes, l = { a: n.a.at(-1), b: n.b.at(-1) }; let r = s.length; for (; r--; ) { const a = s[r]; if (a === l.a) return 1; if (a === l.b) return -1; } } return Math.sign(i.a - i.b); } const pt = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMode|filter|webkitFilter|isolation)\b/; function mt(e) { const t = getComputedStyle(_e(e) ?? e).display; return t === "flex" || t === "inline-flex"; } function ht(e) { const t = getComputedStyle(e); return !!(t.position === "fixed" || t.zIndex !== "auto" && (t.position !== "static" || mt(e)) || +t.opacity < 1 || "transform" in t && t.transform !== "none" || "webkitTransform" in t && t.webkitTransform !== "none" || "mixBlendMode" in t && t.mixBlendMode !== "normal" || "filter" in t && t.filter !== "none" || "webkitFilter" in t && t.webkitFilter !== "none" || "isolation" in t && t.isolation === "isolate" || pt.test(t.willChange) || t.webkitOverflowScrolling === "touch"); } function ye(e) { let t = e.length; for (; t--; ) { const n = e[t]; if (z(n, "Missing node"), ht(n)) return n; } return null; } function ge(e) { return e && Number(getComputedStyle(e).zIndex) || 0; } function Se(e) { const t = []; for (; e; ) t.push(e), e = _e(e); return t; } function _e(e) { const { parentNode: t } = e; return ft(t) ? t.host : t; } function yt(e, t) { return e.x < t.x + t.width && e.x + e.width > t.x && e.y < t.y + t.height && e.y + e.height > t.y; } function gt({ groupElement: e, hitRegion: t, pointerEventTarget: n }) { if (!Me(n) || n.contains(e) || e.contains(n)) return !0; if (dt(n, e) > 0) { let o = n; for (; o; ) { if (o.contains(e)) return !0; if (yt(o.getBoundingClientRect(), t)) return !1; o = o.parentElement; } } return !0; } function Ae(e, t) { const n = []; return t.forEach((o, i) => { if (i.disabled) return; const s = ct() ? he.coarse : he.precise, l = Ie(i), r = ut(i.orientation, l, { x: e.clientX, y: e.clientY }); r && r.distance.x <= s && r.distance.y <= s && gt({ groupElement: i.element, hitRegion: r.hitRegion.rect, pointerEventTarget: e.target }) && n.push(r.hitRegion); }), n; } function ve(e) { if (e.defaultPrevented) return; const { mountedGroups: t } = D(), n = Ae(e, t), o = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Map(); let r = !1; n.forEach((a) => { o.add(a.group), a.panels.forEach((f) => { i.add(f); }), a.separator && (s.add(a.separator), r || (r = !0, a.separator.element.focus())); const u = t.get(a.group); u && l.set(a.group, u.layout); }), I({ interactionState: { hitRegions: n, initialLayoutMap: l, pointerDownAtPoint: { x: e.clientX, y: e.clientY }, state: "active" } }), n.length && e.preventDefault(); } function St({ cursorFlags: e, groups: t, state: n }) { let o = 0, i = 0; switch (n) { case "active": case "hover": t.forEach((s) => { if (!s.disableCursor) switch (s.orientation) { case "horizontal": { o++; break; } case "vertical": { i++; break; } } }); } if (o === 0 && i === 0) return null; switch (n) { case "active": { const s = (e & De) !== 0, l = (e & Oe) !== 0, r = (e & Te) !== 0, a = (e & Ne) !== 0; if (e) { if (s) return r ? "se-resize" : a ? "ne-resize" : "e-resize"; if (l) return r ? "sw-resize" : a ? "nw-resize" : "w-resize"; if (r) return "s-resize"; if (a) return "n-resize"; } break; } } return o > 0 && i > 0 ? "move" : o > 0 ? "ew-resize" : "ns-resize"; } const xe = /* @__PURE__ */ new WeakMap(); function se(e) { if (e.defaultView === null || e.defaultView === void 0) return; let { prevStyle: t, styleSheet: n } = xe.get(e) ?? {}; n === void 0 && (n = new e.defaultView.CSSStyleSheet(), e.adoptedStyleSheets = [n]); const { cursorFlags: o, interactionState: i } = D(); switch (i.state) { case "active": case "hover": { const s = St({ cursorFlags: o, groups: i.hitRegions.map((r) => r.group), state: i.state }), l = `*{cursor: ${s} !important; ${i.state === "active" ? "touch-action: none;" : ""} }`; if (t === l) return; t = l, s ? n.cssRules.length === 0 ? n.insertRule(l) : n.replaceSync(l) : n.cssRules.length === 1 && n.deleteRule(0); break; } case "inactive": { t = void 0, n.cssRules.length === 1 && n.deleteRule(0); break; } } xe.set(e, { prevStyle: t, styleSheet: n }); } function $e({ document: e, event: t, hitRegions: n, initialLayoutMap: o, mountedGroups: i, pointerDownAtPoint: s }) { let l = 0; const r = new Map(i); n.forEach((a) => { const { group: u, groupSize: f } = a, { disableCursor: p, orientation: m, panels: h } = u; let c = 0; s ? m === "horizontal" ? c = (t.clientX - s.x) / f * 100 : c = (t.clientY - s.y) / f * 100 : m === "horizontal" ? c = t.clientX < 0 ? -100 : 100 : c = t.clientY < 0 ? -100 : 100; const d = o.get(u), { defaultLayoutDeferred: y, derivedPanelConstraints: g, layout: v, separatorToPanels: x } = i.get(u) ?? { defaultLayoutDeferred: !1 }; if (g && d && v && x) { const S = Z({ delta: c, initialLayout: d, panelConstraints: g, pivotIndices: a.panels.map((b) => h.indexOf(b)), prevLayout: v, trigger: "mouse-or-touch" }); if (W(S, v)) { if (c !== 0 && !p) switch (m) { case "horizontal": { l |= c < 0 ? De : Oe; break; } case "vertical": { l |= c < 0 ? Te : Ne; break; } } } else { r.set(a.group, { defaultLayoutDeferred: y, derivedPanelConstraints: g, layout: S, separatorToPanels: x }); const b = a.group.panels.map(({ id: w }) => w).join(","); a.group.inMemoryLayouts[b] = S; } } }), I({ cursorFlags: l, mountedGroups: r }), se(e); } function ze(e) { const { interactionState: t, mountedGroups: n } = D(); switch (t.state) { case "active": $e({ document: e.currentTarget, event: e, hitRegions: t.hitRegions, initialLayoutMap: t.initialLayoutMap, mountedGroups: n }); } } function be(e) { if (e.defaultPrevented) return; const { interactionState: t, mountedGroups: n } = D(); switch (t.state) { case "active": { if ( // Skip this check for "pointerleave" events, else Firefox triggers a false positive (see #514) e.buttons === 0 ) { I( (o) => o.interactionState.state === "inactive" ? o : { cursorFlags: 0, interactionState: { state: "inactive" } } ); return; } $e({ document: e.currentTarget, event: e, hitRegions: t.hitRegions, initialLayoutMap: t.initialLayoutMap, mountedGroups: n, pointerDownAtPoint: t.pointerDownAtPoint }); break; } default: { const o = Ae(e, n); o.length === 0 ? t.state !== "inactive" && I({ interactionState: { state: "inactive" } }) : I({ interactionState: { hitRegions: o, state: "hover" } }), se(e.currentTarget); break; } } } function we(e) { if (e.defaultPrevented) return; e.preventDefault(); const { interactionState: t } = D(); switch (t.state) { case "active": I({ cursorFlags: 0, interactionState: { state: "inactive" } }), se(e.currentTarget); } } function Le(e) { let t = 0, n = 0; const o = {}; for (const s of e) if (s.defaultSize !== void 0) { t++; const l = G(s.defaultSize); n += l, o[s.panelId] = l; } else o[s.panelId] = void 0; const i = e.length - t; if (i !== 0) { const s = G((100 - n) / i); for (const l of e) l.defaultSize === void 0 && (o[l.panelId] = s); } return o; } function vt(e, t, n) { const o = n[0]; if (!o) return; const i = e.panels.find((a) => a.element === t); if (!i || !i.onResize) return; const s = B({ group: e }), l = i.mutableValues.prevSize, r = { asPercentage: G( o.inlineSize / s * 100 ), inPixels: o.inlineSize }; i.mutableValues.prevSize = r, i.onResize(r, i.id, l); } function xt(e, t) { if (Object.keys(e).length !== Object.keys(t).length) return !1; for (const o in e) if (e[o] !== t[o]) return !1; return !0; } function zt(e, t) { const n = e.map((i) => i.id), o = Object.keys(t); if (n.length !== o.length) return !1; for (const i of n) if (!o.includes(i)) return !1; return !0; } const j = /* @__PURE__ */ new Map(); function bt(e) { let t = !0; z( e.element.ownerDocument.defaultView, "Cannot register an unmounted Group" ); const n = e.element.ownerDocument.defaultView.ResizeObserver, o = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), s = new n((c) => { for (const d of c) { const { borderBoxSize: y, target: g } = d; if (g === e.element) { if (t) { if (B({ group: e }) === 0) return; I((x) => { const S = x.mountedGroups.get(e); if (S) { const b = pe(e), w = S.defaultLayoutDeferred ? Le(b) : S.layout, C = _({ layout: w, panelConstraints: b }); return !S.defaultLayoutDeferred && W(w, C) && xt( S.derivedPanelConstraints, b ) ? x : { mountedGroups: new Map(x.mountedGroups).set(e, { defaultLayoutDeferred: !1, derivedPanelConstraints: b, layout: C, separatorToPanels: S.separatorToPanels }) }; } return x; }); } } else vt(e, g, y); } }); s.observe(e.element), e.panels.forEach((c) => { z( !o.has(c.id), `Panel ids must be unique; id "${c.id}" was used more than once` ), o.add(c.id), c.onResize && s.observe(c.element); }); const l = B({ group: e }), r = pe(e), a = e.panels.map(({ id: c }) => c).join(","); let u = e.defaultLayout; u && (zt(e.panels, u) || (u = void 0)); const f = e.inMemoryLayouts[a] ?? u ?? Le(r), p = _({ layout: f, panelConstraints: r }), m = Ie(e), h = e.element.ownerDocument; return I((c) => { const d = /* @__PURE__ */ new Map(); return j.set( h, (j.get(h) ?? 0) + 1 ), m.forEach((y) => { y.separator && d.set(y.separator, y.panels); }), { mountedGroups: new Map(c.mountedGroups).set(e, { defaultLayoutDeferred: l === 0, derivedPanelConstraints: r, layout: p, separatorToPanels: d }) }; }), e.separators.forEach((c) => { z( !i.has(c.id), `Separator ids must be unique; id "${c.id}" was used more than once` ), i.add(c.id), c.element.addEventListener("keydown", me); }), j.get(h) === 1 && (h.addEventListener("pointerdown", ve), h.addEventListener("pointerleave", ze), h.addEventListener("pointermove", be), h.addEventListener("pointerup", we)), function() { t = !1, j.set( h, Math.max(0, (j.get(h) ?? 0) - 1) ), I((d) => { const y = new Map(d.mountedGroups); return y.delete(e), { mountedGroups: y }; }), e.separators.forEach((d) => { d.element.removeEventListener("keydown", me); }), j.get(h) || (h.removeEventListener("pointerdown", ve), h.removeEventListener("pointerleave", ze), h.removeEventListener("pointermove", be), h.removeEventListener("pointerup", we)), s.disconnect(); }; } function wt() { const [e, t] = N({}), n = Pe(() => t({}), []); return [e, n]; } function ae(e) { const t = Ke(); return `${e ?? t}`; } const A = typeof window < "u" ? Xe : Re; function le(e) { const t = E(e); return A(() => { t.current = e; }, [e]), Pe( (...n) => t.current?.(...n), [t] ); } function ue(...e) { return le((t) => { e.forEach((n) => { if (n) switch (typeof n) { case "function": { n(t); break; } case "object": { n.current = t; break; } } }); }); } function Lt(e) { const t = E({ ...e }); return A(() => { for (const n in e) t.current[n] = e[n]; }, [e]), t.current; } const Fe = "--react-resizable-panels--panel--pointer-events"; function Ve(e, t) { const n = e.replace(/[^a-zA-Z0-9\-_]/g, ""), o = t.replace(/[^a-zA-Z0-9\-_]/g, ""); return `--react-resizable-panels--${n}--${o}`; } const je = qe(null); function Pt(e, t) { const n = E({ getLayout: () => ({}), setLayout: lt }); Ce(t, () => n.current, []), A(() => { Object.assign( n.current, ke({ groupId: e }) ); }); } function Rt({ children: e, className: t, defaultLayout: n, disableCursor: o, disabled: i, elementRef: s, groupRef: l, id: r, onLayoutChange: a, orientation: u = "horizontal", style: f, ...p }) { const m = E({}), h = le((L) => { W(m.current, L) || (m.current = L, a?.(L)); }), c = ae(r), d = E(null), [y, g] = N(!1), [v, x] = N(n ?? {}), [S, b] = wt(), w = E({ lastExpandedPanelSizes: {}, layouts: {}, panels: [], separators: [] }), C = ue(d, s); Pt(c, l); const U = re( () => ({ id: c, orientation: u, registerPanel: (L) => { const P = w.current; return P.panels = ie(u, [ ...P.panels, L ]), b(), () => { P.panels = P.panels.filter( (k) => k !== L ), b(); }; }, registerSeparator: (L) => { const P = w.current; return P.separators = ie(u, [ ...P.separators, L ]), b(), () => { P.separators = P.separators.filter( (k) => k !== L ), b(); }; } }), [c, b, u] ), K = Lt({ defaultLayout: n, disableCursor: o }), $ = E(null); A(() => { const L = d.current; if (L === null) return; const P = w.current, k = { defaultLayout: K.defaultLayout, disableCursor: !!K.disableCursor, disabled: !!i, element: L, id: c, inMemoryLastExpandedPanelSizes: w.current.lastExpandedPanelSizes, inMemoryLayouts: w.current.layouts, orientation: u, panels: P.panels, separators: P.separators }; $.current = k; const He = bt(k), fe = D().mountedGroups.get(k); if (fe) { const { defaultLayoutDeferred: F, derivedPanelConstraints: V, layout: J } = fe; !F && V.length > 0 && (x(J), h?.(J)); } const Be = T.addListener( "interactionStateChange", (F) => { switch (F.state) { case "active": { g( F.hitRegions.some( (V) => V.group === k ) ); break; } default: { g(!1); break; } } } ), We = T.addListener( "mountedGroupsChange", (F) => { const V = F.get(k); if (V) { const { defaultLayoutDeferred: J, derivedPanelConstraints: Ue, layout: de } = V; if (J || Ue.length === 0) return; x(de), h?.(de); } } ); return () => { $.current = null, He(), Be(), We(); }; }, [ i, c, h, u, S, K ]), Re(() => { const L = $.current; L && (L.defaultLayout = n, L.disableCursor = !!o); }); const X = { [Fe]: y ? "none" : void 0 }; for (const L in v) { const P = Ve(c, L), k = v[L]; X[P] = k; } return /* @__PURE__ */ q(je.Provider, { value: U, children: /* @__PURE__ */ q( "div", { ...p, "aria-orientation": u, className: t, "data-group": !0, "data-testid": c, id: c, ref: C, style: { ...f, ...X, display: "flex", flexDirection: u === "horizontal" ? "row" : "column", flexWrap: "nowrap" }, children: e } ) }); } Rt.displayName = "Group"; function Ct(e, t = 10) { let n = null; return (o) => { n !== null && clearTimeout(n), n = setTimeout(() => { e(o); }, t); }; } function oe(e, t) { return `react-resizable-panels:${[e, ...t].join(":")}`; } function At({ debounceSaveMs: e = 100, panelIds: t, storage: n = localStorage, ...o }) { const i = t !== void 0, s = "id" in o ? o.id : o.groupId, l = oe(s, t ?? []), r = Ye( Mt, () => n.getItem(l), () => n.getItem(l) ), a = re( () => r ? JSON.parse(r) : void 0, [r] ), u = re(() => { const f = (p) => { let m; i ? m = oe(s, Object.keys(p)) : m = oe(s, []); try { n.setItem(m, JSON.stringify(p)); } catch (h) { console.error(h); } }; return e > 0 ? Ct(f, e) : f; }, [e, i, s, n]); return { defaultLayout: a, onLayoutChange: u }; } function Mt() { return function() { }; } function $t() { return N(null); } function Ft() { return E(null); } function ce() { const e = Ze(je); return z( e, "Group Context not found; did you render a Panel or Separator outside of a Group?" ), e; } function Et({ groupId: e, panelId: t }) { const n = () => { const { mountedGroups: r } = D(); for (const [ a, { defaultLayoutDeferred: u, derivedPanelConstraints: f, layout: p, separatorToPanels: m } ] of r) if (a.id === e) return { defaultLayoutDeferred: u, derivedPanelConstraints: f, group: a, layout: p, separatorToPanels: m }; throw Error(`Group ${e} not found`); }, o = () => { const r = n().derivedPanelConstraints.find( (a) => a.panelId === t ); if (r !== void 0) return r; throw Error(`Panel constraints not found for Panel ${t}`); }, i = () => { const r = n().group.panels.find((a) => a.id === t); if (r !== void 0) return r; throw Error(`Layout not found for Panel ${t}`); }, s = () => { const r = n().layout[t]; if (r !== void 0) return r; throw Error(`Layout not found for Panel ${t}`); }, l = (r) => { const a = s(); if (r === a) return; const { defaultLayoutDeferred: u, derivedPanelConstraints: f, group: p, layout: m, separatorToPanels: h } = n(), c = p.panels.findIndex((v) => v.id === t), d = c === p.panels.length - 1, y = Z({ delta: d ? a - r : r - a, initialLayout: m, panelConstraints: f, pivotIndices: d ? [c - 1, c] : [c, c + 1], prevLayout: m, trigger: "imperative-api" }), g = _({ layout: y, panelConstraints: f }); W(m, g) || I((v) => ({ mountedGroups: new Map(v.mountedGroups).set(p, { defaultLayoutDeferred: u, derivedPanelConstraints: f, layout: g, separatorToPanels: h }) })); }; return { collapse: () => { const { collapsible: r, collapsedSize: a } = o(), { mutableValues: u } = i(), f = s(); r && f !== a && (u.expandToSize = f, l(a)); }, expand: () => { const { collapsible: r, collapsedSize: a, minSize: u } = o(), { mutableValues: f } = i(), p = s(); if (r && p === a) { let m = f.expandToSize ?? u; m === 0 && (m = 1), l(m); } }, getSize: () => { const { group: r } = n(), a = s(), { element: u } = i(), f = r.orientation === "horizontal" ? u.offsetWidth : u.offsetHeight; return { asPercentage: a, inPixels: f }; }, isCollapsed: () => { const { collapsible: r, collapsedSize: a } = o(), u = s(); return r && R(a, u); }, resize: (r) => { if (s() !== r) { let u; switch (typeof r) { case "number": { const { group: f } = n(), p = B({ group: f }); u = G(r / p * 100); break; } case "string": { u = parseFloat(r); break; } } l(u); } } }; } function It(e, t) { const { id: n } = ce(), o = E({ collapse: ne, expand: ne, getSize: () => ({ asPercentage: 0, inPixels: 0 }), isCollapsed: () => !1, resize: ne }); Ce(t, () => o.current, []), A(() => { Object.assign( o.current, Et({ groupId: n, panelId: e }) ); }); } function kt({ children: e, className: t, collapsedSize: n = "0%", collapsible: o = !1, defaultSize: i, elementRef: s, id: l, maxSize: r = "100%", minSize: a = "0%", onResize: u, panelRef: f, style: p, ...m }) { const h = !!l, c = ae(l), d = E(null), y = ue(d, s), { id: g, registerPanel: v } = ce(), x = u !== null, S = le( (w, C, U) => { u?.(w, l, U); } ); A(() => { const w = d.current; if (w !== null) return v({ element: w, id: c, idIsStable: h, mutableValues: { expandToSize: void 0, prevSize: void 0 }, onResize: x ? S : void 0, panelConstraints: { collapsedSize: n, collapsible: o, defaultSize: i, maxSize: r, minSize: a } }); }, [ n, o, i, x, c, h, r, a, S, v ]), It(c, f); const b = Ve(g, c); return /* @__PURE__ */ q( "div", { ...m, "data-panel": !0, "data-testid": c, id: c, ref: y, style: { ...Gt, flexBasis: 0, flexGrow: `var(${b}, 1)`, flexShrink: 1, // Prevent Panel content from interfering with panel size overflow: "hidden", // Disable pointer events inside of a panel during resize // This avoid edge cases like nested iframes pointerEvents: `var(${Fe})` }, children: /* @__PURE__ */ q( "div", { className: t, style: { width: "100%", height: "100%", ...p }, children: e } ) } ); } kt.displayName = "Panel"; const Gt = { minHeight: "unset", maxHeight: "unset", height: "unset", minWidth: "unset", maxWidth: "unset", width: "unset", flex: "unset", flexBasis: "unset", flexShrink: "unset", flexGrow: "unset", border: "unset", borderWidth: "unset", padding: "unset", margin: "unset" }; function Vt() { return N(null); } function jt() { return E(null); } function Dt({ layout: e, panelConstraints: t, panelId: n, panelIndex: o }) { let i, s; const l = e[n], r = t.find( (a) => a.panelId === n ); if (r) { const a = r.maxSize, u = s = r.collapsible ? r.collapsedSize : r.minSize, f = [o, o + 1]; s = _({ layout: Z({ delta: u - l, initialLayout: e, panelConstraints: t, pivotIndices: f, prevLayout: e, trigger: "keyboard" }), panelConstraints: t })[n], i = _({ layout: Z({ delta: a - l, initialLayout: e, panelConstraints: t, pivotIndices: f, prevLayout: e, trigger: "keyboard" }), panelConstraints: t })[n]; } return { valueControls: n, valueMax: i, valueMin: s, valueNow: l }; } function Ot({ children: e, className: t, elementRef: n, id: o, style: i, ...s }) { const l = ae(o), [r, a] = N({}), [u, f] = N("inactive"), p = E(null), m = ue(p, n), { id: h, orientation: c, registerSeparator: d } = ce(), y = c === "horizontal" ? "vertical" : "horizontal"; return A(() => { const g = p.current; if (g !== null) { const v = { element: g, id: l }, x = d(v), S = T.addListener( "interactionStateChange", (w) => { f( w.state !== "inactive" && w.hitRegions.some( (C) => C.separator === v ) ? w.state : "inactive" ); } ), b = T.addListener( "mountedGroupsChange", (w) => { w.forEach( ({ derivedPanelConstraints: C, layout: U, separatorToPanels: K }, $) => { if ($.id === h) { const X = K.get(v); if (X) { const L = X[0], P = $.panels.indexOf(L); a( Dt({ layout: U, panelConstraints: C, panelId: L.id, panelIndex: P }) ); } } } ); } ); return () => { S(), b(), x(); }; } }, [h, l, d]), /* @__PURE__ */ q( "div", { ...s, "aria-controls": r.valueControls, "aria-orientation": y, "aria-valuemax": r.valueMax, "aria-valuemin": r.valueMin, "aria-valuenow": r.valueNow, children: e, className: t, "data-separator": u, "data-testid": l, id: l, ref: m, role: "separator", style: { flexBasis: "auto", ...i, flexGrow: 0, flexShrink: 0 }, tabIndex: 0 } ); } Ot.displayName = "Separator"; export { Rt as Group, kt as Panel, Ot as Separator, At as useDefaultLayout, $t as useGroupCallbackRef, Ft as useGroupRef, Vt as usePanelCallbackRef, jt as usePanelRef }; //# sourceMappingURL=react-resizable-panels.js.map