react-panel-layout 0.5.2 → 0.6.0

package/dist/hooks/gesture/utils.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @file Utility functions for gesture detection hooks.
+ *
+ * Contains shared calculations and helper functions used across
+ * gesture-related hooks to avoid code duplication.
+ */
+import type * as React from "react";
+/**
+ * Calculate velocity from displacement and time elapsed.
+ *
+ * @param displacement - Distance traveled in pixels
+ * @param startTime - Start timestamp in milliseconds
+ * @param currentTime - Current timestamp in milliseconds
+ * @returns Velocity in pixels per millisecond
+ */
+export declare const calculateVelocity: (displacement: number, startTime: number, currentTime: number) => number;
+/**
+ * Determine direction from displacement.
+ *
+ * @param displacement - Distance from start position
+ * @returns -1 for backward (left/up), 0 for no movement, 1 for forward (right/down)
+ */
+export declare const determineDirection: (displacement: number) => -1 | 0 | 1;
+/**
+ * Container props type for gesture handling.
+ */
+export type GestureContainerProps = React.HTMLAttributes<HTMLElement> & {
+    style: React.CSSProperties;
+};
+/**
+ * Merge multiple container props objects for gesture handling.
+ *
+ * Combines style objects and chains onPointerDown handlers.
+ * Useful when combining multiple gesture hooks that each provide
+ * their own container props (e.g., swipe input + native gesture guard).
+ *
+ * @param propsArray - Array of container props to merge
+ * @returns Merged container props with combined styles and handlers
+ */
+export declare const mergeGestureContainerProps: (...propsArray: GestureContainerProps[]) => GestureContainerProps;

package/dist/hooks/useAnimatedVisibility.d.ts

@@ -0,0 +1,58 @@
+/**
+ * @file Hook for animation-aware visibility control.
+ *
+ * Common pattern for showing/hiding elements with CSS animations:
+ * - If animation exists: wait for animationend before hiding
+ * - If no animation: hide immediately
+ * - Uses display:none for performance (removes from layout)
+ * - Includes timeout fallback in case animationend doesn't fire
+ */
+import * as React from "react";
+type AnimatedVisibilityState = {
+    /** Whether element should be displayed (display: block/none) */
+    shouldDisplay: boolean;
+    /** Whether element is currently animating out */
+    isAnimatingOut: boolean;
+};
+type UseAnimatedVisibilityOptions = {
+    /** Whether the element is logically visible */
+    isVisible: boolean;
+    /** CSS animation value for leave animation (e.g., CSS variable) */
+    leaveAnimation?: string;
+    /** Skip animation and hide immediately */
+    skipAnimation?: boolean;
+    /** Timeout for animation fallback in ms (default: 1000ms) */
+    animationTimeout?: number;
+};
+type UseAnimatedVisibilityResult = {
+    /** Current visibility state */
+    state: AnimatedVisibilityState;
+    /** Props to spread on the animated element */
+    props: {
+        onAnimationEnd: (e: React.AnimationEvent) => void;
+    };
+    /** Style to apply for display control */
+    style: {
+        display: "block" | "none";
+    };
+};
+/**
+ * Hook for animation-aware visibility control.
+ *
+ * @example
+ * const { state, props, style } = useAnimatedVisibility({
+ *   isVisible: isActive,
+ *   leaveAnimation: PIVOT_ANIMATION_LEAVE,
+ * });
+ *
+ * return (
+ *   <div
+ *     style={{ ...baseStyle, ...style, animation: isActive ? enterAnim : leaveAnim }}
+ *     {...props}
+ *   >
+ *     {children}
+ *   </div>
+ * );
+ */
+export declare function useAnimatedVisibility({ isVisible, leaveAnimation, skipAnimation, animationTimeout, }: UseAnimatedVisibilityOptions): UseAnimatedVisibilityResult;
+export {};

package/dist/hooks/useAnimationFrame.d.ts

@@ -0,0 +1,84 @@
+/**
+ * Easing function type.
+ * Takes a progress value (0-1) and returns an eased value (0-1).
+ */
+export type EasingFunction = (t: number) => number;
+/**
+ * Built-in easing functions.
+ */
+export declare const easings: {
+    /** Linear (no easing) */
+    readonly linear: (t: number) => number;
+    /** Ease out cubic */
+    readonly easeOutCubic: (t: number) => number;
+    /** Ease out expo (similar to cubic-bezier(0.22, 1, 0.36, 1)) */
+    readonly easeOutExpo: (t: number) => number;
+    /** Ease out quart */
+    readonly easeOutQuart: (t: number) => number;
+    /** Ease in out cubic */
+    readonly easeInOutCubic: (t: number) => number;
+};
+/**
+ * Animation state passed to callbacks.
+ */
+export type AnimationState = {
+    /** Raw progress (0-1) */
+    progress: number;
+    /** Eased progress (0-1) */
+    easedProgress: number;
+    /** Elapsed time in ms */
+    elapsed: number;
+    /** Whether animation is complete */
+    isComplete: boolean;
+};
+/**
+ * Options for useAnimationFrame hook.
+ */
+export type UseAnimationFrameOptions = {
+    /** Duration of animation in milliseconds */
+    duration?: number;
+    /** Easing function for the animation */
+    easing?: EasingFunction;
+    /** Callback called every frame with animation state */
+    onFrame?: (state: AnimationState) => void;
+    /** Callback when animation completes */
+    onComplete?: () => void;
+};
+/**
+ * Result from useAnimationFrame hook.
+ */
+export type UseAnimationFrameResult = {
+    /** Whether animation is currently running */
+    isAnimating: boolean;
+    /** Start the animation */
+    start: () => void;
+    /** Cancel the animation */
+    cancel: () => void;
+};
+/**
+ * Generic requestAnimationFrame-based animation hook.
+ *
+ * Provides a reusable animation loop with progress calculation and easing.
+ * Use this as a building block for specific animation behaviors.
+ *
+ * @example
+ * ```tsx
+ * const { start, isAnimating } = useAnimationFrame({
+ *   duration: 300,
+ *   easing: easings.easeOutExpo,
+ *   onFrame: ({ easedProgress }) => {
+ *     const value = fromValue + (toValue - fromValue) * easedProgress;
+ *     element.style.transform = `translateX(${value}px)`;
+ *   },
+ *   onComplete: () => console.log('Done!'),
+ * });
+ *
+ * // Start animation
+ * start();
+ * ```
+ */
+export declare function useAnimationFrame(options: UseAnimationFrameOptions): UseAnimationFrameResult;
+/**
+ * Interpolate between two values using eased progress.
+ */
+export declare function interpolate(from: number, to: number, easedProgress: number): number;

package/dist/hooks/useSnapAnimation.d.ts

@@ -0,0 +1,54 @@
+/**
+ * @file Hook for snapping element transform animation.
+ *
+ * Built on top of useAnimationFrame, provides a convenient API
+ * for animating element transforms from one position to another.
+ */
+import * as React from "react";
+import type { EasingFunction } from "./useAnimationFrame.js";
+export { easings } from "./useAnimationFrame.js";
+export type { EasingFunction } from "./useAnimationFrame.js";
+/**
+ * Options for useSnapAnimation hook.
+ */
+export type UseSnapAnimationOptions = {
+    /** Reference to the element to animate */
+    elementRef: React.RefObject<HTMLElement | null>;
+    /** Duration of animation in milliseconds */
+    duration?: number;
+    /** Easing function for the animation */
+    easing?: EasingFunction;
+    /** Callback when animation completes */
+    onComplete?: () => void;
+};
+/**
+ * Result from useSnapAnimation hook.
+ */
+export type UseSnapAnimationResult = {
+    /** Whether animation is currently running */
+    isAnimating: boolean;
+    /** Start a new animation from current value to target */
+    animate: (from: number, to: number, axis: "x" | "y") => void;
+    /** Cancel any running animation */
+    cancel: () => void;
+};
+/**
+ * Hook for snapping element transform animation.
+ *
+ * Animates an element's transform from one position to another
+ * using requestAnimationFrame for smooth animation.
+ *
+ * @example
+ * ```tsx
+ * const elementRef = useRef<HTMLDivElement>(null);
+ * const { animate, isAnimating } = useSnapAnimation({
+ *   elementRef,
+ *   duration: 300,
+ *   easing: easings.easeOutExpo,
+ * });
+ *
+ * // Start animation
+ * animate(currentX, targetX, "x");
+ * ```
+ */
+export declare function useSnapAnimation(options: UseSnapAnimationOptions): UseSnapAnimationResult;

package/dist/hooks/useSwipeContentTransform.d.ts

