@aiquants/resize-panels 2.0.1 → 2.2.0

package/README.md

@@ -11,7 +11,9 @@ Every state change — first paint, container resize, drag, collapse, restored l
 - **Predictable proportions**: a flexible panel's size is a weight — only the ratio between weights matters, unless the panel declares `flexAdjustPriority`, which reads the same number as a claim on that share of the container. A dragged layout becomes a fixed point of the allocator, so it survives the next resize as a ratio instead of snapping back.
 - **Directional Collapsible Control**: declarative `collapsible` settings (`from: 'start' | 'end' | 'both'`) and the `usePanelControls` hook support collapsing/expanding from drags and from UI controls; expanding restores the layout the panel had before it closed.
 - **Keyboard & Touch Accessibility**: handles are `role="separator"` widgets whose `aria-valuenow` / `aria-valuemin` / `aria-valuemax` publish the boundary and the travel *this* handle can reach, collapsing included; a collapsed neighbour is reported as length 0 rather than making the values disappear. Arrow keys resize (5x step with Shift), reopen a collapsed neighbour from the side it closed towards and collapse a panel the pair's travel cannot shrink further, while a handle with nowhere to go leaves the key to the page. A drag needs the primary button and survives multi-touch and `pointercancel`.
+- **A click instead of a drag**: give a handle `activationSizes` and a click or tap moves the boundary through those preset sizes — the single-pointer alternative to dragging that WCAG 2.5.7 asks for (see [Clicking instead of dragging](#clicking-instead-of-dragging)).
 - **Auto-Persistence**: set `autoSaveId` to store each panel's open length and collapsed flag in `localStorage` next to its panel id, so a layout saved by a different set of panels is rejected instead of being applied by position.
+- **Layout notifications with a cause**: `onLayout` receives the allocated lengths together with why they changed — a drag, a key, a host call, a container resize, a panel change or a restored layout — so a host can keep what the reader chose apart from what the container forced.
 - **Debug & Visualization**: enable `showDebugInfo` to inspect allocations through the per-panel `PanelDebugInfo` badge and a global overlay (lazily imported; production bundles without it create no per-panel observers at all). A constraint violation needs no flag: the group draws its own placeholder over the panels whenever the allocator reports one.
 
 ## Installation
@@ -127,7 +129,7 @@ export const Example = () => (
 | `className` / `style` | `string` / `React.CSSProperties` | Additional styling for the container |
 | `children` | `React.ReactNode` | `Panel` and `PanelResizeHandle` child elements |
 | `showDebugInfo` | `boolean` | Enables the per-panel `PanelDebugInfo` badge and the global debug overlay |
-| `onLayout` | `(sizes: number[]) => void` | Callback emitting updated pixel size arrays on resize/init |
+| `onLayout` | `(sizes: number[], change: PanelLayoutChange) => void` | Called with the panels' allocated pixel lengths (DOM order) each time they change once the container is measured; `change.source` says why (see [Layout Notifications](#layout-notifications)) |
 | `autoSaveId` | `string` | Key used to automatically persist and restore panel sizes in `localStorage` |
 
 ### Panel Properties
@@ -160,7 +162,8 @@ enforces the contract is the runtime override, which applies these attributes af
 | Property | Type | Description |
 | --- | --- | --- |
 | `id` | `string` | Handle identifier (reflected in `data-resize-handle-id`) |
-| `disabled` | `boolean` | Disables mouse dragging and keyboard resizing when `true` |
+| `disabled` | `boolean` | Disables dragging, clicking and keyboard resizing when `true` |
+| `activationSizes` | `readonly FlexibleSize[]` | Lengths of the panel before the handle that a click or tap moves the boundary through, in the units of a panel's `defaultSize` / `minSize` / `maxSize` (see [Clicking instead of dragging](#clicking-instead-of-dragging)); without it a click does nothing |
 | `thickness` | `number` | Primary axis thickness of the handle's interactive area in pixels (`8px` default) |
 | `indicator` | `boolean \| PanelResizeHandleIndicatorConfig` | Toggle indicator visibility or provide custom pill/bar dimensions and CSS classes |
 | `indicatorThickness` | `number` | Shorthand for indicator pill wrapper thickness in pixels (`6px` default) |
@@ -168,7 +171,7 @@ enforces the contract is the runtime override, which applies these attributes af
 | `indicatorBarThickness` | `number` | Shorthand for indicator inner bar thickness in pixels (`2px` default) |
 | `indicatorBarLength` | `number` | Shorthand for indicator inner bar length in pixels (`32px` horizontal / `64px` vertical default) |
 | `title` | `string` | Custom tooltip text for the handle element |
-| `onDragging` | `(isDragging: boolean) => void` | Callback triggered on drag start and end (including `pointercancel`) |
+| `onDragging` | `(isDragging: boolean) => void` | Callback triggered when the primary button presses the handle and when the press ends (including `pointercancel`) — a drag, or a click on a handle with `activationSizes`; `false` comes only after every `'pointer'` change of the press has been reported to `onLayout` |
 | `className` / `style` | `string` / `React.CSSProperties` | Additional styling for the resize handle |
 | `children` | `React.ReactNode` | Custom indicator element rendered inside handle (overrides default indicator) |
 
@@ -190,11 +193,66 @@ from the same numbers and may redefine them; the declarations that keep the hit
 box) are applied *after* it and take no override. While the group reports a constraint violation, every handle is
 hidden (`display: none` on its anchor) as well as disabled.
 
+### Clicking instead of dragging
+
+WCAG 2.2 Success Criterion 2.5.7 (Dragging Movements, level AA) asks that anything done by dragging can also be done
+with a single pointer and no drag; the arrow keys do not cover it, because a reader with a pointer may have no
+keyboard. `activationSizes` is that alternative for a handle, in the form of technique G219: a click or a tap moves the
+boundary through a list of preset lengths of the panel before the handle.
+
+```tsx
+import { type FlexibleSize, Panel, PanelGroup, PanelResizeHandle } from "@aiquants/resize-panels"
+
+// Keep the stops in one module-level constant: a new array on every render defeats the handle's memo.
+const LIST_STOPS: readonly FlexibleSize[] = [
+    { value: 200, unit: "pixels" },
+    { value: 320, unit: "pixels" },
+    { value: 480, unit: "pixels" },
+]
+
+<PanelGroup direction="horizontal">
+    <Panel id="list" defaultSize={{ value: 320, unit: "pixels" }} minSize={{ value: 200, unit: "pixels" }} maxSize={{ value: 480, unit: "pixels" }} />
+    <PanelResizeHandle activationSizes={LIST_STOPS} />
+    <Panel id="detail" />
+</PanelGroup>
+```
+
+- **Stops**: each entry is a length of the panel *before* the handle, written like a panel's `defaultSize` /
+  `minSize` / `maxSize` — `{ value, unit: "pixels" }`, `{ value, unit: "percentage" }`, or a bare number for a
+  percentage of the group's content box, resolved against the container's length at the moment of the click. The
+  order of the array does not matter.
+- **Click or drag**: a press of the primary button (a mouse's main button, a touch or a pen) is a click when the
+  pointer is released before it travels **4 CSS px** from where it went down. The distance is the straight line in
+  viewport coordinates — the coordinates pointer events carry — taken before the drag converts the travel into the
+  group's layout pixels, so neither right-to-left text nor a scaled ancestor changes what counts as a click, and a
+  press that slides along the handle is not one. Until the pointer travels that far the boundary does not move at
+  all, so a click never nudges it; once it does, the press is an ordinary drag that catches up with the pointer, the
+  travel so far included. Only the pointer that pressed counts: other buttons, other pointers, and a press that ends
+  in `pointercancel` or lost pointer capture never click.
+- **Cycling**: a click moves the boundary to the shortest stop longer than the panel's current length; from the
+  longest stop it returns to the shortest.
+- **Clamping**: every stop is first clamped into the range a plain resize of the two panels can reach (both panels'
+  `minSize` / `maxSize` applied to their combined length), so a click never collapses a panel. A stop that lands
+  where the boundary already is gets skipped, and when every stop lands there the click changes nothing.
+- **Collapsed neighbours**: as with the arrow keys, only the handle a panel collapsed towards can reopen it. A click on
+  that handle reopens the panel and moves the boundary to a stop in the same change; with either neighbour collapsed
+  the boundary sits at an end of the pair, so that stop is the shortest. A click on a handle that cannot reopen its
+  collapsed neighbour does nothing.
+- **Notifications**: a click is a press like a drag. `onDragging(true)` comes when the button goes down, the click's
+  one change reaches `onLayout` as `'pointer'`, and `onDragging(false)` comes last, so a host that saves when a drag
+  ends saves a click the same way. `aria-valuenow` follows the boundary as always.
+- **Name**: the built-in `aria-label` and `title` add `click to cycle through preset sizes` when stops are given; an
+  `aria-label` or `title` of your own still replaces them.
+- **No stops**: without `activationSizes` (or with an empty array) a click does nothing, and a drag applies every move
+  as it comes, with no threshold.
+- **Invalid stops**: a value that is not an array, or an entry that is not a non-negative finite size (`NaN`, a
+  negative length, an unknown unit, …), throws a `RangeError` when the handle renders instead of being guessed at.
+
 ## Hooks & Utilities
 
 - `useResizablePanels`: the hook behind `PanelGroup`. It measures the container, keeps the panel order equal to DOM order, notifies `onLayout`, persists the layout and returns the group's base style — it never computes a panel size.
-- `usePanelGroup` / `PanelGroupContext`: context accessor, and the context itself, for the panel list, the container length, the constraint violation and `layoutOrderKey` — the document order of the panels and handle anchors, which changes even when only a handle moved to another boundary.
-- `usePanelControls`: `collapse`, `expand` and `toggle` for a given panel id.
+- `usePanelGroup` / `PanelGroupContext`: context accessor, and the context itself, for the panel list, the container length, the constraint violation and `layoutOrderKey` — the document order of the panels and handle anchors, which changes even when only a handle moved to another boundary. Its `resizePanels`, `collapsePanel` and `expandPanel` take an optional last `source` (`'pointer' | 'keyboard' | 'api'`, `'api'` when left out) that `onLayout` reports for the change, and throw a `RangeError` for any other value.
+- `usePanelControls`: `collapse`, `expand` and `toggle` for a given panel id; `onLayout` reports their changes as `'api'`.
 - `allocatePanelSizes`, `resolvePanelBounds`, `isPixelPanel`: the layout calculation itself, exported for tests and for hosts that drive their own container.
 - `panelReducer`, `initialPanelGroupLayoutState`, `getPanelPreferenceInPixels`, `findLayoutInvariantBreach`: the state machine around the allocator, the length a layout should persist, and the `Σ sizes == container` check.
 - `getContainerSize`: measure one axis of an element in layout pixels; it returns `{ content, border }`, and `content` (padding and borders removed) is the length the allocator fills.
@@ -203,7 +261,7 @@ hidden (`display: none` on its anchor) as well as disabled.
 - `clamp`, `getConstraintInPixels`, `normalizeSizeConfig`, `percentageToPixels`, `toRoundedPercentage`, `calculateSnapThreshold`: the unit conversions and thresholds the components share.
 - `getPanelElement`, `getPanelGroupElement`, `getResizeHandleElement`: DOM element query helpers via `data-*` attributes.
 
-Every public type (`PanelProps`, `PanelGroupProps`, `PanelResizeHandleProps`, `PanelLayoutData`, `PanelRegistration`, `PersistedPanelSize`, `PanelGroupLayoutState`, `PanelAction`, `LayoutAllocation`, `PanelBounds`, `ContainerAxisMeasurement`, …) is re-exported from the package root; `docs/specs` (`00-architecture-overview.md` §8) lists the surface in full.
+Every public type (`PanelProps`, `PanelGroupProps`, `PanelResizeHandleProps`, `PanelLayoutData`, `PanelRegistration`, `PersistedPanelSize`, `PanelGroupLayoutState`, `PanelAction`, `PanelLayoutChange`, `PanelLayoutSource`, `PanelRequestSource`, `LayoutAllocation`, `PanelBounds`, `ContainerAxisMeasurement`, …) is re-exported from the package root; `docs/specs` (`00-architecture-overview.md` §8) lists the surface in full.
 
 ## How sizes are decided
 
@@ -226,6 +284,65 @@ violation when the panels' maximums cannot reach the container, and as a logged
 full statement, including the proofs of ratio preservation, continuity and the drag fixed point, is in `docs/specs`
 (`11-layout-allocator.md`).
 
+## Layout Notifications
+
+`onLayout(sizes, change)` runs after every commit that replaces the panels' sizes once the container has been
+measured, so it never sees the unmeasured zero lengths. `sizes` lists the allocated lengths in pixels in DOM order,
+and `change.source` (`PanelLayoutSource`) says what caused the change:
+
+| `change.source` | Cause |
+| --- | --- |
+| `'pointer'` | A drag on a `PanelResizeHandle`, including a collapse or an expand at either end of it, or a click that moves the handle to one of its `activationSizes` |
+| `'keyboard'` | The arrow keys on a `PanelResizeHandle`, including the collapse and expand they trigger |
+| `'api'` | The host: `usePanelControls`, or `resizePanels` / `collapsePanel` / `expandPanel` from `usePanelGroup()` called without a `source` |
+| `'container'` | The group's content box changed length along its axis, or the group measured it afresh — its first measurement and the one after a `direction` change included, so a group rendered with its panels reports `'container'` first |
+| `'panels'` | A panel mounted, unmounted, changed its props or moved in the DOM |
+| `'restore'` | The layout stored under `autoSaveId` was applied |
+
+When several changes are committed in one render, `source` is the cause of the last of them. React's StrictMode
+does not change the notifications: when a group stops observing its container it drops the measurement, so the
+development-only remount measures again after the panels have registered again, as the first mount did. A pointer
+press and release without movement on a handle without `activationSizes`, a key that pushes a boundary already at the
+end of its range and a resize of the cross axis change nothing and are not reported; a commit can, however, repeat
+the previous sizes (a panel re-registering, a stored layout equal to the current one, a `direction` change), so
+handlers should accept the same sizes twice. A handler that declares only `sizes` keeps working.
+
+A drag reports each pointer move it applies, and commits each one before it handles the next pointer event. Every
+`'pointer'` notification of a drag — the last move held back by the 8 ms throttle included — therefore reaches
+`onLayout` before the handle calls `onDragging(false)`, however the drag ends (release, `pointercancel`, lost pointer
+capture or unmount). A click on a handle with `activationSizes` is a press too: its one change is committed before
+the press ends, so it also arrives between `onDragging(true)` and `onDragging(false)`. Pair `'pointer'` with
+`onDragging(false)` to act once when the press ends; a key press is a complete change of its own and never calls
+`onDragging`.
+
+```tsx
+const saveWidth = (width: number) => localStorage.setItem("tree-width", String(width))
+const draggedWidth = useRef<number | null>(null)
+
+<PanelGroup
+    direction="horizontal"
+    onLayout={(sizes, { source }) => {
+        // A container resize redistributes the same preference, so only the reader's own moves are saved.
+        if (source === "keyboard") {
+            saveWidth(sizes[0])
+        } else if (source === "pointer") {
+            draggedWidth.current = sizes[0]
+        }
+    }}>
+    <Panel id="tree" defaultSize={{ value: 30, unit: "percentage" }} />
+    <PanelResizeHandle
+        onDragging={(isDragging) => {
+            // Every move of the drag has been reported by now, so this is the width the drag ended on.
+            if (!isDragging && draggedWidth.current !== null) {
+                saveWidth(draggedWidth.current)
+                draggedWidth.current = null
+            }
+        }}
+    />
+    <Panel id="content" defaultSize={{ value: 70, unit: "percentage" }} />
+</PanelGroup>
+```
+
 ## Layout Persistence
 
 When `autoSaveId` is provided to `PanelGroup`, the layout is written to `localStorage` under the key

package/dist/{GlobalDebugOverlay-DQtUdNeF.js → GlobalDebugOverlay-BL40__b0.js}

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as t } from "react/jsx-runtime";
 import { useState as A } from "react";
 import { createPortal as P } from "react-dom";
 import { useDebugOverlayOwnerId as R, useDebugOverlaySnapshot as T } from "./debugOverlayStore-D7FT6zPE.js";
-import { P as Y } from "./index-DZ0itiBD.js";
+import { P as Y } from "./index-bJcXe02J.js";
 const s = (a, n) => typeof a != "number" || !Number.isFinite(a) ? "—" : `${(a < 0 ? 0 : a).toFixed(8)}${n}`, w = {
   position: "fixed",
   left: "50%",

package/dist/{GlobalDebugOverlay-Cf3GOn2A.cjs → GlobalDebugOverlay-Dp6IcAX8.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("react"),P=require("react-dom"),x=require("./debugOverlayStore-DY09saU8.cjs"),R=require("./index-DqATP_BA.cjs"),n=(o,i)=>typeof o!="number"||!Number.isFinite(o)?"—":`${(o<0?0:o).toFixed(8)}${i}`,T={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"},Y={display:"flex",justifyContent:"space-between",alignItems:"center",flexWrap:"wrap",gap:"12px"},w={display:"flex",flexDirection:"column",gap:"4px"},D={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"},C={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"},N={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"},p={display:"flex",justifyContent:"space-between",alignItems:"center",gap:"6px"},k={display:"grid",gridTemplateColumns:"auto 1fr",gap:"2px 10px",color:"#e2e8f0"},G={padding:"2px 6px",borderRadius:"9999px",fontSize:"10px",textTransform:"uppercase"},I=({groupId:o})=>x.useDebugOverlayOwnerId()!==o?null:e.jsx(u,{}),u=()=>{const i=x.useDebugOverlaySnapshot().groups,[t,g]=A.useState(!0);if(i.length===0||typeof document>"u")return null;const b=i.reduce((s,a)=>s+a.panels.length,0),h=i.reduce((s,a)=>s+(a.handles?.length??0),0),f=()=>g(s=>!s),m=e.jsxs("div",{style:{...T,padding:t?"10px 18px":"14px 18px",maxHeight:t?"52px":"min(65vh, 520px)",transition:"max-height 0.24s ease, padding 0.24s ease"},children:[e.jsxs("div",{style:{...Y,marginBottom:t?0:"12px"},children:[e.jsxs("div",{style:w,children:[e.jsx("span",{style:{fontWeight:700,fontSize:"12px",letterSpacing:"0.03em"},children:"Panel Overview"}),e.jsxs("span",{style:{color:"#cbd5f5"},children:["groups: ",i.length," / panels: ",b," / resizers: ",h]})]}),e.jsx("button",{type:"button",onClick:f,style:{...D,backgroundColor:t?"rgba(59, 130, 246, 0.2)":"rgba(71, 85, 105, 0.45)"},title:t?"Panel Overview を開く":"Panel Overview を閉じる",children:t?"開く":"閉じる"})]}),!t&&e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"12px",maxHeight:"45vh",overflowY:"auto",paddingRight:"6px"},children:i.map((s,a)=>{const l=s.direction==="horizontal"?s.containerSize.width:s.containerSize.height;return e.jsxs("div",{style:C,children:[e.jsxs("div",{style:{...p,flexWrap:"wrap",gap:"10px",color:"#dbeafe"},children:[e.jsxs("span",{style:{fontWeight:600,fontSize:"11px",letterSpacing:"0.02em",textTransform:"uppercase"},children:["group ",a+1,": ",s.displayName]}),e.jsxs("span",{children:["direction: ",s.direction," / container: ",n(s.containerSize.width,"px")," × ",n(s.containerSize.height,"px")]})]}),e.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(220px, 1fr))",gap:"10px"},children:s.panels.map((r,y)=>{const d=r.measuredPixelSize??r.size,S=r.size,j=n(S,"px"),v=l>0?r.size/l*100:void 0,E=r.measuredPercentageSize!==void 0?r.measuredPercentageSize:l>0?d/l*100:void 0,c=r.collapsed||d<=R.PANEL_SNAP_THRESHOLD,O=r.collapsed?"collapsed":c?"hidden":"visible",z=n(v,"%"),L=n(E,"%"),_=n(d,"px");return e.jsxs("div",{style:N,children:[e.jsxs("div",{style:p,children:[e.jsx("span",{style:{flex:1,minWidth:0,overflow:"hidden",textOverflow:"ellipsis"},children:r.id}),e.jsx("span",{style:{...G,backgroundColor:r.collapsed?"rgba(251, 113, 133, 0.25)":c?"rgba(250, 204, 21, 0.25)":"rgba(74, 222, 128, 0.25)",color:r.collapsed?"#fecdd3":c?"#fef08a":"#bbf7d0"},children:O})]}),e.jsxs("div",{style:k,children:[e.jsx("span",{children:"size (state):"}),e.jsx("span",{children:j}),e.jsx("span",{children:"size (measured):"}),e.jsx("span",{children:_}),e.jsx("span",{children:"percentage (state):"}),e.jsx("span",{children:z}),e.jsx("span",{children:"preference:"}),e.jsx("span",{children:r.sizeUnit==="pixels"?n(r.preferredPixelSize,"px"):n(r.preferredPercentageSize,"%")}),e.jsx("span",{children:"percentage (measured):"}),e.jsx("span",{children:L}),e.jsx("span",{children:"unit:"}),e.jsx("span",{children:r.sizeUnit}),e.jsx("span",{children:"min:"}),e.jsx("span",{children:r.minSize!==void 0?JSON.stringify(r.minSize):"—"}),e.jsx("span",{children:"max:"}),e.jsx("span",{children:r.maxSize!==void 0?JSON.stringify(r.maxSize):"—"}),e.jsx("span",{children:"priority:"}),e.jsx("span",{children:r.pixelAdjustPriority??"—"}),e.jsx("span",{children:"flex priority:"}),e.jsx("span",{children:r.flexAdjustPriority??"—"})]})]},r.id||y)})})]},s.groupId)})})]});return P.createPortal(m,document.body)};exports.GlobalDebugOverlay=u;exports.GlobalDebugOverlayGate=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("react"),P=require("react-dom"),x=require("./debugOverlayStore-DY09saU8.cjs"),R=require("./index-D8YnyaiG.cjs"),n=(o,i)=>typeof o!="number"||!Number.isFinite(o)?"—":`${(o<0?0:o).toFixed(8)}${i}`,T={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"},Y={display:"flex",justifyContent:"space-between",alignItems:"center",flexWrap:"wrap",gap:"12px"},w={display:"flex",flexDirection:"column",gap:"4px"},D={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"},C={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"},N={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"},p={display:"flex",justifyContent:"space-between",alignItems:"center",gap:"6px"},k={display:"grid",gridTemplateColumns:"auto 1fr",gap:"2px 10px",color:"#e2e8f0"},G={padding:"2px 6px",borderRadius:"9999px",fontSize:"10px",textTransform:"uppercase"},I=({groupId:o})=>x.useDebugOverlayOwnerId()!==o?null:e.jsx(u,{}),u=()=>{const i=x.useDebugOverlaySnapshot().groups,[t,g]=A.useState(!0);if(i.length===0||typeof document>"u")return null;const b=i.reduce((s,a)=>s+a.panels.length,0),h=i.reduce((s,a)=>s+(a.handles?.length??0),0),f=()=>g(s=>!s),m=e.jsxs("div",{style:{...T,padding:t?"10px 18px":"14px 18px",maxHeight:t?"52px":"min(65vh, 520px)",transition:"max-height 0.24s ease, padding 0.24s ease"},children:[e.jsxs("div",{style:{...Y,marginBottom:t?0:"12px"},children:[e.jsxs("div",{style:w,children:[e.jsx("span",{style:{fontWeight:700,fontSize:"12px",letterSpacing:"0.03em"},children:"Panel Overview"}),e.jsxs("span",{style:{color:"#cbd5f5"},children:["groups: ",i.length," / panels: ",b," / resizers: ",h]})]}),e.jsx("button",{type:"button",onClick:f,style:{...D,backgroundColor:t?"rgba(59, 130, 246, 0.2)":"rgba(71, 85, 105, 0.45)"},title:t?"Panel Overview を開く":"Panel Overview を閉じる",children:t?"開く":"閉じる"})]}),!t&&e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"12px",maxHeight:"45vh",overflowY:"auto",paddingRight:"6px"},children:i.map((s,a)=>{const l=s.direction==="horizontal"?s.containerSize.width:s.containerSize.height;return e.jsxs("div",{style:C,children:[e.jsxs("div",{style:{...p,flexWrap:"wrap",gap:"10px",color:"#dbeafe"},children:[e.jsxs("span",{style:{fontWeight:600,fontSize:"11px",letterSpacing:"0.02em",textTransform:"uppercase"},children:["group ",a+1,": ",s.displayName]}),e.jsxs("span",{children:["direction: ",s.direction," / container: ",n(s.containerSize.width,"px")," × ",n(s.containerSize.height,"px")]})]}),e.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(220px, 1fr))",gap:"10px"},children:s.panels.map((r,y)=>{const d=r.measuredPixelSize??r.size,S=r.size,j=n(S,"px"),v=l>0?r.size/l*100:void 0,E=r.measuredPercentageSize!==void 0?r.measuredPercentageSize:l>0?d/l*100:void 0,c=r.collapsed||d<=R.PANEL_SNAP_THRESHOLD,O=r.collapsed?"collapsed":c?"hidden":"visible",z=n(v,"%"),L=n(E,"%"),_=n(d,"px");return e.jsxs("div",{style:N,children:[e.jsxs("div",{style:p,children:[e.jsx("span",{style:{flex:1,minWidth:0,overflow:"hidden",textOverflow:"ellipsis"},children:r.id}),e.jsx("span",{style:{...G,backgroundColor:r.collapsed?"rgba(251, 113, 133, 0.25)":c?"rgba(250, 204, 21, 0.25)":"rgba(74, 222, 128, 0.25)",color:r.collapsed?"#fecdd3":c?"#fef08a":"#bbf7d0"},children:O})]}),e.jsxs("div",{style:k,children:[e.jsx("span",{children:"size (state):"}),e.jsx("span",{children:j}),e.jsx("span",{children:"size (measured):"}),e.jsx("span",{children:_}),e.jsx("span",{children:"percentage (state):"}),e.jsx("span",{children:z}),e.jsx("span",{children:"preference:"}),e.jsx("span",{children:r.sizeUnit==="pixels"?n(r.preferredPixelSize,"px"):n(r.preferredPercentageSize,"%")}),e.jsx("span",{children:"percentage (measured):"}),e.jsx("span",{children:L}),e.jsx("span",{children:"unit:"}),e.jsx("span",{children:r.sizeUnit}),e.jsx("span",{children:"min:"}),e.jsx("span",{children:r.minSize!==void 0?JSON.stringify(r.minSize):"—"}),e.jsx("span",{children:"max:"}),e.jsx("span",{children:r.maxSize!==void 0?JSON.stringify(r.maxSize):"—"}),e.jsx("span",{children:"priority:"}),e.jsx("span",{children:r.pixelAdjustPriority??"—"}),e.jsx("span",{children:"flex priority:"}),e.jsx("span",{children:r.flexAdjustPriority??"—"})]})]},r.id||y)})})]},s.groupId)})})]});return P.createPortal(m,document.body)};exports.GlobalDebugOverlay=u;exports.GlobalDebugOverlayGate=I;

package/dist/hooks.d.ts

@@ -1,5 +1,5 @@
 import { CSSProperties } from "react";
-import { PanelCollapseDirection, PanelGroupProps, PanelMeasurement, PanelRegistration, ResizeHandleLayoutData } from "./types";
+import { PanelCollapseDirection, PanelGroupProps, PanelMeasurement, PanelRegistration, PanelRequestSource, ResizeHandleLayoutData } from "./types";
 export declare const useResizablePanels: ({ direction, style, onLayout, autoSaveId, showDebugInfo }: PanelGroupProps) => {
     groupRef: import("react").RefObject<HTMLDivElement | null>;
     contextValue: {
@@ -10,9 +10,9 @@ export declare const useResizablePanels: ({ direction, style, onLayout, autoSave
         showDebugInfo: boolean;
         registerPanel: (panel: PanelRegistration) => void;
         unregisterPanel: (id: string) => void;
-        resizePanels: (startId: string, endId: string, startSize: number) => void;
-        collapsePanel: (id: string, from: PanelCollapseDirection) => void;
-        expandPanel: (id: string, from: PanelCollapseDirection, targetSize?: number) => void;
+        resizePanels: (startId: string, endId: string, startSize: number, source?: PanelRequestSource) => void;
+        collapsePanel: (id: string, from: PanelCollapseDirection, source?: PanelRequestSource) => void;
+        expandPanel: (id: string, from: PanelCollapseDirection, targetSize?: number, source?: PanelRequestSource) => void;
         getPanel: (id: string) => import("./types").PanelLayoutData | undefined;
         reportPanelMeasurement: (panelId: string, measurement: PanelMeasurement | null) => void;
         panelMeasurements: Record<string, PanelMeasurement>;

package/dist/index-D8YnyaiG.cjs

@@ -0,0 +1,2 @@
+"use strict";const s=require("react"),T=require("react/jsx-runtime"),Me=require("tailwind-merge"),zn=require("react-dom"),Mn=12,L=1e-6,ot=8,it=6,st=48,lt=80,at=2,ct=32,ut=64,dt=8,pt=8,ft=4,Pn=10,Cn=.05,Ln=10,ht=.05,mt=20,gt=.05,xt=(e,n=0)=>{if(!Number.isFinite(e))return e;const t=10**n,r=e*t,o=Math.floor(r),i=r-o,l=Number.EPSILON*Math.max(1,Math.abs(r));return i<.5-l?o/t:i>.5+l?(o+1)/t:(o%2===0?o:o+1)/t},St=6,nn=(e,n)=>n<=0?0:xt(e/n*100,St),bt=(e,n)=>n<=0?0:e/100*n,_n=(e,n="percentage")=>{if(e!==void 0)return typeof e=="number"?{value:e,unit:n}:e},De=(e,n,t)=>e===void 0?n:typeof e=="number"?e/100*t:e.unit==="pixels"?e.value:e.value/100*t,ze=(e,n,t)=>Math.min(Math.max(e,n),t),tn=e=>!Number.isFinite(e)||e<=0?0:Math.max(0,Math.min(Mn,Ln,e*Cn)),he=e=>{if(!e)return 0;const n=Number.parseFloat(e);return Number.isFinite(n)?n:0},Pe=(e,n,t)=>{const r=n==="horizontal",o=typeof window<"u"?window.getComputedStyle(e):null,i=o?r?he(o.paddingLeft)+he(o.paddingRight):he(o.paddingTop)+he(o.paddingBottom):0,l=o?r?he(o.borderLeftWidth)+he(o.borderRightWidth):he(o.borderTopWidth)+he(o.borderBottomWidth):0,a=t?.contentBoxSize?.[0],p=a?r?a.inlineSize:a.blockSize:void 0,u=r?e.clientWidth:e.clientHeight,g=u>0?Math.max(0,u-i):Math.max(0,(r?e.offsetWidth:e.offsetHeight)-i-l),c=p??g;return{content:Math.max(0,c),border:Math.max(0,c+i+l)}},yt="[data-panel-group-direction]",Xe="[data-panel-id], [data-resize-handle-anchor]",zt="[data-panel-id]",Ce=e=>e?.closest(yt)??null,rn=e=>Array.from(e.querySelectorAll(Xe)).filter(n=>{if(Ce(n)!==e)return!1;const t=n.parentElement?.closest(zt);return!(t&&e.contains(t))}),Pt=e=>{const n=t=>{for(const r of Array.from(t))if(r instanceof Element&&(r.matches(Xe)||r.querySelector(Xe)!==null))return!0;return!1};return e.some(t=>n(t.addedNodes)||n(t.removedNodes))},Et=(e,n)=>{if(typeof window>"u")return 1;const t=n==="horizontal",r=e.getBoundingClientRect(),o=t?r.width:r.height,i=window.getComputedStyle(e),l=t?i.width:i.height;if(!l.endsWith("px"))return 1;const a=Number.parseFloat(l);return o>0&&Number.isFinite(a)&&a>0?o/a:1},Ze=(e,n)=>{try{localStorage.setItem(`panel-layout-${e}`,JSON.stringify(n))}catch(t){console.warn("Failed to save panel layout:",t)}},An=e=>{try{const n=localStorage.getItem(`panel-layout-${e}`);if(!n)return null;const t=JSON.parse(n);if(!Array.isArray(t))return null;const r=o=>typeof o=="object"&&o!==null&&typeof o.id=="string"&&Number.isFinite(o.size);return t.every(r)?t:null}catch(n){return console.warn("Failed to load panel layout:",n),null}},Je=0,Dn=1,Oe=e=>Number.isFinite(e)&&e>0?e:0,J=e=>e.sizeUnit==="pixels",me=(e,n)=>{const t=Math.max(0,Oe(De(e.minSize,0,n))),r=Math.max(t,Oe(De(e.maxSize,n,n)));return{min:t,max:r}},Rt=(e,n)=>{const t=e.map(o=>o.min),r=e.map(()=>!1);for(;;){let o=0,i=0,l=0;for(let c=0;c<e.length;c+=1){if(r[c]){i+=t[c];continue}l+=1,o+=e[c].weight}if(l===0)return t;const a=n-i;if(o<=0){for(let c=0;c<e.length;c+=1)r[c]||(t[c]=e[c].min);return t}const p=Math.max(0,a/o);let u=0;for(let c=0;c<e.length;c+=1){if(r[c])continue;const M=p*e[c].weight,h=ze(M,e[c].min,e[c].max);t[c]=h,u+=h-M}let g=!1;for(let c=0;c<e.length;c+=1){if(r[c])continue;const M=p*e[c].weight;u>L&&t[c]>M+L?(r[c]=!0,t[c]=e[c].min,g=!0):u<-L&&t[c]<M-L&&(r[c]=!0,t[c]=e[c].max,g=!0)}if(!g)return t}},wt=(e,n,t)=>{const{min:r,max:o}=me(e,t);if(J(e))return{index:n,weight:0,target:ze(Oe(e.preferredPixelSize),r,o),priority:e.pixelAdjustPriority??0,tier:Je,min:r,max:o};const i=Oe(e.preferredPercentageSize),l=e.flexAdjustPriority!==void 0;return{index:n,weight:i,target:l?ze(i/100*t,r,o):null,priority:e.flexAdjustPriority??0,tier:Dn,min:r,max:o}},En=(e,n,t,r)=>{let o=r;for(const i of e){if(o<=L)break;const l=t(i)-n[i.index];if(l<=0)continue;const a=Math.min(l,o);n[i.index]+=a,o-=a}return o},Qe=(e,n,t)=>{if(e.length===0||t<=L)return t;const r=e.map(l=>({...l,min:n[l.index]})),o=Rt(r,t+r.reduce((l,a)=>l+a.min,0));let i=0;for(let l=0;l<e.length;l+=1)i+=o[l]-n[e[l].index],n[e[l].index]=o[l];return t-i},vt=(e,n,t)=>Qe(e.map(r=>({...r,weight:1})),n,t),Nt=(e,n)=>e.tier!==n.tier?e.tier-n.tier:e.priority!==n.priority?n.priority-e.priority:e.index-n.index,On=(e,n)=>{const t=e.map(()=>0);if(!Number.isFinite(n)||n<=0||e.length===0)return{sizes:t,violation:null};const r=[];for(let h=0;h<e.length;h+=1){const B=e[h];B.collapsed||r.push(wt(B,h,n))}if(r.length===0)return{sizes:t,violation:null};let o=0,i=0;for(const h of r)t[h.index]=h.min,o+=h.min,i+=h.max;const l=It(o,i,n);let a=n-o;if(a<=L)return{sizes:t,violation:l};const p=r.filter(h=>h.target!==null).sort(Nt),u=r.filter(h=>h.target===null&&h.weight>0),g=r.filter(h=>h.tier!==Je&&h.weight<=0),c=p.filter(h=>h.tier===Dn),M=p.filter(h=>h.tier===Je);return a=En(p,t,h=>h.target??h.min,a),a=Qe(u,t,a),a=Qe(c,t,a),a=En(M,t,h=>h.max,a),a=vt(g,t,a),{sizes:t,violation:l}},It=(e,n,t)=>e-t>L?{reason:"minimum-exceeded",totalMinimumSize:e,totalMaximumSize:n,availableContainerSize:t}:t-n>L?{reason:"maximum-insufficient",totalMinimumSize:e,totalMaximumSize:n,availableContainerSize:t}:null,on=s.createContext(null),ke=()=>{const e=s.useContext(on);if(!e)throw new Error("usePanelGroup must be used within a PanelGroup");return e};var Fe=(e=>(e[e.DEBUG=0]="DEBUG",e[e.INFO=1]="INFO",e[e.WARN=2]="WARN",e[e.ERROR=3]="ERROR",e[e.NONE=4]="NONE",e))(Fe||{});const Z=class Z{constructor(n=2,t="[resize-panels]",r=console){this.level=n,this.prefix=t,this.impl=r,Z.instances.add(this)}static setLevel(n){for(const t of Z.instances)t.setLevel(n)}setLevel(n){this.level=n}static setImplementation(n){for(const t of Z.instances)t.setImplementation(n)}setImplementation(n){this.impl=n}static setPrefix(n){for(const t of Z.instances)t.setPrefix(n)}setPrefix(n){this.prefix=n}enabledFor(n){return this.level<=n}formatMessage(n){return typeof n=="string"?[`${this.prefix} ${n}`]:[this.prefix,n]}static debug(n,...t){Z.instance.debug(n,...t)}debug(n,...t){this.level<=0&&this.impl.debug(...this.formatMessage(n),...t)}static info(n,...t){Z.instance.info(n,...t)}info(n,...t){this.level<=1&&this.impl.info(...this.formatMessage(n),...t)}static warn(n,...t){Z.instance.warn(n,...t)}warn(n,...t){this.level<=2&&this.impl.warn(...this.formatMessage(n),...t)}static error(n,...t){Z.instance.error(n,...t)}error(n,...t){this.level<=3&&this.impl.error(...this.formatMessage(n),...t)}};Z.instances=new Set,Z.instance=new Z(2,"[resize-panels]");let Le=Z;const Tn=new Le(Fe.INFO,"[resize-panels]"),kn={containerSize:0,panels:[],violation:null},Rn=(e,n)=>e===null||n===null?e===n:e.reason===n.reason&&Math.abs(e.totalMinimumSize-n.totalMinimumSize)<=L&&Math.abs(e.totalMaximumSize-n.totalMaximumSize)<=L&&Math.abs(e.availableContainerSize-n.availableContainerSize)<=L,ce=(e,n)=>{const{sizes:t,violation:r}=On(e,n);let o=!1;const i=e.map((a,p)=>{const u=a.collapsed?0:t[p];return Math.abs(a.size-u)<=L?a:(o=!0,{...a,size:u})}),l={containerSize:n,panels:o?i:e,violation:r};return Mt(l),l},Fn=e=>{if(e.containerSize<=0||e.violation!==null)return null;let n=0,t=0;for(const o of e.panels)o.collapsed||(n+=o.size,t+=1);if(t===0)return null;const r=L*Math.max(1,e.containerSize);return!Number.isFinite(n)||Math.abs(n-e.containerSize)>r?{allocatedTotal:n,containerSize:e.containerSize}:null},Mt=e=>{const n=Fn(e);n&&Tn.error("Allocated sizes do not fill the container.",{...n,panels:e.panels.map(t=>({id:t.id,size:t.size,collapsed:t.collapsed}))})},ue=(e,n)=>e.panels===n.panels&&e.containerSize===n.containerSize&&Rn(e.violation,n.violation)?e:{containerSize:n.containerSize,panels:n.panels,violation:Rn(e.violation,n.violation)?e.violation:n.violation},Ct=(e,n)=>{const t=e.sizeUnit==="pixels"?e.preferredPixelSize:e.preferredPercentageSize;return{...e,size:0,collapsed:e.collapsed,collapsedByDirection:e.collapsed?n:null,preferenceBeforeCollapse:t,authoredPreference:t}},Ve=e=>e.collapseFromStart?"start":e.collapseFromEnd?"end":null,Lt=(e,n)=>{if(n<=0)return e;const t=tn(n);return e.map(r=>{if(r.collapsed)return r;const o=J(r)?r.size:r.size/n*100,i=J(r)?r.preferredPixelSize:r.preferredPercentageSize,l=r.size>t?o:r.preferenceBeforeCollapse;return i===o&&l===r.preferenceBeforeCollapse?r:J(r)?{...r,preferredPixelSize:o,preferenceBeforeCollapse:l}:{...r,preferredPercentageSize:o,preferenceBeforeCollapse:l}})},en=(e,n,t)=>{if(J(e)){const o=Math.max(0,n);return{...e,preferredPixelSize:o,preferenceBeforeCollapse:o}}if(t<=0)return e;const r=Math.max(0,n/t*100);return{...e,preferredPercentageSize:r,preferenceBeforeCollapse:r}},Bn=(e,n)=>{const t=e.collapsed?e.preferenceBeforeCollapse:J(e)?e.preferredPixelSize:e.preferredPercentageSize;return J(e)?t:t/100*n},_t=(e,n,t,r)=>{const o=Math.max(0,Math.min(t,r)),i=e.filter(u=>u.id!==n&&!u.collapsed&&!J(u)),l=e.reduce((u,g)=>g.id!==n&&!g.collapsed&&J(g)?u+g.size:u,0),a=i.reduce((u,g)=>u+g.size,0),p=Math.max(0,r-o-l);return e.map(u=>{if(u.id===n)return en(u,o,r);if(u.collapsed||J(u)||i.length===0)return u;const g=a>0?u.size/a*p:p/i.length;return en(u,g,r)})},Hn=(e,n)=>{switch(n.type){case"SET_CONTAINER_SIZE":return!Number.isFinite(n.containerSize)||n.containerSize<0||n.containerSize===e.containerSize?e:ue(e,ce(e.panels,n.containerSize));case"REGISTER_PANEL":{const t=e.panels.findIndex(c=>c.id===n.panel.id);if(t===-1){const c=[...e.panels,Ct(n.panel,Ve(n.panel))];return ue(e,ce(c,e.containerSize))}const r=e.panels[t],o=n.panel.sizeUnit==="pixels"?n.panel.preferredPixelSize:n.panel.preferredPercentageSize,i=o!==r.authoredPreference||n.panel.sizeUnit!==r.sizeUnit,l=r.collapsedByDirection==="start"?n.panel.collapseFromStart:r.collapsedByDirection==="end"?n.panel.collapseFromEnd:!1,a=n.panel.collapseFromStart||n.panel.collapseFromEnd,p=r.collapsed&&a,u={...r,...n.panel,collapsed:p,collapsedByDirection:p?l?r.collapsedByDirection:Ve(n.panel):null,preferredPercentageSize:i?n.panel.preferredPercentageSize:r.preferredPercentageSize,preferredPixelSize:i?n.panel.preferredPixelSize:r.preferredPixelSize,preferenceBeforeCollapse:i?o:r.preferenceBeforeCollapse,authoredPreference:o},g=[...e.panels];return g[t]=u,ue(e,ce(g,e.containerSize))}case"UNREGISTER_PANEL":{const t=e.panels.filter(r=>r.id!==n.id);return t.length===e.panels.length?e:ue(e,ce(t,e.containerSize))}case"REORDER_PANELS":{if(n.ids.length!==e.panels.length||new Set(n.ids).size!==n.ids.length)return e;const t=new Map(e.panels.map(o=>[o.id,o])),r=[];for(const o of n.ids){const i=t.get(o);if(!i)return e;r.push(i)}return r.every((o,i)=>o===e.panels[i])?e:ue(e,ce(r,e.containerSize))}case"RESIZE_PANELS":{const t=e.panels.findIndex(B=>B.id===n.startId),r=e.panels.findIndex(B=>B.id===n.endId);if(t===-1||r===-1)return e;const o=e.panels[t],i=e.panels[r];if(o.collapsed||i.collapsed||e.containerSize<=0||!Number.isFinite(n.startSize))return e;const l=o.size+i.size,a=me(o,e.containerSize),p=me(i,e.containerSize),u=Math.max(a.min,l-p.max),g=Math.min(a.max,l-p.min);if(u-g>L)return e;const c=ze(n.startSize,u,Math.max(u,g)),M=l-c;if(Math.abs(c-o.size)<=L)return e;const h=[...e.panels];return h[t]={...o,size:c},h[r]={...i,size:M},ue(e,ce(Lt(h,e.containerSize),e.containerSize))}case"COLLAPSE_PANEL":{const t=e.panels.findIndex(l=>l.id===n.id);if(t===-1)return e;const r=e.panels[t];if(!(n.from==="start"?r.collapseFromStart:r.collapseFromEnd)||r.collapsed)return e;const i=[...e.panels];return i[t]={...r,collapsed:!0,collapsedByDirection:n.from},ue(e,ce(i,e.containerSize))}case"EXPAND_PANEL":{const t=e.panels.findIndex(p=>p.id===n.id);if(t===-1||n.targetSize!==void 0&&e.containerSize<=0)return e;const r=e.panels[t];if(!((n.from==="start"?r.collapseFromStart:r.collapseFromEnd)&&r.collapsed)||r.collapsedByDirection!==null&&r.collapsedByDirection!==n.from)return e;const i={...r,collapsed:!1,collapsedByDirection:null,preferredPixelSize:J(r)?r.preferenceBeforeCollapse:r.preferredPixelSize,preferredPercentageSize:J(r)?r.preferredPercentageSize:r.preferenceBeforeCollapse},l=[...e.panels];l[t]=i;const a=n.targetSize===void 0?l:_t(l,n.id,n.targetSize,e.containerSize);return ue(e,ce(a,e.containerSize))}case"RESTORE_LAYOUT":{if(n.entries.length!==e.panels.length||e.containerSize<=0)return e;const t=new Map(n.entries.map(o=>[o.id,o]));if(e.panels.some(o=>!t.has(o.id)))return e;const r=e.panels.map(o=>{const i=t.get(o.id);if(!i)return o;const l=en(o,i.size,e.containerSize),a=o.collapseFromStart||o.collapseFromEnd;return i.collapsed&&a?{...l,collapsed:!0,collapsedByDirection:o.collapsedByDirection??Ve(o)}:l.collapsed?{...l,collapsed:!1,collapsedByDirection:null}:l});return Tn.debug("restore layout",{containerSize:e.containerSize,entries:n.entries}),ue(e,ce(r,e.containerSize))}default:return e}},At={layout:kn,source:null},Dt=e=>{switch(e.type){case"SET_CONTAINER_SIZE":return"container";case"REGISTER_PANEL":case"UNREGISTER_PANEL":case"REORDER_PANELS":return"panels";case"RESTORE_LAYOUT":return"restore";case"RESIZE_PANELS":case"COLLAPSE_PANEL":case"EXPAND_PANEL":return e.source}},Ot=(e,n)=>{const t=Hn(e.layout,n);if(t===e.layout)return e;const r=t.panels!==e.layout.panels||t.containerSize>0!=e.layout.containerSize>0;return{layout:t,source:r?Dt(n):e.source}},Tt=new Le(Fe.INFO,"[resize-panels]"),kt={pointer:!0,keyboard:!0,api:!0},Ft=e=>typeof e=="string"&&Object.hasOwn(kt,e),Ke=e=>{if(!Ft(e))throw new RangeError(`[resize-panels] A request source must be "pointer", "keyboard" or "api"; received ${typeof e=="string"?JSON.stringify(e):String(e)}.`);return e},Bt=200,Ht="\0handle",$n=({direction:e,style:n,onLayout:t,autoSaveId:r,showDebugInfo:o=!1})=>{const[{layout:i,source:l},a]=s.useReducer(Ot,At),[p,u]=s.useState({}),[g,c]=s.useState({}),M=s.useRef(null),[h,B]=s.useState(""),W=s.useRef({}),se=s.useRef(t);se.current=t,s.useLayoutEffect(()=>{const d=M.current;if(!d||typeof ResizeObserver>"u")return;let f=Number.NaN;const x=C=>{C!==f&&(f=C,a({type:"SET_CONTAINER_SIZE",containerSize:C}))},S=new ResizeObserver(C=>{x(Pe(d,e,C[0]).content)});return S.observe(d),x(Pe(d,e).content),()=>{S.disconnect(),a({type:"SET_CONTAINER_SIZE",containerSize:0})}},[e]);const w=i.panels,H=s.useRef(w);H.current=w;const v=s.useCallback(()=>{const d=M.current,f=H.current;if(!d)return;const x=rn(d);if(B(C=>{const re=x.map(Be=>Be.dataset.panelId??Ht).join("\0");return C===re?C:re}),f.length===0)return;const S=[];for(const C of x){const re=C.dataset.panelId;re!==void 0&&S.push(re)}if(new Set(S).size!==S.length){Tt.error("Duplicate panel id in one group.",{ids:S});return}S.length!==f.length||S.every((C,re)=>C===f[re].id)||a({type:"REORDER_PANELS",ids:S})},[]);s.useLayoutEffect(()=>{const d=M.current;if(!d||(v(),typeof MutationObserver>"u"))return;const f=new MutationObserver(x=>{Pt(x)&&v()});return f.observe(d,{childList:!0,subtree:!0}),()=>{f.disconnect()}},[v]),s.useLayoutEffect(()=>{v()},[v,w]);const _=s.useMemo(()=>w.map(d=>d.size),[w]),E=i.containerSize>0;s.useLayoutEffect(()=>{!E||_.length===0||l===null||se.current?.(_,{source:l})},[_,E,l]);const $=s.useRef(null);s.useEffect(()=>{if(!r||$.current===r||!E||w.length===0)return;$.current=r;const d=An(r);d&&a({type:"RESTORE_LAYOUT",entries:d})},[r,E,w.length]);const b=s.useRef(null);s.useEffect(()=>{if(!(r&&$.current===r&&E)||w.length===0)return;const d=w.map(x=>({id:x.id,size:Bn(x,i.containerSize),collapsed:x.collapsed}));b.current={id:r,entries:d};const f=setTimeout(()=>{b.current=null,Ze(r,d)},Bt);return()=>{clearTimeout(f)}},[r,w,i.containerSize,E]),s.useEffect(()=>()=>{const d=b.current;d&&(b.current=null,Ze(d.id,d.entries))},[]);const q=s.useCallback(d=>{const f=JSON.stringify(d);W.current[d.id]!==f&&(W.current[d.id]=f,a({type:"REGISTER_PANEL",panel:d}))},[]),k=s.useCallback(d=>{delete W.current[d],a({type:"UNREGISTER_PANEL",id:d}),u(f=>{if(!(d in f))return f;const x={...f};return delete x[d],x})},[]),O=s.useCallback((d,f,x,S="api")=>{a({type:"RESIZE_PANELS",startId:d,endId:f,startSize:x,source:Ke(S)})},[]),V=s.useCallback((d,f,x="api")=>{a({type:"COLLAPSE_PANEL",id:d,from:f,source:Ke(x)})},[]),y=s.useCallback((d,f,x,S="api")=>{a({type:"EXPAND_PANEL",id:d,from:f,targetSize:x,source:Ke(S)})},[]),z=s.useCallback(d=>w.find(f=>f.id===d),[w]),G=s.useCallback((d,f)=>{u(x=>{if(f===null){if(!(d in x))return x;const C={...x};return delete C[d],C}const S=x[d];return S&&S.pixelSize===f.pixelSize&&S.percentageSize===f.percentageSize?x:{...x,[d]:f}})},[]),P=s.useCallback((d,f)=>{c(x=>{if(f===null){if(!(d in x))return x;const C={...x};return delete C[d],C}const S=x[d];return S&&S.thickness===f.thickness&&S.visible===f.visible&&S.direction===f.direction&&S.startPanelId===f.startPanelId&&S.endPanelId===f.endPanelId?x:{...x,[d]:f}})},[]),Y=s.useMemo(()=>({direction:e,panels:w,containerSize:i.containerSize,layoutOrderKey:h,showDebugInfo:o,registerPanel:q,unregisterPanel:k,resizePanels:O,collapsePanel:V,expandPanel:y,getPanel:z,reportPanelMeasurement:G,panelMeasurements:p,reportHandleMeasurement:P,handleMeasurements:g,layoutConstraintViolation:i.violation}),[e,w,i.containerSize,h,i.violation,o,q,k,O,V,y,z,G,p,P,g]),te=s.useMemo(()=>({width:"100%",height:"100%",minWidth:"0px",minHeight:"0px",overflow:"hidden",...n,display:"flex",flexDirection:e==="horizontal"?"row":"column",alignItems:"stretch",gap:"0px",position:"relative",boxSizing:"border-box",writingMode:"horizontal-tb"}),[e,n]);return{groupRef:M,contextValue:Y,groupStyle:te}},$t=e=>{const{getPanel:n,collapsePanel:t,expandPanel:r}=ke(),o=n(e),i=s.useCallback(p=>{t(e,p,"api")},[t,e]),l=s.useCallback((p,u)=>{r(e,p,u,"api")},[r,e]),a=s.useCallback((p,u)=>{o?.collapsed?l(p,u):i(p)},[o?.collapsed,i,l]);return s.useMemo(()=>({panel:o,isCollapsed:o?.collapsed??!1,canCollapseFromStart:o?.collapseFromStart??!1,canCollapseFromEnd:o?.collapseFromEnd??!1,collapse:i,expand:l,toggle:a}),[o,i,l,a])},Gt=({panel:e,containerAxisSize:n,containerLabel:t})=>{if(!e)return{sizeDisplay:"-",preferenceDisplay:"-",boundsDisplay:"-",containerDisplay:"-",headlineLabel:"Unregistered",titleText:"Unregistered"};const r=e.sizeUnit==="pixels",o=`${e.size.toFixed(3)}px / ${nn(e.size,n).toFixed(3)}%`,i=r?`${e.preferredPixelSize.toFixed(3)}px`:`${e.preferredPercentageSize.toFixed(3)}%`,l=me(e,n),a=`${l.min.toFixed(1)} - ${l.max.toFixed(1)}px`,p=Number.isFinite(n)?`${n.toFixed(3)}px`:"-",u=r?"Fixed":"Flexible",g=[u,`${t}: ${p}`,`size: ${o}`,`preference: ${i}`,`bounds: ${a}`].join(`
+`);return{sizeDisplay:o,preferenceDisplay:i,boundsDisplay:a,containerDisplay:p,headlineLabel:u,titleText:g}},jt=s.memo(({panel:e,containerAxisSize:n,direction:t})=>{const r=t==="horizontal"?"container width":"container height",{sizeDisplay:o,preferenceDisplay:i,boundsDisplay:l,containerDisplay:a,headlineLabel:p,titleText:u}=s.useMemo(()=>Gt({panel:e,containerAxisSize:n,containerLabel:r}),[e,n,r]),g={position:"absolute",top:2,left:2,zIndex:30,pointerEvents:"none",maxWidth:"calc(100% - 4px)",padding:"2px 4px",borderRadius:4,border:"1px solid rgba(255,255,255,0.1)",backgroundColor:"rgba(15, 23, 42, 0.78)",color:"#e2e8f0",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10,lineHeight:1.35,whiteSpace:"pre",overflow:"hidden",textOverflow:"ellipsis"};return T.jsxs("div",{style:g,title:u,"data-panel-debug-info":"",children:[T.jsxs("div",{children:[p," · ",r,": ",a]}),T.jsxs("div",{children:["size: ",o]}),T.jsxs("div",{children:["preference: ",i]}),T.jsxs("div",{children:["bounds: ",l]})]})}),wn=new Le(Fe.INFO,"[resize-panels]"),Ut={both:{collapseFromStart:!0,collapseFromEnd:!0},start:{collapseFromStart:!0,collapseFromEnd:!1},end:{collapseFromStart:!1,collapseFromEnd:!0}},Wt=e=>{if(!e)return{collapseFromStart:!1,collapseFromEnd:!1};const n=Ut[e.from];if(!n)throw new Error("Invalid collapsible configuration: unsupported 'from' value");return n},qt=e=>{const n=Math.max(0,e.value);return e.unit==="pixels"?{sizeUnit:"pixels",preferredPixelSize:n,preferredPercentageSize:0}:{sizeUnit:"percentage",preferredPercentageSize:n,preferredPixelSize:0}},Vt=({size:e,panel:n,registration:t,containerSize:r,isCollapsed:o})=>{if(o)return{flexBasis:"0px",flexGrow:0,flexShrink:0};if(!n||r<=0){const p=t.sizeUnit==="pixels";return{flexBasis:p?`${t.preferredPixelSize}px`:`${t.preferredPercentageSize}%`,flexGrow:p?0:t.preferredPercentageSize,flexShrink:p?0:1}}if(n.sizeUnit==="pixels")return{flexBasis:`${e}px`,flexGrow:0,flexShrink:0};const i=me(n,r),l=e<i.max-L,a=l&&e>i.min+L;return{flexBasis:`${e}px`,flexGrow:l?n.preferredPercentageSize:0,flexShrink:a?1:0}},Kt=s.memo(({id:e,defaultSize:n={value:50,unit:"percentage"},minSize:t,maxSize:r,className:o,style:i,children:l,collapsible:a,defaultCollapsed:p=!1,pixelAdjustPriority:u,flexAdjustPriority:g,contentOverflow:c="auto",...M})=>{const{direction:h,registerPanel:B,unregisterPanel:W,getPanel:se,containerSize:w,showDebugInfo:H,reportPanelMeasurement:v}=ke(),_=s.useRef(null),E=s.useId(),b=s.useRef(e||`panel-${E}`).current;s.useEffect(()=>{e&&e!==b&&wn.warn("Panel id prop change after mount is ignored.",{currentId:b,attemptedId:e})},[e,b]);const q=s.useMemo(()=>Wt(a),[a]),k=q.collapseFromStart||q.collapseFromEnd;s.useEffect(()=>{p&&!k&&wn.warn("Panel defaultCollapsed is ignored because collapsible configuration is not provided.",{panelId:b})},[p,k,b]);const O=s.useMemo(()=>{const d=_n(n)??{value:50,unit:"percentage"};return{id:b,...qt(d),minSize:t,maxSize:r,...q,collapsed:k&&p,pixelAdjustPriority:u,flexAdjustPriority:g}},[b,n,t,r,q,k,p,u,g]);s.useLayoutEffect(()=>{B(O)},[B,O]),s.useLayoutEffect(()=>()=>{W(b)},[W,b]);const V=se(b),y=V?.size??0,z=V?.collapsed??!1,G=s.useRef(w);G.current=w;const P=s.useCallback(()=>{const d=_.current;if(!d)return;const f=Pe(d,h).border;v(b,{pixelSize:f,percentageSize:nn(f,G.current)})},[h,b,v]);s.useEffect(()=>{if(!H){v(b,null);return}const d=_.current;if(!d||typeof ResizeObserver>"u"){P();return}const f=new ResizeObserver(P);return f.observe(d),P(),()=>{f.disconnect(),v(b,null)}},[H,P,b,v]);const Y=s.useMemo(()=>{const d={overflow:"hidden",isolation:"isolate"},f=z?{...h==="horizontal"?{width:"0px"}:{height:"0px"},pointerEvents:"none",visibility:"hidden",display:"none"}:{};return{...d,...i,...Vt({size:y,panel:V,registration:O,containerSize:w,isCollapsed:z}),order:0,margin:0,display:"flex",flexDirection:"column",position:"relative",boxSizing:"border-box",minWidth:0,minHeight:0,maxWidth:"none",maxHeight:"none",...h==="horizontal"?{height:"100%"}:{width:"100%"},...f}},[y,h,z,V,O,w,i]),te=s.useMemo(()=>({flex:"1 1 auto",position:"relative",overflow:c,display:"flex",flexDirection:"column",minWidth:"0px",minHeight:"0px"}),[c]);return T.jsxs("div",{...M,ref:_,className:Me.twMerge("panel",o),style:Y,"data-panel-id":b,"data-panel-size":y,"data-panel-size-unit":V?.sizeUnit??"percentage","data-panel-collapsible":k,"data-panel-collapse-start":q.collapseFromStart,"data-panel-collapse-end":q.collapseFromEnd,"data-panel-collapsed":z,"aria-hidden":z,children:[T.jsx("div",{style:te,children:l}),H&&T.jsx(jt,{panel:V,containerAxisSize:w,direction:h})]})}),Yt=s.lazy(()=>Promise.resolve().then(()=>require("./GlobalDebugOverlay-Dp6IcAX8.cjs")).then(e=>({default:e.GlobalDebugOverlayGate}))),Xt=[],Zt={};let vn=0;const Jt=()=>(vn+=1,`panel-group-${vn}`),Qt=e=>{const n=e.reason==="minimum-exceeded",t=n?"Layout unavailable: minimum panel sizes exceed the container.":"Layout unavailable: panels cannot fill the container with their maximum sizes.",r=n?`Min required: ${Math.ceil(e.totalMinimumSize)}px | Available: ${Math.floor(e.availableContainerSize)}px`:`Max total: ${Math.floor(e.totalMaximumSize)}px | Needed: ${Math.floor(e.availableContainerSize)}px`;return{summary:t,detail:r}},er=(e,n)=>e.map(t=>{const r=n[t.id];return r?{...t,measuredPixelSize:r.pixelSize,measuredPercentageSize:r.percentageSize}:t}),Nn=(e,n,t)=>{const r=Pe(e,"horizontal"),o=Pe(e,"vertical"),i=e.getBoundingClientRect(),l=r.content>0?r.content:n??i.width,a=o.content>0?o.content:t??i.height;return{width:l,height:a}},nr=e=>{const{id:n,className:t,style:r,children:o,direction:i,onLayout:l,autoSaveId:a,showDebugInfo:p,...u}=e,{groupRef:g,contextValue:c,groupStyle:M}=$n(e),[h,B]=s.useState({width:0,height:0}),W=c.layoutConstraintViolation,se=!!W,w=s.useMemo(()=>{if(!W)return null;const{summary:y,detail:z}=Qt(W);return T.jsxs("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:[T.jsx("span",{children:y}),T.jsx("span",{className:"text-slate-500 text-xs dark:text-slate-400",children:z})]})},[W]),H=s.useRef(null);H.current===null&&(H.current=n??Jt());const v=H.current,_=n??v,E=c.showDebugInfo&&c.panels.length>0,$=E?c.panels:Xt,b=E?c.panelMeasurements:Zt,q=s.useMemo(()=>{if(!E)return[];const y=Object.values(c.handleMeasurements);return y.length<=1?y:y.slice().sort((z,G)=>z.id.localeCompare(G.id))},[c.handleMeasurements,E]),k=h.width,O=h.height;s.useLayoutEffect(()=>{if(!E){B({width:0,height:0});return}if(typeof window>"u"||typeof ResizeObserver>"u")return;const y=g.current;if(!y)return;const z=P=>{B(Y=>Y.width===P.width&&Y.height===P.height?Y:P)},G=new ResizeObserver(P=>{for(const Y of P){if(Y.target!==y)continue;const te=Nn(y,Y.contentRect.width,Y.contentRect.height);z(te)}});return G.observe(y),z(Nn(y)),()=>{G.disconnect()}},[g,E]);const V=s.useMemo(()=>er($,b),[$,b]);return s.useEffect(()=>{if(!E)return;let y=!1,z=null;return Promise.resolve().then(()=>require("./debugOverlayStore-DY09saU8.cjs")).then(G=>{y||(z=G,G.enableDebugOverlayGroup(v))}),()=>{y=!0,z&&(z.disableDebugOverlayGroup(v),z.removeDebugOverlayGroup(v))}},[E,v]),s.useEffect(()=>{if(!E)return;let y=!1;return Promise.resolve().then(()=>require("./debugOverlayStore-DY09saU8.cjs")).then(z=>{y||z.updateDebugOverlayGroup(v,{displayName:_,direction:i,containerSize:{width:k,height:O},panels:V,handles:q})}),()=>{y=!0}},[E,v,_,i,k,O,V,q]),T.jsxs(on.Provider,{value:c,children:[T.jsxs("div",{...u,ref:g,className:Me.twMerge("panel-group",i==="horizontal"?"flex-row":"flex-col",t),style:M,"data-panel-group-id":n,"data-panel-group-direction":i,children:[o,se&&w?T.jsx("div",{className:"pointer-events-auto",style:{position:"absolute",inset:0,zIndex:60,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",backgroundColor:"rgba(248, 250, 252, 0.82)",backdropFilter:"blur(2px)"},children:w}):null]}),E&&T.jsx(s.Suspense,{fallback:null,children:T.jsx(Yt,{groupId:v})})]})},tr={display:"none",pointerEvents:"none",visibility:"hidden"},rr={display:"none"},Ie=(e,n)=>typeof e!="number"||!Number.isFinite(e)||e<=0?n:e,or=e=>{const n=Math.round(e);return n%2===0?n:n+1},In=e=>!e||typeof window>"u"?!1:window.getComputedStyle(e).direction==="rtl",Ye=(e,n,t)=>{const r=e.collapsed?0:e.size,o=n.collapsed?0:n.size,i=r+o;if(i<=0)return;const l=me(e,t),a=me(n,t),p=Math.max(l.min,i-a.max),u=Math.max(p,Math.min(l.max,i-a.min));if(e.collapsed)return{position:0,lower:0,upper:e.collapsedByDirection==="end"?Math.max(0,u):0,resizeLower:p,resizeUpper:u};if(n.collapsed){const M=n.collapsedByDirection==="start";return{position:i,lower:M?Math.min(i,p):i,upper:i,resizeLower:p,resizeUpper:u}}const g=Math.min(r,e.collapseFromEnd?0:p),c=Math.max(r,g,n.collapseFromStart?i:u);return{position:r,lower:g,upper:c,resizeLower:p,resizeUpper:u}},ir=Object.freeze([]),sr=e=>{if(typeof e=="number")return Number.isFinite(e)&&e>=0;if(typeof e!="object"||e===null)return!1;const{value:n,unit:t}=e;return(t==="pixels"||t==="percentage")&&typeof n=="number"&&Number.isFinite(n)&&n>=0},Te=e=>{if(typeof e=="string")return JSON.stringify(e);if(typeof e!="object"||e===null||Array.isArray(e))return String(e);const{value:n,unit:t}=e;return`{ value: ${Te(n)}, unit: ${Te(t)} }`},lr=e=>{if(e===void 0)return ir;if(!Array.isArray(e))throw new RangeError(`[resize-panels] activationSizes must be an array of sizes; received ${Te(e)}.`);for(const[n,t]of e.entries())if(!sr(t))throw new RangeError(`[resize-panels] activationSizes[${n}] must be a non-negative finite percentage or { value, unit: "pixels" | "percentage" } with a non-negative finite value; received ${Te(t)}.`);return e},ar=(e,n,t)=>{let r,o;for(const i of e){const l=ze(De(i,0,t),n.resizeLower,n.resizeUpper);Math.abs(l-n.position)<=L||((o===void 0||l<o)&&(o=l),l>n.position&&(r===void 0||l<r)&&(r=l))}return r===void 0?o:r},cr=s.memo(e=>{const{id:n,disabled:t=!1,className:r,style:o,children:i,onDragging:l,activationSizes:a,thickness:p,indicator:u=!0,indicatorThickness:g,indicatorLength:c,indicatorBarThickness:M,indicatorBarLength:h,title:B,onPointerDown:W,onKeyDown:se,...w}=e,{direction:H,resizePanels:v,getPanel:_,collapsePanel:E,expandPanel:$,panels:b,layoutOrderKey:q,reportHandleMeasurement:k,containerSize:O,layoutConstraintViolation:V}=ke(),y=s.useMemo(()=>lr(a),[a]),[z,G]=s.useState(!1),[P,Y]=s.useState({start:null,end:null}),te=s.useRef(null),d=s.useRef(null),f=s.useRef({getPanel:_,containerSize:O});f.current={getPanel:_,containerSize:O};const x=s.useRef(""),S=s.useRef(""),C=s.useRef(null),re=s.useRef(null),Be=s.useId(),Ee=s.useRef(n??`resize-handle-${Be}`),ge=n??Ee.current,N=H==="horizontal",He=!!V,Q=t||He,ln=s.useCallback(()=>{const m=te.current,X=Ce(m);if(!(m&&X))return;const F=rn(X),A=F.indexOf(m);let D="",U="";for(let j=A-1;j>=0;j-=1){const I=F[j].dataset.panelId;if(I!==void 0){D=I;break}}for(let j=A+1;j<F.length;j+=1){const I=F[j].dataset.panelId;if(I!==void 0){U=I;break}}D===x.current&&U===S.current||(x.current=D,S.current=U,Y({start:D||null,end:U||null}))},[]);s.useEffect(()=>{ln()},[ln,q]),s.useEffect(()=>()=>{C.current?.()},[]);const an=s.useCallback(m=>{if(Q||C.current||m.button!==0)return;const X=_(x.current),F=_(S.current);if(!(X&&F))return;m.preventDefault(),m.stopPropagation();const A=x.current,D=S.current,U=X.size,j=X.size+F.size,I=m.clientX,ne=m.clientY,ye=N?I:ne,K=Ce(te.current),et=N&&In(K)?-1:1,nt=K?Et(K,H):1,xe=m.pointerId,ve=m.currentTarget;ve.setPointerCapture?.(xe),G(!0),l?.(!0);let pn=0,Ne=null,je=y.length>0;const fn=R=>Math.hypot(R.clientX-I,R.clientY-ne)>=ft,tt=R=>{const ie=((N?R.clientX:R.clientY)-ye)*et/nt,ae=U+ie,fe=j-ae,Se=f.current,We=Se.getPanel(A),qe=Se.getPanel(D);if(!(We&&qe))return;const bn=Math.min(Se.containerSize*Cn,Ln),yn=Math.min(Se.containerSize*ht,mt);if(qe.collapsed){fe>yn&&$(D,"start",fe,"pointer");return}if(We.collapsed){ae>yn&&$(A,"end",ae,"pointer");return}if(qe.collapseFromStart&&fe<=bn){E(D,"start","pointer");return}if(We.collapseFromEnd&&ae<=bn){E(A,"end","pointer");return}v(A,D,ae,"pointer")},Ue=R=>{zn.flushSync(()=>{tt(R)})},rt=()=>{const R=f.current,ie=R.getPanel(A),ae=R.getPanel(D);if(!(ie&&ae))return;const fe=Ye(ie,ae,R.containerSize);if(!fe||fe.upper-fe.lower<=L)return;const Se=ar(y,fe,R.containerSize);Se!==void 0&&zn.flushSync(()=>{ie.collapsed?$(A,"end",void 0,"pointer"):ae.collapsed&&$(D,"start",void 0,"pointer"),v(A,D,Se,"pointer")})},hn=R=>{if(R.pointerId!==xe)return;if(R.preventDefault(),R.stopPropagation(),je){if(!fn(R))return;je=!1}const ie=performance.now();if(ie-pn<pt){Ne=R;return}pn=ie,Ne=null,Ue(R)};let mn=!0;const Ae=()=>{mn&&(mn=!1,C.current=null,G(!1),l?.(!1),document.removeEventListener("pointermove",hn),document.removeEventListener("pointerup",gn),document.removeEventListener("pointercancel",xn),ve.removeEventListener("lostpointercapture",Sn),ve.hasPointerCapture?.(xe)&&ve.releasePointerCapture(xe))},gn=R=>{if(R.pointerId===xe){if(je)fn(R)?Ue(R):rt();else if(Ne){const ie=Ne;Ne=null,Ue(ie)}Ae()}},xn=R=>{R.pointerId===xe&&Ae()},Sn=R=>{R.pointerId===xe&&Ae()};document.addEventListener("pointermove",hn),document.addEventListener("pointerup",gn),document.addEventListener("pointercancel",xn),ve.addEventListener("lostpointercapture",Sn),C.current=Ae},[Q,N,H,_,v,E,$,l,y]),cn=s.useCallback(m=>{if(Q)return;const X=N?"ArrowLeft":"ArrowUp",F=N?"ArrowRight":"ArrowDown";if(m.key!==X&&m.key!==F)return;const A=x.current,D=S.current,U=_(A),j=_(D);if(!(U&&j))return;const I=Ye(U,j,O);if(!I||I.upper-I.lower<=L)return;m.preventDefault(),m.stopPropagation();const ne=m.shiftKey?Pn*5:Pn,ye=N&&In(Ce(te.current))?-1:1,K=(m.key===F?ne:-ne)*ye;if(U.collapsed){K>0&&$(A,"end",void 0,"keyboard");return}if(j.collapsed){K<0&&$(D,"start",void 0,"keyboard");return}if(K<0&&U.collapseFromEnd&&I.position<=I.resizeLower+L){E(A,"end","keyboard");return}if(K>0&&j.collapseFromStart&&I.position>=I.resizeUpper-L){E(D,"start","keyboard");return}v(A,D,U.size+K,"keyboard")},[Q,N,_,v,E,$,O]),le=typeof u=="object"&&u!==null?u:void 0,$e=u===!1||le?.visible===!1,ee=Math.max(1,Ie(p,ot)),Gn=N?st:lt,jn=N?ct:ut,de=Math.min(ee,Math.max(1,Ie(g??le?.thickness,it))),be=Math.max(1,Ie(c??le?.length,Gn)),Re=Math.min(de,Math.max(1,Ie(M??le?.barThickness,at))),we=Math.min(be,Math.max(1,Ie(h??le?.barLength,jn))),pe=s.useMemo(()=>{const m=tn(O),X=I=>{const ne=b[I];return ne?ne.collapsed||ne.size<=m:!1},F=(I,ne)=>{let ye=0;for(let K=I;K>=0&&K<b.length&&X(K);K+=ne)ye+=1;return ye},A=b.findIndex(I=>I.id===P.start),D=b.findIndex(I=>I.id===P.end),U=A>=0?F(A,-1):0,j=D>=0?F(D,1):0;return{groupSize:U+j+1,overlapIndex:U}},[P.start,P.end,b,O]),oe=s.useMemo(()=>He?!0:pe.groupSize<=1?!1:pe.overlapIndex>0&&pe.overlapIndex<pe.groupSize-1,[pe,He]),_e=s.useMemo(()=>{if(pe.groupSize<=1||oe)return 0;const m=or(Math.max(dt,de+4));return(pe.overlapIndex===0?-.5:.5)*m},[pe,oe,de]),Un=s.useMemo(()=>{const m={position:"relative",flex:"0 0 0px",alignSelf:"stretch",order:0,margin:0,overflow:"visible",...N?{width:0,minWidth:0}:{height:0,minHeight:0}};return oe?{...m,...tr}:m},[N,oe]),un=s.useMemo(()=>({"--rp-handle-thickness":`${ee}px`,"--rp-indicator-thickness":`${de}px`,"--rp-indicator-length":`${be}px`,"--rp-indicator-bar-thickness":`${Re}px`,"--rp-indicator-bar-length":`${we}px`}),[ee,de,be,Re,we]),Wn=s.useMemo(()=>({...un,...o,position:"absolute",zIndex:20,touchAction:"none",...N?{insetBlockStart:0,insetInlineStart:`${-ee/2}px`,width:`${ee}px`,height:"100%"}:{insetInlineStart:0,insetBlockStart:`${-ee/2}px`,height:`${ee}px`,width:"100%"}}),[N,ee,un,o]),qn=s.useMemo(()=>{if(oe||$e)return rr;const m={width:`${N?de:be}px`,height:`${N?be:de}px`,flexShrink:0};return _e!==0&&(m.position="relative",N?m.insetInlineStart=`${_e}px`:m.insetBlockStart=`${_e}px`),m},[oe,$e,N,de,be,_e]),Vn=s.useMemo(()=>({width:`${N?Re:we}px`,height:`${N?we:Re}px`,flexShrink:0}),[N,Re,we]),Kn=s.useMemo(()=>Me.twMerge("group absolute z-20 flex select-none items-center justify-center border-none bg-transparent transition-colors duration-150 overflow-visible",N?"cursor-col-resize h-full":"cursor-row-resize w-full",!Q&&"hover:bg-gray-200/70 dark:hover:bg-gray-700/70",!Q&&"active:bg-blue-300/60 dark:active:bg-blue-700/60",z&&"bg-blue-200/80 dark:bg-blue-800/60",Q&&"cursor-not-allowed opacity-50","focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50",r),[N,Q,z,r]),Yn=s.useMemo(()=>Me.twMerge("pointer-events-none 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)]",z&&"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)]",le?.className),[z,le?.className]),Xn=s.useMemo(()=>Me.twMerge("pointer-events-none 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)]",z&&"bg-blue-500 dark:bg-blue-300",!Q&&"group-hover:bg-slate-700 dark:group-hover:bg-slate-100",le?.barClassName),[z,Q,le?.barClassName]);s.useEffect(()=>{if(ge===Ee.current)return;const m=Ee.current;Ee.current=ge,re.current=null,k(m,null)},[k,ge]),s.useEffect(()=>{const m={id:ge,thickness:oe?0:ee,direction:H,visible:!oe&&ee>gt,startPanelId:P.start,endPanelId:P.end};re.current=m,k(ge,m)},[ge,ee,oe,H,P.start,P.end,k]),s.useEffect(()=>()=>{k(Ee.current,null)},[k]);const Zn=s.useCallback(m=>{W?.(m),m.defaultPrevented||an(m)},[W,an]),Jn=s.useCallback(m=>{se?.(m),m.defaultPrevented||cn(m)},[se,cn]),Qn=y.length>0?"click to cycle through preset sizes, ":"",dn=`Resize ${N?"columns":"rows"} - Drag or use arrow keys to resize, ${Qn}drag to the edge to collapse/expand panels`,Ge=s.useMemo(()=>{const m=P.start===null?void 0:_(P.start),X=P.end===null?void 0:_(P.end);if(!(m&&X)||O<=0)return;const F=Ye(m,X,O);if(!F)return;const A=D=>Math.round(D/O*100);return{now:A(F.position),min:A(F.lower),max:A(F.upper)}},[P.start,P.end,_,O]);return T.jsx("div",{ref:te,style:Un,"data-resize-handle-anchor":"",children:T.jsx("button",{...w,type:"button",ref:d,className:Kn,style:Wn,onPointerDown:Zn,onKeyDown:Jn,disabled:Q,role:"separator","aria-orientation":N?"vertical":"horizontal","aria-valuenow":Ge?.now,"aria-valuemin":Ge?.min,"aria-valuemax":Ge?.max,"aria-disabled":Q||void 0,"aria-hidden":oe||void 0,"aria-label":w["aria-label"]??dn,"data-resize-handle-id":ge,title:B??dn,children:i||!$e&&T.jsx("div",{className:Yn,style:qn,"data-resize-handle-indicator":"","aria-hidden":"true",children:T.jsx("span",{className:Xn,style:Vn,"data-resize-handle-indicator-bar":"","aria-hidden":"true"})})})})}),sn=e=>typeof CSS<"u"&&typeof CSS.escape=="function"?CSS.escape(e):e.replace(/["\\]/g,"\\$&"),ur=e=>typeof document>"u"?null:document.querySelector(`[data-panel-id="${sn(e)}"]`),dr=e=>typeof document>"u"?null:document.querySelector(`[data-panel-group-id="${sn(e)}"]`),pr=e=>typeof document>"u"?null:document.querySelector(`[data-resize-handle-id="${sn(e)}"]`);exports.PANEL_SNAP_THRESHOLD=Mn;exports.Panel=Kt;exports.PanelGroup=nr;exports.PanelGroupContext=on;exports.PanelResizeHandle=cr;exports.allocatePanelSizes=On;exports.calculateSnapThreshold=tn;exports.clamp=ze;exports.findLayoutInvariantBreach=Fn;exports.findOwningGroup=Ce;exports.getConstraintInPixels=De;exports.getContainerSize=Pe;exports.getGroupLayoutElements=rn;exports.getPanelElement=ur;exports.getPanelGroupElement=dr;exports.getPanelPreferenceInPixels=Bn;exports.getResizeHandleElement=pr;exports.initialPanelGroupLayoutState=kn;exports.isPixelPanel=J;exports.loadLayout=An;exports.normalizeSizeConfig=_n;exports.panelReducer=Hn;exports.percentageToPixels=bt;exports.resolvePanelBounds=me;exports.saveLayout=Ze;exports.toRoundedPercentage=nn;exports.usePanelControls=$t;exports.usePanelGroup=ke;exports.useResizablePanels=$n;