@@ -0,0 +1,79 @@
+/**
+ * @file Shared hook for DOM-based swipe content transform.
+ *
+ * This hook provides immediate DOM manipulation for swipe gestures,
+ * with smooth snap-back animation when the swipe ends.
+ *
+ * Used by both Pivot and Stack for consistent swipe behavior.
+ */
+import * as React from "react";
+import type { GestureAxis } from "./gesture/types.js";
+/**
+ * Options for useSwipeContentTransform hook.
+ */
+export type UseSwipeContentTransformOptions = {
+    /** Ref to the element to transform */
+    elementRef: React.RefObject<HTMLElement | null>;
+    /** Target position in pixels (where element should be at rest) */
+    targetPx: number;
+    /** Current swipe displacement in pixels */
+    displacement: number;
+    /** Whether swipe gesture is active */
+    isSwiping: boolean;
+    /** Axis of transformation */
+    axis?: GestureAxis;
+    /** Duration of snap animation in ms */
+    animationDuration?: number;
+    /** Container size in pixels (used for snap on resize) */
+    containerSize?: number;
+    /**
+     * Whether to animate when targetPx changes (without swipe).
+     * Use this for tab bar animations triggered by click/button.
+     * @default false
+     */
+    animateOnTargetChange?: boolean;
+    /**
+     * Initial position in pixels when first mounted.
+     * If different from targetPx, will animate from initialPx to targetPx.
+     * Use this for push animations where new panel comes from off-screen.
+     */
+    initialPx?: number;
+};
+/**
+ * Animation direction information.
+ */
+export type AnimationDirection = {
+    /** Source position in pixels */
+    from: number;
+    /** Target position in pixels */
+    to: number;
+};
+/**
+ * Result from useSwipeContentTransform hook.
+ */
+export type UseSwipeContentTransformResult = {
+    /** Whether snap animation is currently running */
+    isAnimating: boolean;
+    /** Current position in pixels (for visibility calculations) */
+    currentPx: number;
+    /** Animation direction info, or null if not animating */
+    animationDirection: AnimationDirection | null;
+};
+/**
+ * Hook for DOM-based swipe content transform.
+ *
+ * During swipe: immediately updates element.style.transform to follow finger.
+ * After swipe: animates from current position to target position.
+ *
+ * @example
+ * ```tsx
+ * const containerRef = useRef<HTMLDivElement>(null);
+ * const { isAnimating, currentPx } = useSwipeContentTransform({
+ *   elementRef: containerRef,
+ *   targetPx: 0,
+ *   displacement: inputState.displacement.x,
+ *   isSwiping: inputState.phase === "swiping",
+ * });
+ * ```
+ */
+export declare function useSwipeContentTransform(options: UseSwipeContentTransformOptions): UseSwipeContentTransformResult;

package/dist/index.cjs

@@ -1,3 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("./GridLayout-BQQ63eA1.cjs"),h=require("react/jsx-runtime"),Rt=require("react"),P=require("./styles-PsqGOEJP.cjs"),tt=require("./useIsomorphicLayoutEffect-DGRNF4Lf.cjs"),Pt=require("react-dom"),Dt=require("./usePivot-7ctin_P_.cjs");function jt(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,r.get?r:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const u=jt(Rt),At=t=>{const e=t==="drag"?P.COLOR_RESIZE_HANDLE_ACTIVE:t==="hover"?P.COLOR_RESIZE_HANDLE_HOVER:P.COLOR_RESIZE_HANDLE_IDLE;return{width:P.HORIZONTAL_DIVIDER_WIDTH,cursor:"col-resize",position:"relative",userSelect:"none",backgroundColor:e}},kt=({onResize:t,component:e,element:n})=>{const{ref:r,isDragging:o,onPointerDown:s}=E.useResizeDrag({axis:"x",onResize:t}),[a,i]=u.useState(!1),c={ref:r,style:At(o?"drag":a?"hover":"idle"),role:"separator","aria-orientation":"vertical","data-dragging":o?"true":void 0,onPointerDown:s,onPointerEnter:()=>i(!0),onPointerLeave:()=>i(!1)};return n?u.cloneElement(n,c):e?h.jsx(e,{...c}):h.jsx("div",{...c})},_t=()=>{const{layerId:t}=E.useLayerInstance(),{getLayerHandleProps:e}=E.useGridLayoutContext();return u.useMemo(()=>e(t),[e,t])},nt={left:0,top:0},rt={width:400,height:300},Mt=t=>{const[e,n]=u.useState(()=>{const l={};return t.forEach(p=>{if(p.floating){const g=p.floating;l[p.id]={position:g.defaultPosition??nt,size:g.defaultSize??rt}}}),l}),r=u.useMemo(()=>{const l=new Map;return t.forEach(p=>l.set(p.id,p)),l},[t]),o=u.useCallback(l=>{const p=r.get(l);return p?.floating?.position!==void 0?p.floating.position:e[l]?.position??nt},[r,e]),s=u.useCallback(l=>{const p=r.get(l);return p?.floating?.size!==void 0?p.floating.size:e[l]?.size??rt},[r,e]),a=u.useCallback(l=>r.get(l)?.floating?.zIndex,[r]),i=u.useCallback((l,p)=>{const g=r.get(l);g?.floating&&(g.floating.position===void 0&&n(v=>{const b=v[l];return b?{...v,[l]:{...b,position:p}}:v}),g.floating.onMove?.(p))},[r]),c=u.useCallback((l,p)=>{const g=r.get(l);g?.floating&&(g.floating.size===void 0&&n(v=>{const b=v[l];return b?{...v,[l]:{...b,size:p}}:v}),g.floating.onResize?.(p))},[r]),d=u.useCallback(l=>{r.get(l)?.floating?.onClose?.()},[r]);return{getPosition:o,getSize:s,getZIndex:a,updatePosition:i,updateSize:c,close:d}},ut=u.createContext(null),Ot=()=>{const t=u.useContext(ut);if(!t)throw new Error("useKeybindings must be used within KeybindingsProvider");return t},Nt=t=>{const e=[];t.metaKey&&e.push("Mod"),t.ctrlKey&&e.push("Ctrl"),t.altKey&&e.push("Alt"),t.shiftKey&&e.push("Shift");const n=t.key.length===1?t.key.toUpperCase():t.key;return e.push(n),e.join("-")},Lt=({children:t,configure:e})=>{const n=u.useRef({}),r=u.useCallback((a,i)=>{n.current={...n.current,[a]:i}},[]),o=u.useCallback(a=>{const i={...n.current};delete i[a],n.current=i},[]);u.useEffect(()=>{const a=i=>{const c=Nt(i),d=n.current[c];d&&d(i)};return window.addEventListener("keydown",a),()=>{window.removeEventListener("keydown",a)}},[]);const s=u.useMemo(()=>({register:r,unregister:o}),[r,o]);return u.useEffect(()=>{e&&e(s)},[s,e]),h.jsx(ut.Provider,{value:s,children:t})},Bt=(t,e)=>{t.register("Mod-\\",n=>{n.preventDefault(),e.splitFocused("vertical")}),t.register("Mod-Shift-\\",n=>{n.preventDefault(),e.splitFocused("horizontal")});for(const n of[1,2,3,4,5,6,7,8,9])t.register(`Mod-${String(n)}`,r=>{r.preventDefault(),e.focusGroupIndex(n)});t.register("Alt-ArrowRight",n=>{n.preventDefault(),e.focusNextGroup()}),t.register("Alt-ArrowLeft",n=>{n.preventDefault(),e.focusPrevGroup()})},Ht=t=>t.type==="group",lt=(t,e={x:0,y:0,w:100,h:100})=>{const n=new Map,r=(o,s)=>{if(Ht(o)){n.set(o.groupId,s);return}if(o.direction==="vertical"){const c=s.w*o.ratio,d=s.w-c;r(o.a,{x:s.x,y:s.y,w:c,h:s.h}),r(o.b,{x:s.x+c,y:s.y,w:d,h:s.h});return}const a=s.h*o.ratio,i=s.h-a;r(o.a,{x:s.x,y:s.y,w:s.w,h:a}),r(o.b,{x:s.x,y:s.y+a,w:s.w,h:i})};return r(t,e),n},zt=(t,e)=>{const n=lt(t.tree),r={areas:[["root"]],rows:[{size:"1fr"}],columns:[{size:"1fr"}],gap:"0px",style:{position:"relative"}},o=Array.from(n.entries()).map(([s,a])=>{const i={position:"absolute",left:`${a.x}%`,top:`${a.y}%`,width:`${a.w}%`,height:`${a.h}%`,overflow:"hidden",display:"flex",flexDirection:"column"};return{id:s,positionMode:"absolute",style:i,component:e(s)}});return{config:r,layers:o}},$t=(t,e,n)=>{const r=lt(t.tree),o=Array.from(new Set(Array.from(r.values()).flatMap(b=>[b.x,b.x+b.w]))).sort((b,I)=>b-I),s=Array.from(new Set(Array.from(r.values()).flatMap(b=>[b.y,b.y+b.h]))).sort((b,I)=>b-I),a=o.slice(1).map((b,I)=>`${b-o[I]}fr`),i=s.slice(1).map((b,I)=>`${b-s[I]}fr`),c=a.map(b=>({size:b,resizable:n})),d=i.map(b=>({size:b,resizable:n})),l=(b,I,w,y)=>{for(const[m,x]of r.entries())if(b>=x.x&&I<=x.x+x.w&&w>=x.y&&y<=x.y+x.h)return m;return"."},p=[];for(let b=0;b<s.length-1;b+=1){const I=[];for(let w=0;w<o.length-1;w+=1)I.push(l(o[w],o[w+1],s[b],s[b+1]));p.push(I)}const g={areas:p,rows:d,columns:c,gap:"0px"},v=Array.from(r.keys()).map(b=>({id:b,gridArea:b,component:e(b)}));return{config:g,layers:v}},dt=u.createContext(null),Ft=()=>{const t=u.useContext(dt);if(!t)throw new Error("usePanelRenderContext must be used within PanelRenderProvider");return t},Xt=({value:t,children:e})=>h.jsx(dt.Provider,{value:t,children:e}),pt=u.createContext(null),ft=()=>{const t=u.useContext(pt);if(!t)throw new Error("useDomRegistry must be used within DomRegistryProvider");return t},Yt=({children:t})=>{const e=u.useRef(new Map),n=u.useCallback(c=>{const d=e.current.get(c);if(d)return d;const l={group:null,tabbar:null,content:null};return e.current.set(c,l),l},[]),r=u.useCallback((c,d)=>{const l=n(c);if(l.group=d,d===null){const p=e.current.get(c);(p?p.tabbar===null&&p.content===null:!1)&&e.current.delete(c)}},[n]),o=u.useCallback((c,d)=>{const l=n(c);if(l.tabbar=d,d===null){const p=e.current.get(c);(p?p.group===null&&p.content===null:!1)&&e.current.delete(c)}},[n]),s=u.useCallback((c,d)=>{const l=n(c);if(l.content=d,d===null){const p=e.current.get(c);(p?p.group===null&&p.tabbar===null:!1)&&e.current.delete(c)}},[n]),a=u.useCallback(()=>e.current,[]),i=u.useMemo(()=>({setGroupEl:r,setTabbarEl:o,setContentEl:s,getAll:a}),[r,o,s,a]);return h.jsx(pt.Provider,{value:i,children:t})},qt={display:"flex",flexDirection:"column",width:"100%",height:"100%"},Ut={flex:"1 1 auto",minWidth:0,minHeight:0,position:"relative",overflow:"hidden"};function Vt(t,e,n,r){return t?u.cloneElement(t,n,r):e?h.jsx(e,{...n,children:r}):h.jsx("div",{...n,children:r})}function Kt(t,e,n,r){return t?u.cloneElement(t,n,r):e?h.jsx(e,{...n,children:r}):h.jsx("div",{...n,children:r})}const Wt=({group:t,tabbar:e,content:n,onContentPointerDown:r,groupRef:o,contentRef:s,component:a,element:i,contentComponent:c,contentElement:d})=>{const l={ref:o,style:qt,"data-group-id":t.id},g=Vt(d,c,{ref:s,style:Ut,"data-dnd-zone":"content",onPointerDown:r},n),v=h.jsxs(h.Fragment,{children:[e,g]});return Kt(i,a,l,v)},gt=u.memo(Wt,(t,e)=>t.group.id!==e.group.id||t.group.activeTabId!==e.group.activeTabId||t.group.tabs.length!==e.group.tabs.length?!1:t.group.tabs===e.group.tabs);gt.displayName="PanelGroupView";const q=(t,e,n)=>{const r=t.left,o=t.top,s=t.width,a=t.height,i=e-r,c=n-o,d=s/3,l=a/3;return i>d&&i<s-d&&c>l&&c<a-l?"center":i<c&&i<s-i&&c<a-c?"left":s-i<c&&s-i<i&&c<a-c?"right":c<i&&c<a-c&&i<s-i?"top":"bottom"};function k(t,e){if(!e){const r=(()=>({type:t}));return Object.defineProperty(r,"type",{value:t,writable:!1,enumerable:!0}),r}const n=((...r)=>{const o=e(...r);return typeof o>"u"?{type:t}:{type:t,payload:o}});return Object.defineProperty(n,"type",{value:t,writable:!1,enumerable:!0}),n}const Zt=(t,e)=>{const n={};return Object.keys(t).forEach(r=>{const o=t[r];n[r]=((...s)=>{const a=o(...s);return e(a),a})}),n},bt=(t,e)=>{const n={};return Object.keys(e).forEach(r=>{const o=e[r];if(!o)return;const s=t[r];if(!s)throw new Error(`Missing action creator for key "${String(r)}"`);n[s.type]=o}),n},ht={phase:{kind:"idle"},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null},A={startContent:k("START_CONTENT",t=>t),startTab:k("START_TAB",t=>t),setSuggest:k("SET_SUGGEST",t=>t),setPointer:k("SET_POINTER",t=>t),setTabbarHover:k("SET_TABBAR_HOVER",t=>t),reset:k("RESET")},Jt=bt(A,{startContent:(t,e)=>({phase:{kind:"content",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null}),startTab:(t,e)=>({phase:{kind:"tab",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:e.payload.element}),setSuggest:(t,e)=>({...t,suggest:e.payload}),setPointer:(t,e)=>({...t,pointer:e.payload}),setTabbarHover:(t,e)=>({...t,tabbarHover:e.payload}),reset:()=>ht}),Qt=(t,e)=>{const n=Jt[e.type];return n?n(t,e,void 0):t},mt=u.createContext(null),K=()=>{const t=u.useContext(mt);if(!t)throw new Error("usePanelInteractions must be used within InteractionsProvider");return t},te=({containerRef:t,dragThresholdPx:e,onCommitContentDrop:n,onCommitTabDrop:r,isContentZoneAllowed:o,children:s})=>{const[a,i]=u.useReducer(Qt,ht),c=ft(),d=u.useCallback(()=>{const w=Array.from(c.getAll().entries()),y=w.map(([f,S])=>({gid:f,el:S.content??S.group})).filter(f=>!!f.el).map(f=>({...f,rect:f.el.getBoundingClientRect()})),m=w.map(([f,S])=>({gid:f,el:S.tabbar})).filter(f=>!!f.el).map(f=>({...f,rect:f.el.getBoundingClientRect()})),x=w.map(([f,S])=>({gid:f,el:S.content??S.group})).filter(f=>!!f.el).map(f=>({...f,rect:f.el.getBoundingClientRect()}));return{groups:y,tabbars:m,contents:x}},[c]),l=E.useEffectEvent(w=>{if(!t.current)return;const m=w.clientX,x=w.clientY,f=a.phase;if(f.kind==="idle")return;const S=Math.abs(m-f.startX),C=Math.abs(x-f.startY);if(S<e&&C<e){a.phase.kind==="content"&&i(A.setSuggest(null)),i(A.setPointer(null)),i(A.setTabbarHover(null));return}if(i(A.setPointer({x:m,y:x})),f.kind==="content"){const G=f.cache.groups.find(({rect:T})=>m>=T.left&&m<=T.right&&x>=T.top&&x<=T.bottom);if(!G){i(A.setSuggest(null));return}const D=q(G.rect,m,x);if(o&&!o({targetGroupId:G.gid,zone:D})){i(A.setSuggest(null));return}i(A.setSuggest({rect:G.rect,zone:D}));return}if(f.kind==="tab"){const G=f.cache.tabbars.find(({rect:R})=>m>=R.left&&m<=R.right&&x>=R.top&&x<=R.bottom);if(G){const _=Array.from(G.el.querySelectorAll("[role='tab']")).map(H=>H.getBoundingClientRect()),j=_.map(H=>H.left+H.width/2),O=j.findIndex(H=>m<H),N=O===-1?j.length:O,Ct=_.length===0?G.rect.left+8:N===0?_[0].left:N===_.length?_[_.length-1].right:(_[N-1].right+_[N].left)/2;i(A.setTabbarHover({groupId:G.gid,index:N,rect:G.rect,insertX:Ct}))}else i(A.setTabbarHover(null));const D=f.cache.contents.find(({rect:R})=>m>=R.left&&m<=R.right&&x>=R.top&&x<=R.bottom);if(!D){i(A.setSuggest(null));return}const T=q(D.rect,m,x);if(o&&!o({targetGroupId:D.gid,zone:T})){i(A.setSuggest(null));return}i(A.setSuggest({rect:D.rect,zone:T}))}}),p=E.useEffectEvent(w=>{const y=t.current,m=a;if(i(A.reset()),!y)return;const x=w.clientX,f=w.clientY;if(m.phase.kind==="idle")return;const S=Math.abs(x-m.phase.startX),C=Math.abs(f-m.phase.startY);if(!(S<e&&C<e)){if(m.phase.kind==="content"){const G=m.phase.cache.groups.find(({rect:R})=>x>=R.left&&x<=R.right&&f>=R.top&&f<=R.bottom);if(!G)return;const D=G.gid??null;if(!D)return;const T=q(G.rect,x,f);if(o&&!o({targetGroupId:D,zone:T}))return;n({fromGroupId:m.phase.fromGroupId,tabId:m.phase.tabId,targetGroupId:D,zone:T});return}if(m.phase.kind==="tab"){const G=m.phase.cache.tabbars.find(({rect:T})=>x>=T.left&&x<=T.right&&f>=T.top&&f<=T.bottom);if(G){const T=G.gid;if(!T)return;const _=Array.from(G.el.querySelectorAll("[role='tab']")).map(N=>{const Z=N.getBoundingClientRect();return Z.left+Z.width/2}),j=_.findIndex(N=>x<N),O=j===-1?_.length:j;r({fromGroupId:m.phase.fromGroupId,tabId:m.phase.tabId,targetGroupId:T,targetIndex:O});return}const D=m.phase.cache.contents.find(({rect:T})=>x>=T.left&&x<=T.right&&f>=T.top&&f<=T.bottom);if(D){const T=D.gid??null;if(!T)return;const R=q(D.rect,x,f);if(o&&!o({targetGroupId:T,zone:R}))return;n({fromGroupId:m.phase.fromGroupId,tabId:m.phase.tabId,targetGroupId:T,zone:R})}}}}),g=E.useEffectEvent(()=>{i(A.reset())});u.useEffect(()=>{if(a.phase.kind!=="idle")return window.addEventListener("pointermove",l),window.addEventListener("pointerup",p,{once:!0}),window.addEventListener("pointercancel",g,{once:!0}),()=>{window.removeEventListener("pointermove",l),window.removeEventListener("pointerup",p),window.removeEventListener("pointercancel",g)}},[a.phase.kind]);const v=u.useCallback((w,y,m)=>{if(m.button!==0)return;m.currentTarget.setPointerCapture(m.pointerId);const x=d();i(A.startContent({x:m.clientX,y:m.clientY,groupId:w,tabId:y,cache:x}))},[d]),b=u.useCallback((w,y,m)=>{if(m.button!==0)return;const x=m.currentTarget;x&&x.setPointerCapture(m.pointerId);const f=d();i(A.startTab({x:m.clientX,y:m.clientY,groupId:y,tabId:w,cache:f,element:x}))},[d]),I=u.useMemo(()=>({suggest:a.suggest,isTabDragging:a.phase.kind==="tab",draggingTabId:a.phase.kind==="tab"?a.phase.tabId:null,dragPointer:a.pointer,tabbarHover:a.tabbarHover,draggingTabElement:a.draggingTabElement,onStartContentDrag:v,onStartTabDrag:b}),[a.suggest,a.pointer,a.tabbarHover,a.phase,a.draggingTabElement,v,b]);return h.jsx(mt.Provider,{value:I,children:s})},ot={display:"inline-flex",alignItems:"center",userSelect:"none"},ee=({groupId:t,tab:e,active:n,dragging:r,onClickTab:o,onStartDrag:s,onCloseTab:a,tabComponent:i,tabElement:c,onDoubleClick:d})=>{const l=u.useEffectEvent(()=>{o(e.id)}),p=u.useEffectEvent(I=>{s&&I.button===0&&s(e.id,t,I)}),g=()=>{const I=!!a;return h.jsx(u.Activity,{mode:I?"visible":"hidden",children:h.jsx("button",{type:"button","aria-label":`Close tab ${e.title}`,onClick:w=>{a&&(w.stopPropagation(),a(t,e.id))},style:{marginLeft:6},tabIndex:I?void 0:-1,disabled:!I,"aria-hidden":I?void 0:!0,children:"×"})})},v={role:"tab","aria-selected":n,tabIndex:n?0:-1,style:ot,onClick:l,onPointerDown:p,onDoubleClick:d,"data-tab-id":e.id,"data-active":n?"true":"false","data-dragging":r?"true":"false",children:h.jsxs(h.Fragment,{children:[h.jsx("span",{children:e.title}),g()]})},b={type:"button",role:"tab","aria-selected":n,tabIndex:n?0:-1,style:ot,onClick:()=>{o(e.id)},onPointerDown:I=>{s&&I.button===0&&s(e.id,t,I)},onDoubleClick:d,children:h.jsx("span",{children:e.title})};return c?c(b):i?h.jsx(i,{...b}):h.jsx("div",{...v})},ne={display:"flex",alignItems:"center"},re={flex:"1 1 auto",alignSelf:"stretch"},oe=({group:t,onClickTab:e,onStartDrag:n,rootRef:r,component:o,element:s,tabComponent:a,tabElement:i,onAddTab:c,onCloseTab:d,doubleClickToAdd:l})=>{const{isTabDragging:p,draggingTabId:g}=K(),v=u.useRef(null),b=u.useCallback(f=>{if(v.current=f,!!r){if(typeof r=="function"){r(f);return}try{r.current=f}catch{}}},[r]),I=u.useEffectEvent(f=>{const S=v.current??f.currentTarget;if(!S)return;const C=Array.from(S.querySelectorAll('[role="tab"]'));if(C.length===0)return;const G=j=>{const O=Math.max(0,Math.min(j,C.length-1)),N=C[O];N&&N.focus()},D=document.activeElement,T=D?C.indexOf(D):C.findIndex(j=>j.getAttribute("data-tab-id")===t.activeTabId);if(f.key==="ArrowRight"){f.preventDefault();const j=T>=0?T+1:0;G(j>=C.length?0:j);return}if(f.key==="ArrowLeft"){f.preventDefault();const j=T>=0?T-1:C.length-1;G(j<0?C.length-1:j);return}if(f.key==="Home"){f.preventDefault(),G(0);return}if(f.key==="End"){f.preventDefault(),G(C.length-1);return}if(f.key==="Enter"||f.key===" "){f.preventDefault();const O=(T>=0?C[T]:null)?.getAttribute("data-tab-id")??null;O&&e(O);return}if(f.key==="Delete"||f.key==="Backspace"){if(d){f.preventDefault();const O=(T>=0?C[T]:null)?.getAttribute("data-tab-id")??null;O&&d(t.id,O)}return}const R=(f.ctrlKey?1:0)+(f.metaKey?1:0)>0,_=typeof f.key=="string"?f.key.toLowerCase():"";if(R&&_==="t"){c&&(f.preventDefault(),c(t.id));return}});u.useEffect(()=>{const f=v.current;if(!f)return;const S=f.querySelector(`[role="tab"][data-tab-id="${t.activeTabId}"]`);if(S===document.activeElement)return;!f.contains(document.activeElement)&&S&&S.focus()},[t.activeTabId]);const w={style:ne,role:"tablist","data-tabbar":"true","data-group-id":t.id,"data-dragging":p?"true":"false",onKeyDown:I},y=E.useElementComponentWrapper({element:s,component:o}),m=()=>c?h.jsx("button",{type:"button","aria-label":"Add tab",onClick:()=>{c(t.id)},children:"+"}):null,x=u.useCallback(()=>{l&&c&&c(t.id)},[l,c,t.id]);return h.jsxs(y,{...w,ref:b,onDoubleClick:x,children:[t.tabs.map((f,S)=>h.jsx(ee,{groupId:t.id,tab:f,active:t.activeTabId===f.id,dragging:g===f.id,onClickTab:e,onStartDrag:n,onCloseTab:d,tabComponent:a,tabElement:i,onDoubleClick:C=>C.stopPropagation()},`${t.id}:${f.id}:${S}`)),h.jsx("span",{style:re}),m()]})},se=({id:t,TabBarComponent:e,PanelGroupComponent:n})=>{const{getGroup:r,getGroupContent:o,onClickTab:s,onAddTab:a,onCloseTab:i,onStartTabDrag:c,doubleClickToAdd:d,registerContentContainer:l}=Ft(),{setGroupEl:p,setTabbarEl:g,setContentEl:v}=ft(),b=u.useCallback(S=>{p(t,S)},[t,p]),I=u.useCallback(S=>{v(t,S),l(t,S)},[t,v,l]),w=u.useCallback(S=>{g(t,S)},[t,g]),y=r(t);if(!y)return null;const m=o(t),x=e??oe,f=n??(S=>h.jsx(gt,{...S}));return h.jsx(f,{group:y,tabbar:h.jsx(x,{rootRef:w,group:y,onClickTab:S=>s(t,S),onAddTab:a,onCloseTab:i,onStartDrag:(S,C,G)=>c(S,C,G),doubleClickToAdd:d}),content:m,groupRef:b,contentRef:I})},ie=(t,e)=>{const n=new Array(16);for(let r=0;r<4;r++)for(let o=0;o<4;o++)n[r*4+o]=t[0+o]*e[r*4+0]+t[4+o]*e[r*4+1]+t[8+o]*e[r*4+2]+t[12+o]*e[r*4+3];return n},U=t=>{if(t.length!==16)throw new Error("Matrix must have exactly 16 values");const e=Object.freeze([...t]),n=r=>{const o=ie(e,r);return U(o)};return Object.freeze({translate:(r=0,o=0,s=0)=>n([1,0,0,0,0,1,0,0,0,0,1,0,r,o,s,1]),translate3d:(r,o,s)=>n([1,0,0,0,0,1,0,0,0,0,1,0,r,o,s,1]),translateX:r=>n([1,0,0,0,0,1,0,0,0,0,1,0,r,0,0,1]),translateY:r=>n([1,0,0,0,0,1,0,0,0,0,1,0,0,r,0,1]),translateZ:r=>n([1,0,0,0,0,1,0,0,0,0,1,0,0,0,r,1]),scale:(r=1,o=1,s=1)=>n([r,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scale3d:(r,o,s)=>n([r,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scaleX:r=>n([r,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),scaleY:r=>n([1,0,0,0,0,r,0,0,0,0,1,0,0,0,0,1]),scaleZ:r=>n([1,0,0,0,0,1,0,0,0,0,r,0,0,0,0,1]),rotateX:r=>{const o=Math.cos(r),s=Math.sin(r);return n([1,0,0,0,0,o,s,0,0,-s,o,0,0,0,0,1])},rotateY:r=>{const o=Math.cos(r),s=Math.sin(r);return n([o,0,-s,0,0,1,0,0,s,0,o,0,0,0,0,1])},rotateZ:r=>{const o=Math.cos(r),s=Math.sin(r);return n([o,s,0,0,-s,o,0,0,0,0,1,0,0,0,0,1])},rotate:(r,o,s,a)=>{const i=Math.sqrt(o*o+s*s+a*a);if(i===0)return U(e);o/=i,s/=i,a/=i;const c=Math.cos(r),d=Math.sin(r),l=1-c;return n([l*o*o+c,l*o*s+d*a,l*o*a-d*s,0,l*o*s-d*a,l*s*s+c,l*s*a+d*o,0,l*o*a+d*s,l*s*a-d*o,l*a*a+c,0,0,0,0,1])},rotate3d:(r,o,s,a)=>{const i=Math.sqrt(r*r+o*o+s*s);if(i===0)return U(e);r/=i,o/=i,s/=i;const c=Math.cos(a),d=Math.sin(a),l=1-c;return n([l*r*r+c,l*r*o+d*s,l*r*s-d*o,0,l*r*o-d*s,l*o*o+c,l*o*s+d*r,0,l*r*s+d*o,l*o*s-d*r,l*s*s+c,0,0,0,0,1])},skew:(r=0,o=0)=>{const s=Math.tan(r),a=Math.tan(o);return n([1,a,0,0,s,1,0,0,0,0,1,0,0,0,0,1])},skewX:r=>{const o=Math.tan(r);return n([1,0,0,0,o,1,0,0,0,0,1,0,0,0,0,1])},skewY:r=>{const o=Math.tan(r);return n([1,o,0,0,0,1,0,0,0,0,1,0,0,0,0,1])},perspective:r=>{if(r===0)throw new Error("Perspective distance cannot be zero");return n([1,0,0,0,0,1,0,0,0,0,1,-1/r,0,0,0,1])},toCSS:()=>`matrix3d(${e.join(", ")})`,toArray:()=>e,toString:()=>[`[${e[0]}, ${e[4]}, ${e[8]}, ${e[12]}]`,`[${e[1]}, ${e[5]}, ${e[9]}, ${e[13]}]`,`[${e[2]}, ${e[6]}, ${e[10]}, ${e[14]}]`,`[${e[3]}, ${e[7]}, ${e[11]}, ${e[15]}]`].join(`
-`)})},ae=()=>U([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),ce={position:"fixed",inset:0,pointerEvents:"none",zIndex:P.DROP_SUGGEST_Z_INDEX},ue={position:"absolute",border:`${P.DROP_SUGGEST_BORDER_WIDTH} dashed ${P.DROP_SUGGEST_BORDER_COLOR}`,background:P.DROP_SUGGEST_BG_COLOR,borderRadius:P.DROP_SUGGEST_BORDER_RADIUS,transformOrigin:"top left"},L=(t,e)=>e<=0?0:E.clampNumber(t/e,0),le=(t,e,n)=>{const{width:r,height:o}=t,s=n/2,a=r>0?r:1,i=o>0?o:1,c={translateX:n,translateY:n,scaleX:L(E.clampNumber(r-n*2,0),a),scaleY:L(E.clampNumber(o-n*2,0),i)},d={translateX:n,translateY:n,scaleX:L(E.clampNumber(r/2-n*1.5,0),a),scaleY:L(E.clampNumber(o-n*2,0),i)},l={translateX:r/2+s,translateY:n,scaleX:L(E.clampNumber(r/2-n*1.5,0),a),scaleY:L(E.clampNumber(o-n*2,0),i)},p={translateX:n,translateY:n,scaleX:L(E.clampNumber(r-n*2,0),a),scaleY:L(E.clampNumber(o/2-n*1.5,0),i)},g={translateX:n,translateY:o/2+s,scaleX:L(E.clampNumber(r-n*2,0),a),scaleY:L(E.clampNumber(o/2-n*1.5,0),i)},v={center:c,left:d,right:l,top:p,bottom:g},{translateX:b,translateY:I,scaleX:w,scaleY:y}=v[e];return ae().translate(b,I,0).scale(w,y,1).toCSS()},de=(t,e)=>{const n=P.DROP_SUGGEST_PADDING_PX;return{...ue,left:t.left,top:t.top,width:t.width,height:t.height,transform:le(t,e,n)}},pe=({suggest:t})=>{if(!t)return null;const{rect:e,zone:n}=t,r=de(e,n);return h.jsx("div",{style:ce,children:h.jsx("div",{style:r})})},fe=typeof window<"u"&&typeof document<"u",ge=t=>{const[e,n]=u.useState(null),[r,o]=u.useState(null);return tt.useIsomorphicLayoutEffect(()=>{if(!fe||!t){n(null),o(null);return}const s=t.getBoundingClientRect();n({width:s.width,height:s.height}),o(t.outerHTML)},[t]),{html:r,size:e}},be={position:"fixed",inset:0,pointerEvents:"none",zIndex:P.TAB_DRAG_OVERLAY_Z_INDEX},he={position:"absolute",width:P.TAB_DRAG_INSERT_GUIDE_WIDTH,borderRadius:P.TAB_DRAG_INSERT_GUIDE_BORDER_RADIUS,background:P.TAB_DRAG_INSERT_GUIDE_COLOR,boxShadow:P.TAB_DRAG_INSERT_GUIDE_SHADOW},me=()=>{const{isTabDragging:t,draggingTabId:e,dragPointer:n,tabbarHover:r,draggingTabElement:o}=K(),{html:s,size:a}=ge(o),i=n!==null&&e!==null,c=u.useMemo(()=>{if(!(!i||!n))return{position:"absolute",left:n.x,top:n.y,transform:`translate(${P.TAB_DRAG_PREVIEW_OFFSET_X}, ${P.TAB_DRAG_PREVIEW_OFFSET_Y})`,pointerEvents:"none"}},[i,n]),d=u.useMemo(()=>{if(!(!c||!o))return a?{...c,width:a.width,height:a.height}:c},[c,o,a]),l=u.useMemo(()=>{if(r)return{...he,left:r.insertX,top:r.rect.top+4,height:Math.max(0,r.rect.height-8)}},[r]);return t?h.jsxs("div",{style:be,children:[h.jsx(u.Activity,{mode:d?"visible":"hidden",children:h.jsx("div",{style:d,children:h.jsx("div",{style:{width:"100%",height:"100%",pointerEvents:"none"},dangerouslySetInnerHTML:{__html:s??""}})})}),h.jsx(u.Activity,{mode:l?"visible":"hidden",children:h.jsx("div",{style:l})})]}):null},M=t=>t.type==="group",X=(t,e=[])=>{if(M(t))return[...e,t.groupId];const n=X(t.a,e);return X(t.b,n)},W=(t,e)=>e.reduce((n,r)=>M(n)?n:n[r],t),Y=(t,e,n)=>{if(e.length===0)return n;const[r,...o]=e;return M(t)?t:r==="a"?{...t,a:Y(t.a,o,n)}:{...t,b:Y(t.b,o,n)}},V=(t,e,n=[])=>{if(M(t))return t.groupId===e?{splitPath:null,side:null}:null;if(M(t.a)&&t.a.groupId===e)return{splitPath:n,side:"a"};if(M(t.b)&&t.b.groupId===e)return{splitPath:n,side:"b"};const r=V(t.a,e,[...n,"a"]);return r||V(t.b,e,[...n,"b"])},vt=(t,e,n,r)=>{const o=r(),s=V(t,e),a={type:"split",direction:n,ratio:.5,a:{type:"group",groupId:e},b:{type:"group",groupId:o}};if(!s||s.splitPath===null)return{tree:a,newGroupId:o};const i=s.splitPath,c=W(t,i);if(M(c))return{tree:a,newGroupId:o};const d=s.side==="a"?{...c,a}:{...c,b:a};return{tree:Y(t,i,d),newGroupId:o}},ve=(t,e)=>{const n=V(t,e);if(!n||n.splitPath===null)return{tree:t,survivorGroupId:e};const r=n.splitPath,o=W(t,r);if(M(o))return{tree:t,survivorGroupId:e};const s=n.side==="a"?o.b:o.a,a=Y(t,r,s),i=M(s)?s.groupId:X(s)[0]??null;return{tree:a,survivorGroupId:i}},Ie=(t,e,n)=>{const r=W(t,e);if(M(r))return t;const o={...r,ratio:E.clampNumber(n,.05,.95)};return Y(t,e,o)},J=t=>{if(Object.keys(t.groups).filter(o=>t.groups[o].tabIds.length===0).length===0)return t;const r=(o,s)=>{const a=o.groups[s];if(!a||a.tabs.length>0||Object.keys(o.groups).length<=1)return o;const{tree:c,survivorGroupId:d}=ve(o.tree,s),{[s]:l,...p}=o.groups,g=X(c),v=o.focusedGroupId===s?d??g[0]??null:o.focusedGroupId;return{...o,tree:c,groups:p,groupOrder:g,focusedGroupId:v}};return t.groupOrder.reduce((o,s)=>r(o,s),t)},we=t=>({id:t,tabIds:[],tabs:[],activeTabId:null}),st=(t,e,n,r)=>{const o={...t.groups},s=o[e];if(!s)throw new Error(`Group ${e} does not exist.`);const a={...t.panels,[n.id]:n},i=[...s.tabIds,n.id],c=r?n.id:s.activeTabId??n.id,d=i.map(p=>a[p]),l={...s,tabIds:i,tabs:d,activeTabId:c};return o[e]=l,{...t,panels:a,groups:o}},xe=(t,e,n)=>{const r={...t.groups},o=r[e];if(!o)throw new Error(`Group ${e} does not exist.`);const s=o.tabIds.filter(c=>c!==n),a=s.map(c=>t.panels[c]),i=o.activeTabId===n?s[0]??null:o.activeTabId;return r[e]={...o,tabIds:s,tabs:a,activeTabId:i},{...t,groups:r}},it=(t,e,n,r,o)=>{const s=t.groups[e],a=t.groups[n];if(!s||!a)throw new Error("moveTab: source or target group is missing.");const i={...t.groups},c=s.tabIds.filter(p=>p!==r),d=[...a.tabIds.filter(p=>p!==r),r],l=s.activeTabId===r?c[0]??null:s.activeTabId;return i[e]={...s,tabIds:c,tabs:c.map(p=>t.panels[p]),activeTabId:l},i[n]={...a,tabIds:d,tabs:d.map(p=>t.panels[p]),activeTabId:r},{...t,groups:i}},It=(t,e,n)=>{const r=t.groups[e];if(!r)throw new Error(`setActiveTab: group ${e} not found.`);if(!r.tabIds.some(s=>s===n))throw new Error(`setActiveTab: tab ${n} not found in group ${e}.`);const o={...t.groups,[e]:{...r,activeTabId:n}};return{...t,groups:o,focusedGroupId:e}},at=(t,e,n,r,o)=>{const s=t.groups[e];if(!s)throw new Error(`addTabToGroupAtIndex: group ${e} not found.`);const a={...t.panels,[n.id]:n},i=s.tabIds.slice(),c=Math.max(0,Math.min(r,i.length));i.splice(c,0,n.id);const d=i.map(g=>a[g]),l=o?n.id:s.activeTabId??n.id,p={...t.groups,[e]:{...s,tabIds:i,tabs:d,activeTabId:l}};return{...t,panels:a,groups:p}},B=(t,e)=>{if(!t.groups[e])throw new Error(`setFocusedGroup: group ${e} not found.`);return{...t,focusedGroupId:e}},ye=(t,e)=>{const n=e-1,r=t.groupOrder[n];return r?B(t,r):t},Se=t=>{const e=t.groupOrder,n=t.focusedGroupId;if(!n){const s=e[0];return s?B(t,s):t}const r=e.indexOf(n),o=e[(r+1)%e.length];return B(t,o)},Te=t=>{const e=t.groupOrder,n=t.focusedGroupId;if(!n){const s=e[e.length-1];return s?B(t,s):t}const r=e.indexOf(n),o=e[(r-1+e.length)%e.length];return B(t,o)},wt=(t,e,n,r)=>{const{tree:o,newGroupId:s}=vt(t.tree,e,n,r),a={...t.groups,[s]:we(s)},i=X(o);return{...t,tree:o,groups:a,groupOrder:i,focusedGroupId:s}},Ee=t=>{const n={type:"group",groupId:"g_1"},r=Object.fromEntries(t.map(i=>[i.id,i])),s={g_1:{id:"g_1",tabIds:t.map(i=>i.id),tabs:t,activeTabId:t[0]?.id??null}};return{tree:n,panels:r,groups:s,groupOrder:["g_1"],focusedGroupId:"g_1"}},Ge=u.createContext(null),Ce=({value:t,children:e})=>h.jsx(Ge.Provider,{value:t,children:e}),xt=u.createContext(null),Re=()=>{const t=u.useContext(xt);if(!t)throw new Error("useTree must be used within TreeProvider");return t},Pe=({value:t,children:e})=>h.jsx(xt.Provider,{value:t,children:e}),De=u.createContext(null),je=({value:t,children:e})=>h.jsx(De.Provider,{value:t,children:e}),$=t=>{const e=E.toFiniteNumberOr(t,Number.POSITIVE_INFINITY);return E.clampNumber(e,1)},Ae=t=>typeof t=="object"&&t!==null,ke=t=>Ae(t)?"rows"in t?!0:"cols"in t:!1,yt=t=>{if(!t)return{rows:Number.POSITIVE_INFINITY,cols:Number.POSITIVE_INFINITY};if(typeof t=="number"){const n=$(t);return{rows:n,cols:n}}if(ke(t))return{rows:$(t.rows),cols:$(t.cols)};const e=t;return{rows:$(e.maxHorizontal),cols:$(e.maxVertical)}},Q=t=>{if(M(t))return{horizontal:1,vertical:1};const e=Q(t.a),n=Q(t.b);return t.direction==="horizontal"?{horizontal:e.horizontal+n.horizontal,vertical:Math.max(e.vertical,n.vertical)}:{horizontal:Math.max(e.horizontal,n.horizontal),vertical:e.vertical+n.vertical}},_e=(t,e,n)=>{const{tree:r}=vt(t,e,n,()=>"__preview__");return r},et=(t,e,n,r)=>{if(!Number.isFinite(r.rows)&&!Number.isFinite(r.cols))return!0;const o=_e(t,e,n),s=Q(o);return!(s.horizontal>r.rows||s.vertical>r.cols)},St={splitFocused:k("panelState/splitFocused",t=>({direction:t})),focusGroupIndex:k("panelState/focusGroupIndex",t=>({index1Based:t})),focusNextGroup:k("panelState/focusNextGroup"),focusPrevGroup:k("panelState/focusPrevGroup"),setActiveTab:k("panelState/setActiveTab",(t,e)=>({groupId:t,tabId:e})),addTab:k("panelState/addTab",t=>t),addNewTab:k("panelState/addNewTab",t=>t),removeTab:k("panelState/removeTab",(t,e)=>({groupId:t,tabId:e})),contentDrop:k("panelState/contentDrop",t=>t),tabDrop:k("panelState/tabDrop",t=>t),adjustSplitRatio:k("panelState/adjustSplitRatio",t=>t)},Me=(t,e,n)=>{const r=t.groups[e.fromGroupId],o=t.groups[e.targetGroupId];if(!r||!o||!r.tabs.find(p=>p.id===e.tabId))return t;if(e.zone==="center"&&e.fromGroupId===e.targetGroupId)return It(t,e.fromGroupId,e.tabId);if(e.zone==="center"){const p=it(t,e.fromGroupId,e.targetGroupId,e.tabId);return B(p,e.targetGroupId)}const a=e.zone==="left"||e.zone==="right"?"vertical":"horizontal";if(!et(t.tree,e.targetGroupId,a,n.splitLimits))return t;const i=n.createGroupId(),c=wt(t,e.targetGroupId,a,()=>i),d=e.zone==="left"||e.zone==="top"?e.targetGroupId:i,l=it(c,e.fromGroupId,d,e.tabId);return B(l,d)},Oe=(t,e)=>{const n=t.groups[e.fromGroupId],r=t.groups[e.targetGroupId];if(!n||!r||!t.panels[e.tabId])return t;if(e.fromGroupId===e.targetGroupId){const g=n.tabIds.filter(y=>y!==e.tabId),v=Math.max(0,Math.min(e.targetIndex,g.length)),b=g.slice(0,v).concat([e.tabId],g.slice(v)),I=b.map(y=>t.panels[y]).filter(Boolean),w={...t.groups,[e.fromGroupId]:{...n,tabIds:b,tabs:I}};return{...t,groups:w}}const s={...t.groups},a=n.tabIds.filter(g=>g!==e.tabId),i=a.map(g=>t.panels[g]);s[e.fromGroupId]={...n,tabIds:a,tabs:i,activeTabId:n.activeTabId===e.tabId?i[0]?.id??null:n.activeTabId};const c=r.tabIds.filter(g=>g!==e.tabId),d=Math.max(0,Math.min(e.targetIndex,c.length)),l=c.slice(0,d).concat([e.tabId],c.slice(d)),p=l.map(g=>t.panels[g]).filter(Boolean);return s[e.targetGroupId]={...r,tabIds:l,tabs:p,activeTabId:e.tabId},{...t,groups:s,focusedGroupId:e.targetGroupId}},Ne=bt(St,{splitFocused:(t,e,n)=>{const r=t.focusedGroupId??t.groupOrder[0]??null;return!r||!et(t.tree,r,e.payload.direction,n.splitLimits)?t:wt(t,r,e.payload.direction,n.createGroupId)},focusGroupIndex:(t,e)=>ye(t,e.payload.index1Based),focusNextGroup:t=>Se(t),focusPrevGroup:t=>Te(t),setActiveTab:(t,e)=>It(t,e.payload.groupId,e.payload.tabId),addTab:(t,e)=>{const{groupId:n,tab:r,index:o,makeActive:s}=e.payload;return typeof o=="number"?at(t,n,r,o,s??!0):st(t,n,r,s??!0)},addNewTab:(t,e,n)=>{if(!n.createPanelId)throw new Error("addNewTab requires PanelSystemProvider.createPanelId");const o={id:n.createPanelId(),title:e.payload.title,render:()=>e.payload.title},{groupId:s,index:a,makeActive:i}=e.payload;return typeof a=="number"?at(t,s,o,a,i??!0):st(t,s,o,i??!0)},removeTab:(t,e)=>xe(t,e.payload.groupId,e.payload.tabId),contentDrop:(t,e,n)=>Me(t,e.payload,n),tabDrop:(t,e)=>Oe(t,e.payload),adjustSplitRatio:(t,e)=>{const n=W(t.tree,e.payload.path);if(M(n))return t;const r=Ie(t.tree,e.payload.path,n.ratio+e.payload.deltaRatio);return{...t,tree:r}}}),ct=(t,e,n)=>{const r=Ne[e.type];if(!r)return t;const o=r(t,e,n);return J(o)},Tt=u.createContext(null),z=()=>{const t=u.useContext(Tt);if(!t)throw new Error("usePanelSystem must be used within PanelSystemProvider");return t},Le=({initialState:t,createGroupId:e,createPanelId:n,state:r,onStateChange:o,splitLimits:s,children:a})=>{const i=u.useMemo(()=>J(t),[t]),c=u.useMemo(()=>yt(s),[s]),d=u.useRef({createGroupId:e,splitLimits:c,createPanelId:n});d.current.createGroupId=e,d.current.splitLimits=c,d.current.createPanelId=n;const[l,p]=u.useReducer((S,C)=>ct(S,C,d.current),i),g=u.useMemo(()=>r?J(r):l,[r,l]),v=u.useRef(g);v.current=g;const b=r!==void 0,I=u.useCallback(S=>{if(b){const C=ct(v.current,S,d.current);o?.(C);return}p(S)},[b,o,p]),w=u.useMemo(()=>Zt(St,I),[I]),y=u.useMemo(()=>({setActiveTab:w.setActiveTab,tabDrop:w.tabDrop}),[w]),m=u.useMemo(()=>({adjustSplitRatio:w.adjustSplitRatio}),[w]),x=u.useMemo(()=>({focusGroupIndex:w.focusGroupIndex,focusNextGroup:w.focusNextGroup,focusPrevGroup:w.focusPrevGroup}),[w]),f=u.useMemo(()=>({state:g,dispatch:I,actions:w}),[g,I,w]);return h.jsx(Tt.Provider,{value:f,children:h.jsx(Ce,{value:y,children:h.jsx(Pe,{value:m,children:h.jsx(je,{value:x,children:a})})})})},Be=()=>{const{actions:t}=z();return u.useMemo(()=>({splitFocused:e=>{t.splitFocused(e)},focusGroupIndex:e=>{t.focusGroupIndex(e)},focusNextGroup:()=>{t.focusNextGroup()},focusPrevGroup:()=>{t.focusPrevGroup()},closeFocusedGroup:()=>{}}),[t])},He=()=>{const{actions:t}=z(),e=u.useCallback(({fromGroupId:r,tabId:o,targetGroupId:s,zone:a})=>{t.contentDrop({fromGroupId:r,tabId:o,targetGroupId:s,zone:a})},[t]),n=u.useCallback(({fromGroupId:r,tabId:o,targetGroupId:s,targetIndex:a})=>{t.tabDrop({fromGroupId:r,tabId:o,targetGroupId:s,targetIndex:a})},[t]);return{onCommitContentDrop:e,onCommitTabDrop:n}},ze=()=>{const t=Ot(),e=Be();return u.useEffect(()=>{Bt(t,e)},[t,e]),null},Et=u.createContext(null),$e=()=>{const t=u.useContext(Et);if(!t)throw new Error("useContentRegistry must be used within ContentRegistryProvider");return t},Fe=t=>{const e=document.createElement("div");return e.setAttribute("data-panel-wrapper",t),e.style.display="contents",e},Xe=(t,e,n)=>{const[r]=u.useState(()=>Fe(t));return tt.useIsomorphicLayoutEffect(()=>(r.style.display=n?"contents":"none",e&&r.parentElement!==e&&e.appendChild(r),()=>{r.parentElement?.removeChild(r)}),[r,e,n]),r},Gt=u.memo(({panelId:t,content:e,placement:n,containerElement:r})=>{const o=n?.isActive??!1,s=Xe(t,r,o);return Pt.createPortal(h.jsx(u.Activity,{mode:o?"visible":"hidden",children:e}),s)});Gt.displayName="PanelContentHost";const Ye=({children:t,panels:e,placements:n})=>{const[r,o]=u.useState(new Map),s=u.useCallback((g,v)=>{o(b=>{const I=new Map(b);return v?I.set(g,v):I.delete(g),I})},[]),a=u.useMemo(()=>({registerContentContainer:s}),[s]),i=u.useRef(e);i.current=e;const c=u.useCallback(g=>{const v=i.current[g];return v?v.render(v.id):null},[]),d=u.useMemo(()=>Object.keys(e),[e]),{getCachedContent:l}=Dt.useContentCache({resolveContent:c,validIds:d}),p=Object.keys(e);return h.jsxs(Et.Provider,{value:a,children:[t,p.map(g=>{if(!e[g])return null;const b=n[g]??null,I=b?r.get(b.groupId)??null:null,w=l(g);return h.jsx(Gt,{panelId:g,content:w,placement:b,containerElement:I},g)})]})},qe=({children:t,emptyContentComponent:e,doubleClickToAdd:n})=>{const r=K(),{state:o,actions:s}=z(),{registerContentContainer:a}=$e(),i=u.useCallback(()=>u.createElement("div",{style:{color:"#888",fontSize:12,padding:12}},"No tabs"),[]),c=e??i,d=u.useCallback(y=>{const m=o.groups[y];if(!m)return null;const x=m.tabIds.map(f=>o.panels[f]).filter(Boolean);return{...m,tabs:x}},[o.groups,o.panels]),l=u.useCallback(y=>{const m=o.groups[y];return!m||m.tabIds.length===0?h.jsx(c,{}):null},[o.groups,c]),p=u.useCallback((y,m)=>{s.setActiveTab(y,m)},[s]),g=u.useCallback(y=>{s.addNewTab({groupId:y,title:"New Tab",makeActive:!0})},[s]),v=u.useCallback((y,m)=>{s.removeTab(y,m)},[s]),b=u.useCallback((y,m,x)=>{s.setActiveTab(m,y),r.onStartTabDrag(y,m,x)},[s,r]),I=u.useCallback((y,m)=>{const x=o.groups[y];!x||!x.activeTabId||r.onStartContentDrag(y,x.activeTabId,m)},[o.groups,r]),w=u.useMemo(()=>({getGroup:d,getGroupContent:l,onClickTab:p,onAddTab:g,onCloseTab:v,onStartTabDrag:b,onStartContentDrag:I,doubleClickToAdd:n,registerContentContainer:a}),[d,l,p,g,v,b,I,n,a]);return h.jsx(Xt,{value:w,children:t})},Ue=({children:t,emptyContentComponent:e,doubleClickToAdd:n})=>{const{state:r}=z(),o=u.useMemo(()=>{const s={};for(const[a,i]of Object.entries(r.groups))for(const c of i.tabIds)s[c]={groupId:a,isActive:c===i.activeTabId};return s},[r.groups]);return h.jsx(Ye,{panels:r.panels,placements:o,children:h.jsx(qe,{emptyContentComponent:e,doubleClickToAdd:n,children:t})})},F=(t,e,n,r)=>{if(M(t))return r;const o=t.direction,s=o==="vertical"?n.x+n.w*t.ratio:n.y+n.h*t.ratio;if(r.push({path:e,direction:o,parentRect:n,linePos:s}),o==="vertical"){const c=n.w*t.ratio,d=n.w-c;return F(t.a,[...e,"a"],{x:n.x,y:n.y,w:c,h:n.h},r),F(t.b,[...e,"b"],{x:n.x+c,y:n.y,w:d,h:n.h},r),r}const a=n.h*t.ratio,i=n.h-a;return F(t.a,[...e,"a"],{x:n.x,y:n.y,w:n.w,h:a},r),F(t.b,[...e,"b"],{x:n.x,y:n.y+a,w:n.w,h:i},r),r},Ve=({containerRef:t})=>{const{state:e}=z(),{adjustSplitRatio:n}=Re(),r=u.useMemo(()=>F(e.tree,[],{x:0,y:0,w:100,h:100},[]),[e.tree]),[o,s]=u.useState(null);if(tt.useIsomorphicLayoutEffect(()=>{const i=t.current;if(!i)return;const c=()=>{const v=i.getBoundingClientRect();s({left:v.left,top:v.top,width:v.width,height:v.height})};c();function d(){try{const v=window.ResizeObserver;return typeof v=="function"?v:null}catch{return null}}const l=d(),p=l?new l(()=>c()):null;p&&p.observe(i);const g=()=>c();return window.addEventListener("scroll",g,!0),()=>{window.removeEventListener("scroll",g,!0),p&&p.disconnect()}},[t,e.tree]),!o)return null;const a=(i,c)=>{const d={left:o.left+o.width*i.parentRect.x/100,top:o.top+o.height*i.parentRect.y/100,width:o.width*i.parentRect.w/100,height:o.height*i.parentRect.h/100},l=P.SPLIT_HANDLE_THICKNESS;if(i.direction==="vertical"){const b=d.left+d.width*(i.linePos-i.parentRect.x)/i.parentRect.w,I={position:"fixed",left:`calc(${Math.round(b)}px - ${l} / 2)`,top:Math.round(d.top),width:l,height:Math.round(d.height),cursor:"col-resize",pointerEvents:"auto"},w=y=>{const m=o.width*i.parentRect.w/100,x=m===0?0:y/m;n({path:i.path,deltaRatio:x})};return h.jsx("div",{style:I,children:h.jsx(E.ResizeHandle,{direction:"vertical",onResize:w})},`split-${c}`)}const p=d.top+d.height*(i.linePos-i.parentRect.y)/i.parentRect.h,g={position:"fixed",left:Math.round(d.left),top:`calc(${Math.round(p)}px - ${l} / 2)`,width:Math.round(d.width),height:l,cursor:"row-resize",pointerEvents:"auto"},v=b=>{const I=o.height*i.parentRect.h/100,w=I===0?0:b/I;n({path:i.path,deltaRatio:w})};return h.jsx("div",{style:g,children:h.jsx(E.ResizeHandle,{direction:"horizontal",onResize:v})},`split-${c}`)};return h.jsx("div",{style:{position:"fixed",inset:0,pointerEvents:"none"},children:r.map((i,c)=>a(i,c))})},Ke={position:"relative",display:"flex",width:"100%",height:"100%"},We=({state:t,layoutMode:e,gridTracksInteractive:n,view:r,tabBarComponent:o,panelGroupComponent:s})=>{const a=c=>{if(r){const d=r;return h.jsx(d,{groupId:c})}return h.jsx(se,{id:c,TabBarComponent:o,PanelGroupComponent:s})};if(e==="grid"){const c=$t(t,a,!!n);return h.jsx(E.GridLayout,{config:c.config,layers:c.layers})}const i=zt(t,a);return h.jsx(E.GridLayout,{config:i.config,layers:i.layers})},Ze=({containerRef:t,layoutMode:e,gridTracksInteractive:n,dragThresholdPx:r,view:o,style:s,className:a,tabBarComponent:i,panelGroupComponent:c,splitLimits:d,emptyContentComponent:l,doubleClickToAdd:p})=>{const{state:g}=z(),{onCommitContentDrop:v,onCommitTabDrop:b}=He(),I=u.useMemo(()=>({...Ke,...s}),[s]),w=u.useCallback(({targetGroupId:y,zone:m})=>{if(m==="center")return!0;const x=m==="left"||m==="right"?"vertical":"horizontal";return et(g.tree,y,x,d)},[g.tree,d]);return h.jsx(Yt,{children:h.jsxs(te,{containerRef:t,dragThresholdPx:r,onCommitContentDrop:v,onCommitTabDrop:b,isContentZoneAllowed:w,children:[h.jsx(Ue,{emptyContentComponent:l,doubleClickToAdd:p,children:h.jsx("div",{ref:t,className:a,style:I,children:h.jsx(We,{state:g,layoutMode:e,gridTracksInteractive:n,view:o,tabBarComponent:i,panelGroupComponent:c})})}),h.jsx(Ve,{containerRef:t}),h.jsx(Je,{})]})})},Je=()=>{const t=K();return h.jsxs(h.Fragment,{children:[h.jsx(pe,{suggest:t.suggest}),h.jsx(me,{})]})},Qe=({initialState:t,createGroupId:e,createPanelId:n,layoutMode:r,gridTracksInteractive:o,dragThresholdPx:s,view:a,emptyContentComponent:i,state:c,onStateChange:d,className:l,style:p,tabBarComponent:g,panelGroupComponent:v,splitLimits:b,doubleClickToAdd:I})=>{if(!t)throw new Error("PanelSystem requires initialState.");if(!e)throw new Error("PanelSystem requires explicit createGroupId function.");if(!r)throw new Error("PanelSystem requires explicit layoutMode ('absolute' | 'grid').");if(r==="grid"&&o===void 0)throw new Error("PanelSystem(layoutMode='grid') requires explicit 'gridTracksInteractive' flag.");if(s===void 0)throw new Error("PanelSystem requires explicit 'dragThresholdPx' value.");const w=u.useRef(null),y=u.useMemo(()=>yt(b),[b]);return h.jsx(Le,{initialState:t,createGroupId:e,createPanelId:n,state:c,onStateChange:d,splitLimits:b,children:h.jsxs(Lt,{children:[h.jsx(ze,{}),h.jsx(Ze,{containerRef:w,layoutMode:r,gridTracksInteractive:o,dragThresholdPx:s,view:a,style:p,className:l,tabBarComponent:g,panelGroupComponent:v,splitLimits:y,emptyContentComponent:i,doubleClickToAdd:I})]})})};exports.Drawer=E.Drawer;exports.DrawerLayers=E.DrawerLayers;exports.FloatingWindow=E.FloatingWindow;exports.GridLayout=E.GridLayout;exports.ResizeHandle=E.ResizeHandle;exports.runTransition=E.runTransition;exports.useTransitionState=E.useTransitionState;exports.CSS_VAR_PREFIX=P.CSS_VAR_PREFIX;exports.HorizontalDivider=kt;exports.PanelSystem=Qe;exports.buildInitialState=Ee;exports.useFloatingState=Mt;exports.useLayerDragHandle=_t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./GridLayout-B4VRsC0r.cjs"),t=require("./FloatingWindow-TCDNY5gE.cjs"),s=require("./HorizontalDivider-B5Z-KZLk.cjs"),u=require("./ResizeHandle-CScipO5l.cjs"),l=require("react"),c=require("./useFloatingState-C4kRaW_R.cjs"),d=require("./styles-qf6ptVLD.cjs"),i=require("./PanelSystem-Bs8bQwQF.cjs");function y(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,a.get?a:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const S=y(l),g=()=>{const{layerId:e}=t.useLayerInstance(),{getLayerHandleProps:r}=t.useGridLayoutContext();return S.useMemo(()=>r(e),[r,e])};exports.GridLayout=o.GridLayout;exports.Drawer=t.Drawer;exports.DrawerLayers=t.DrawerLayers;exports.FloatingWindow=t.FloatingWindow;exports.runTransition=t.runTransition;exports.useTransitionState=t.useTransitionState;exports.HorizontalDivider=s.HorizontalDivider;exports.ResizeHandle=u.ResizeHandle;exports.useFloatingState=c.useFloatingState;exports.CSS_VAR_PREFIX=d.CSS_VAR_PREFIX;exports.PanelSystem=i.PanelSystem;exports.buildInitialState=i.buildInitialState;exports.useLayerDragHandle=g;
 //# sourceMappingURL=index.cjs.map