react-panel-layout 0.5.2 → 0.6.0

package/src/utils/dialogUtils.ts

@@ -0,0 +1,43 @@
+/**
+ * @file Dialog positioning utilities
+ */
+
+export type ViewportInfo = {
+  width: number;
+  height: number;
+};
+
+/**
+ * Get viewport dimensions
+ */
+export const getViewportInfo = (): ViewportInfo => {
+  if (typeof window === "undefined") {
+    return { width: 0, height: 0 };
+  }
+
+  return {
+    width: window.innerWidth,
+    height: window.innerHeight,
+  };
+};
+
+/**
+ * Calculate context menu position to keep it within viewport
+ */
+export const calculateContextMenuPosition = (
+  anchorX: number,
+  anchorY: number,
+  menuWidth: number,
+  menuHeight: number,
+  viewport: ViewportInfo,
+): { x: number; y: number } => {
+  // Adjust horizontal position if menu would overflow
+  const x =
+    anchorX + menuWidth > viewport.width ? Math.max(0, viewport.width - menuWidth) : anchorX;
+
+  // Adjust vertical position if menu would overflow
+  const y =
+    anchorY + menuHeight > viewport.height ? Math.max(0, viewport.height - menuHeight) : anchorY;
+
+  return { x, y };
+};

package/src/utils/math.ts

@@ -0,0 +1,18 @@
+/**
+ * @file Primitive math helpers shared across modules.
+ */
+
+export const clampNumber = (
+  value: number,
+  min: number = Number.NEGATIVE_INFINITY,
+  max: number = Number.POSITIVE_INFINITY,
+): number => {
+  return Math.min(Math.max(value, min), max);
+};
+
+export const toFiniteNumberOr = (value: number | undefined, fallback: number): number => {
+  if (typeof value !== "number" || !Number.isFinite(value)) {
+    return fallback;
+  }
+  return value;
+};

package/src/utils/polyfills/createDialogPolyfill.ts

@@ -0,0 +1,18 @@
+/**
+ * @file Dialog polyfill for browsers that don't support <dialog> element natively
+ */
+
+/**
+ * Ensure dialog polyfill is loaded if needed
+ * This is a placeholder - in production you might want to use a real polyfill like dialog-polyfill
+ */
+export const ensureDialogPolyfill = (): void => {
+  // Check if browser supports <dialog> element
+  if (typeof window === "undefined") {
+    return;
+  }
+
+  // Modern browsers already support dialog element
+  // If you need to support older browsers, you can load a polyfill here
+  // For now, we assume modern browser support
+};

package/src/utils/typedActions.ts

@@ -0,0 +1,103 @@
+/* eslint-disable @typescript-eslint/no-explicit-any -- Generic action helpers rely on 'any' to avoid over-constraining payload creators */
+/**
+ * @file Utilities for defining typed action creators and reducer handler maps without external dependencies.
+ */
+
+export type AnyAction = { type: string };
+
+export type AnyActionCreator = {
+  (...args: any[]): AnyAction;
+  readonly type: string;
+};
+
+type PayloadCreator = (...args: any[]) => any;
+
+type ActionFromPayload<Type extends string, Creator extends PayloadCreator> =
+  ReturnType<Creator> extends undefined | void
+    ? { type: Type }
+    : { type: Type; payload: Exclude<ReturnType<Creator>, undefined> };
+
+/**
+ * Creates a typed action creator with an attached literal `type` property.
+ */
+export function createAction<Type extends string>(type: Type): (() => { type: Type }) & { readonly type: Type };
+export function createAction<Type extends string, Creator extends PayloadCreator>(
+  type: Type,
+  payloadCreator: Creator,
+): ((...args: Parameters<Creator>) => ActionFromPayload<Type, Creator>) & { readonly type: Type };
+export function createAction<Type extends string, Creator extends PayloadCreator>(
+  type: Type,
+  payloadCreator?: Creator,
+) {
+  if (!payloadCreator) {
+    const actionCreator = (() => ({ type }) as const) as (() => { type: Type }) & { readonly type: Type };
+    Object.defineProperty(actionCreator, "type", {
+      value: type,
+      writable: false,
+      enumerable: true,
+    });
+    return actionCreator;
+  }
+  const actionCreator = ((...args: Parameters<Creator>) => {
+    const payload = payloadCreator(...args);
+    if (typeof payload === "undefined") {
+      return { type } as const;
+    }
+    return { type, payload } as const;
+  }) as ((...args: Parameters<Creator>) => ActionFromPayload<Type, Creator>) & { readonly type: Type };
+  Object.defineProperty(actionCreator, "type", {
+    value: type,
+    writable: false,
+    enumerable: true,
+  });
+  return actionCreator;
+}
+
+export type ActionCreatorsMap = Record<string, AnyActionCreator>;
+
+export type ActionUnion<Creators extends ActionCreatorsMap> = ReturnType<Creators[keyof Creators]>;
+
+export type CaseReducer<State, Action extends AnyAction, Extra> = (state: State, action: Action, extra: Extra) => State;
+
+export type BoundActionCreators<Creators extends ActionCreatorsMap> = {
+  [Key in keyof Creators]: (...args: Parameters<Creators[Key]>) => ReturnType<Creators[Key]>;
+};
+
+export const bindActionCreators = <Creators extends ActionCreatorsMap>(
+  creators: Creators,
+  dispatch: (action: ActionUnion<Creators>) => unknown,
+): BoundActionCreators<Creators> => {
+  const bound = {} as BoundActionCreators<Creators>;
+  (Object.keys(creators) as Array<keyof Creators>).forEach((key) => {
+    const creator = creators[key];
+    bound[key] = ((...args: Parameters<typeof creator>) => {
+      const action = creator(...args);
+      dispatch(action as ActionUnion<Creators>);
+      return action;
+    }) as BoundActionCreators<Creators>[keyof Creators];
+  });
+  return bound;
+};
+
+export const createActionHandlerMap = <State, Creators extends ActionCreatorsMap, Extra = undefined>(
+  creators: Creators,
+  handlers: {
+    [Key in keyof Creators]?: CaseReducer<State, ReturnType<Creators[Key]>, Extra>;
+  },
+): Record<string, CaseReducer<State, ReturnType<Creators[keyof Creators]>, Extra>> => {
+  const map: Record<string, CaseReducer<State, ReturnType<Creators[keyof Creators]>, Extra>> = {};
+
+  (Object.keys(handlers) as Array<keyof Creators>).forEach((key) => {
+    const handler = handlers[key];
+    if (!handler) {
+      return;
+    }
+    const creator = creators[key];
+    if (!creator) {
+      throw new Error(`Missing action creator for key "${String(key)}"`);
+    }
+    map[creator.type] = handler as CaseReducer<State, ReturnType<Creators[keyof Creators]>, Extra>;
+  });
+
+  return map;
+};

package/src/vite-env.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @file Vite environment type declarations
+ */
+/// <reference types="vite/client" />
+
+declare const __APP_VERSION__: string;

package/src/window/index.ts

@@ -0,0 +1,67 @@
+/**
+ * @file Window entry point - Floating window and drawer components
+ * @packageDocumentation
+ *
+ * This is a subpath export entry point for `react-panel-layout/window`.
+ *
+ * ## Overview
+ * Window provides floating panels, drawers, and dialog overlays for modal
+ * and non-modal UI patterns. Supports draggable windows, slide-in drawers,
+ * and popup portals.
+ *
+ * ## Installation
+ * ```ts
+ * import { Drawer, FloatingWindow, useDrawerState } from "react-panel-layout/window";
+ * ```
+ *
+ * ## Drawer Usage
+ * ```tsx
+ * function App() {
+ *   const [isOpen, setIsOpen] = useState(false);
+ *
+ *   return (
+ *     <>
+ *       <button onClick={() => setIsOpen(true)}>Open Drawer</button>
+ *       <Drawer
+ *         id="settings"
+ *         config={{ anchor: 'right', header: { title: 'Settings' } }}
+ *         isOpen={isOpen}
+ *         onClose={() => setIsOpen(false)}
+ *       >
+ *         <SettingsPanel />
+ *       </Drawer>
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * ## Floating Window Usage
+ * ```tsx
+ * <FloatingWindow
+ *   id="inspector"
+ *   config={{
+ *     draggable: true,
+ *     chrome: true,
+ *     header: { title: 'Inspector', showCloseButton: true },
+ *   }}
+ *   onClose={handleClose}
+ * >
+ *   <InspectorContent />
+ * </FloatingWindow>
+ * ```
+ */
+
+// Components
+export { FloatingWindow } from "../components/window/FloatingWindow.js";
+export { Drawer } from "../components/window/Drawer.js";
+export { DrawerLayers } from "../components/window/DrawerLayers.js";
+export { DialogOverlay } from "../components/window/DialogOverlay.js";
+export { PopupLayerPortal } from "../components/window/PopupLayerPortal.js";
+
+// Hooks
+export { useFloatingState } from "../modules/window/useFloatingState.js";
+export { useDrawerState } from "../modules/window/useDrawerState.js";
+
+// Types
+export type { FloatingWindowProps } from "../components/window/FloatingWindow.js";
+export type { DrawerProps } from "../components/window/Drawer.js";

package/dist/GridLayout-BQQ63eA1.cjs

@@ -1,2 +0,0 @@
-"use strict";const g=require("react/jsx-runtime"),Wt=require("react"),_=require("./FloatingPanelFrame-D9Cp2al1.cjs"),v=require("./styles-PsqGOEJP.cjs"),xt=require("./usePivot-7ctin_P_.cjs"),Bt=require("react-dom"),It=require("./useIsomorphicLayoutEffect-DGRNF4Lf.cjs");function Xt(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,o.get?o:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const i=Xt(Wt),Vt=()=>{const t=new Map;return e=>{if(!e)return;const n=t.get(e);if(n!==void 0)return n;const o=t.size;return t.set(e,o),o}},Zt=Vt(),q=new Map,Kt=t=>{const e=`ovs-threshold:${t.threshold}-rootMargin:${t.rootMargin}-root:${Zt(t.root)}`;if(q.has(e))return q.get(e);const n=new class{#t=new Map;#e=new IntersectionObserver(o=>{o.forEach(r=>{const s=this.#t.get(r.target);s&&s(r)})},t);observe(o,r){return this.#t.set(o,r),this.#e.observe(o),()=>{this.#t.delete(o),this.#e.unobserve(o)}}};return q.set(e,n),n},lt=Object.freeze({x:0,y:0,width:0,height:0,top:0,right:0,bottom:0,left:0});function Ut(t,{threshold:e=0,rootMargin:n="0px",root:o=null}){const[r,s]=i.useState(null);return i.useEffect(()=>{const u=t.current;return u?Kt({threshold:e,rootMargin:n,root:o}).observe(u,a=>{s({isIntersecting:a.isIntersecting,boundingClientRect:a.boundingClientRect,intersectionRatio:a.intersectionRatio,intersectionRect:a.intersectionRect,rootBounds:a.rootBounds,target:a.target,time:a.time})}):void 0},[t,e,n,o]),i.useMemo(()=>({isIntersecting:r?.isIntersecting??!1,boundingClientRect:r?.boundingClientRect??lt,intersectionRatio:r?.intersectionRatio??0,intersectionRect:r?.intersectionRect??lt,rootBounds:r?.rootBounds??null,target:r?.target??t.current,time:r?.time??0}),[r,t])}const dt={position:"fixed",inset:0,background:v.COLOR_DRAWER_BACKDROP},qt={willChange:"transform"},ft={left:{top:0,bottom:0,left:0,transform:"translateX(-100%)"},right:{top:0,bottom:0,right:0,transform:"translateX(100%)"},top:{top:0,left:0,right:0,transform:"translateY(-100%)"},bottom:{bottom:0,left:0,right:0,transform:"translateY(100%)"}},Jt=(t,e,n)=>{if(t==="none")return;const o=e??v.DRAWER_TRANSITION_DURATION,r=n??v.DRAWER_TRANSITION_EASING;return`transform ${o} ${r}`},Qt=(t,e)=>t?e:!1,te=({chrome:t,frameStyle:e,header:n,dismissible:o,onClose:r,children:s})=>t?g.jsxs(_.FloatingPanelFrame,{style:e,children:[g.jsx(ee,{header:n,dismissible:o,onClose:r}),g.jsx(_.FloatingPanelContent,{style:{padding:v.DRAWER_CONTENT_PADDING,flex:1,display:"flex",flexDirection:"column"},children:s})]}):g.jsx(g.Fragment,{children:s}),ee=({header:t,dismissible:e,onClose:n})=>{if(!t)return null;const o=t.showCloseButton??!0,r=Qt(e,o);return g.jsx(i.Activity,{mode:t?"visible":"hidden",children:g.jsxs(_.FloatingPanelHeader,{style:{padding:`${v.DRAWER_HEADER_PADDING_Y} ${v.DRAWER_HEADER_PADDING_X}`,gap:v.DRAWER_HEADER_GAP},children:[g.jsx(i.Activity,{mode:t?"visible":"hidden",children:g.jsx(_.FloatingPanelTitle,{children:t.title})}),g.jsx(i.Activity,{mode:r?"visible":"hidden",children:g.jsx(_.FloatingPanelCloseButton,{onClick:n,"aria-label":"Close drawer",style:{marginLeft:"auto"}})})]})})},Pt=({id:t,config:e,isOpen:n,onClose:o,children:r,zIndex:s,width:u,height:c,position:a})=>{const{dismissible:l=!0,header:p,chrome:f=!0,inline:m=!1,transitionMode:w="css",transitionDuration:C,transitionEasing:R}=e,L=i.useCallback((T,x)=>T||(x?x.left!==void 0?"left":x.right!==void 0?"right":x.top!==void 0?"top":x.bottom!==void 0?"bottom":"right":"right"),[])(e.anchor,a),M={left:"translateX(0)",right:"translateX(0)",top:"translateY(0)",bottom:"translateY(0)"},A=i.useMemo(()=>{const T=Jt(w,C,R),x={...qt,...m?{position:"absolute"}:{position:"fixed"},...ft[L],transform:n?M[L]:ft[L].transform,transition:T};return s!==void 0&&(x.zIndex=s),u!==void 0&&(x.width=typeof u=="number"?`${u}px`:u),c!==void 0&&(x.height=typeof c=="number"?`${c}px`:c),x},[c,m,n,L,C,R,w,u,s]),D=p?.title??e.ariaLabel??"Drawer",y=i.useMemo(()=>{const T=m?{...dt,position:"absolute"}:dt,x=w==="none"?void 0:`opacity ${C??"220ms"} ease`;return{...T,opacity:n?1:0,pointerEvents:n?"auto":"none",transition:x,zIndex:s!==void 0?s-1:void 0}},[m,n,C,w,s]),N=i.useMemo(()=>{const T=L==="left"||L==="right",x={borderRadius:0};return T&&(x.height="100%"),x},[L]);return g.jsxs(g.Fragment,{children:[g.jsx("div",{style:y,onClick:l?o:void 0}),g.jsx("div",{"data-layer-id":t,"data-placement":L,style:A,role:"dialog","aria-modal":l?!0:void 0,"aria-hidden":n?void 0:!0,"aria-label":D,children:g.jsx(te,{chrome:f,frameStyle:N,header:p,dismissible:l,onClose:o,children:r})})]})},ne=(t,e)=>new Promise(n=>{let o=!1;const r=()=>{o||(o=!0,t.removeEventListener("transitionend",s),n())},s=u=>{u.target===t&&r()};t.addEventListener("transitionend",s),setTimeout(r,e+50)}),tt=async(t,e,n,o)=>{switch(e){case"none":t();return;case"css":t(),n&&await ne(n,o);return}},oe=t=>{const[e,n]=i.useState({}),o=i.useRef(t);o.current=t;const r=i.useCallback(async(a,l,p)=>{const{mode:f="none",element:m,duration:w=300}=p??{};await tt(()=>{n(P=>P[a]===l?P:{...P,[a]:l})},f,m?.current,w);const R=o.current;l?R?.onOpen?.(a):R?.onClose?.(a),R?.onTransitionEnd?.(a,l)},[]),s=i.useCallback(a=>e[a]??!1,[e]),u=i.useCallback((a,l)=>r(a,!0,l),[r]),c=i.useCallback((a,l)=>r(a,!1,l),[r]);return{state:s,open:u,close:c}},re=t=>{if(!t)return 300;const e=t.match(/(\d+)/);return e?parseInt(e[1],10):300},se=t=>{const[e,n]=i.useState(()=>{const a={};return t.forEach(l=>{l.drawer&&(a[l.id]=l.drawer.defaultOpen??!1)}),a}),o=i.useMemo(()=>{const a=new Map;return t.forEach(l=>a.set(l.id,l)),a},[t]),r=i.useCallback(async(a,l,p)=>{const f=o.get(a);if(!f?.drawer)return;const m=p?.mode??f.drawer.transitionMode??"css",w=p?.duration??re(f.drawer.transitionDuration),C=p?.element?.current;await tt(()=>{f.drawer?.open===void 0&&n(P=>P[a]===l?P:{...P,[a]:l}),f.drawer?.onStateChange?.(l)},m,C,w)},[o]),s=i.useCallback(a=>{const l=o.get(a);return l?.drawer?.open!==void 0?l.drawer.open:e[a]??!1},[o,e]),u=i.useCallback((a,l)=>r(a,!0,l),[r]),c=i.useCallback((a,l)=>r(a,!1,l),[r]);return{state:s,open:u,close:c}},Lt=({layers:t})=>{const e=se(t),n=i.useMemo(()=>t.filter(r=>r.drawer),[t]),o=i.useMemo(()=>{const r=new Map;return n.forEach(s=>{r.set(s.id,()=>e.close(s.id))}),r},[n,e.close]);return g.jsx(g.Fragment,{children:n.map(r=>{if(!r.drawer)return null;const s=e.state(r.id),u=o.get(r.id);return u?g.jsx(Pt,{id:r.id,config:r.drawer,isOpen:s,onClose:u,zIndex:r.zIndex,width:r.width,height:r.height,position:r.position,children:r.component},r.id):null})})},Dt=i.createContext(null),ie=({value:t,children:e})=>g.jsx(Dt.Provider,{value:t,children:e}),et=()=>{const t=i.useContext(Dt);if(!t)throw new Error("useGridLayoutContext must be used within a GridLayoutProvider.");return t},yt=i.createContext(null),Tt=()=>{const t=i.useContext(yt);if(!t)throw new Error("usePanelSystem must be used within a PanelSystemProvider.");return t},ae=({config:t,layers:e,style:n,children:o})=>{const r=i.useMemo(()=>{const l=new Map;return e.forEach(p=>{l.set(p.id,p)}),l},[e]),s=i.useCallback(l=>r.get(l)?.component??null,[r]),u=i.useMemo(()=>e.map(l=>l.id),[e]),{getCachedContent:c}=xt.useContentCache({resolveContent:s,validIds:u}),a=i.useMemo(()=>({config:t,style:n,layers:{defs:e,layerById:r},getCachedContent:c}),[t,n,e,r,c]);return g.jsx(yt.Provider,{value:a,children:o})},_t=i.createContext(null),Mt=({layerId:t,children:e})=>{const n=i.useMemo(()=>({layerId:t}),[t]);return g.jsx(_t.Provider,{value:n,children:e})},ce=()=>{const t=i.useContext(_t);if(!t)throw new Error("useLayerInstance must be used within a LayerInstanceProvider.");return t},gt=(t,e,n)=>{if(typeof t=="number"&&Number.isFinite(t))return t;throw new Error(`Popup layer "${n}" requires a numeric "${e}" value.`)},Ht=(t,e)=>{if(!t)throw new Error(`Popup layer "${e}" must define position (left/top).`);return{left:gt(t.left,"left",e),top:gt(t.top,"top",e)}},Y=t=>`${Math.round(t)}`,F=t=>{if(t!==void 0)return t?"yes":"no"},ue=(t,e,n,o,r)=>{const s={},u=Ht(e,t);if(typeof n!="number"||typeof o!="number")throw new Error(`Popup layer "${t}" requires numeric width/height.`);s.width=Y(n),s.height=Y(o),s.left=Y(u.left),s.top=Y(u.top);const c=r?.features;if(c){const a=F(c.toolbar),l=F(c.menubar),p=F(c.location),f=F(c.status),m=F(c.resizable),w=F(c.scrollbars);a!==void 0&&(s.toolbar=a),l!==void 0&&(s.menubar=l),p!==void 0&&(s.location=p),f!==void 0&&(s.status=f),m!==void 0&&(s.resizable=m),w!==void 0&&(s.scrollbars=w)}return Object.entries(s).map(([a,l])=>`${a}=${l}`).join(",")},pt=(t,e,n,o,r)=>{const s=Ht(n,e);if(typeof o!="number"||typeof r!="number")throw new Error(`Popup layer "${e}" requires numeric width/height.`);t.moveTo(Math.round(s.left),Math.round(s.top)),t.resizeTo(Math.round(o),Math.round(r))},le=({layer:t})=>{const e=t.floating;if(!e)throw new Error(`Layer "${t.id}" is missing floating configuration required for popup mode.`);if((e.mode??"embedded")!=="popup")throw new Error(`PopupLayerPortal received layer "${t.id}" that is not configured for popup mode.`);const o=i.useRef(null),r=i.useRef(null),[s,u]=i.useState(!1);return i.useEffect(()=>{if(typeof window>"u")return;const c=ue(t.id,t.position,t.width,t.height,e.popup),a=e.popup?.name??t.id,l=de(a,c,{position:t.position,size:{width:t.width,height:t.height}},e.popup);if(!l)throw new Error(`Failed to open popup window for layer "${t.id}".`);const p=l;r.current=p,e.popup?.focus!==!1&&p.focus(),p.document.title||(p.document.title=t.id),p.document.body.innerHTML="";const f=p.document.createElement("div");f.dataset.layerId=t.id,p.document.body.appendChild(f),o.current=f,u(!0),pt(p,t.id,t.position,t.width,t.height);const m=()=>{r.current=null,o.current=null,u(!1)};return p.addEventListener("beforeunload",m),()=>{p.removeEventListener("beforeunload",m),e.popup?.closeOnUnmount!==!1&&p.close(),r.current=null,o.current=null,u(!1)}},[e.popup?.closeOnUnmount,e.popup?.features?.location,e.popup?.features?.menubar,e.popup?.features?.resizable,e.popup?.features?.scrollbars,e.popup?.features?.status,e.popup?.features?.toolbar,e.popup?.focus,e.popup?.name,t.id]),i.useEffect(()=>{const c=r.current;c&&pt(c,t.id,t.position,t.width,t.height)},[t.position?.left,t.position?.top,t.height,t.width,t.id]),!s||!o.current?null:Bt.createPortal(g.jsx(Mt,{layerId:t.id,children:t.component}),o.current)},de=(t,e,n,o)=>{const r=o?.createWindow;return r?r({name:t,features:e,bounds:n}):window.open("",t,e)},fe=({onClick:t})=>g.jsx(_.FloatingPanelControls,{children:g.jsx(_.FloatingPanelCloseButton,{onClick:t,"aria-label":"Close window","data-drag-ignore":"true"})}),ge=({header:t,draggable:e,onClose:n})=>{if(!t)return null;const o=t.showCloseButton??!1,r=e?{"data-drag-handle":"true"}:{},s=e?"grab":void 0;return g.jsxs(_.FloatingPanelHeader,{...r,style:{cursor:s},children:[t.title?g.jsx(_.FloatingPanelTitle,{children:t.title}):null,o?g.jsx(fe,{onClick:n}):null]})},pe=({header:t,draggable:e,chrome:n,onClose:o,children:r})=>n?g.jsxs(_.FloatingPanelFrame,{style:{height:"100%",width:"100%"},children:[g.jsx(ge,{header:t,draggable:e,onClose:o}),g.jsx(_.FloatingPanelContent,{style:{flex:1,display:"flex",flexDirection:"column"},children:r})]}):g.jsx(g.Fragment,{children:r}),nt=({id:t,config:e,onClose:n,children:o})=>{const r=e.chrome??!1,s=e.draggable??!1,u=e.header?.title??e.ariaLabel??"Floating window";return g.jsx("div",{"data-floating-window":t,role:"dialog","aria-label":u,style:{height:"100%",width:"100%"},children:g.jsx(pe,{header:e.header,draggable:s,chrome:r,onClose:n,children:o})})};nt.displayName="FloatingWindow";const Nt={position:"absolute",pointerEvents:"auto",boxSizing:"border-box",background:"transparent",border:"none"},he={...Nt,width:v.GRID_LAYER_CORNER_HIT_SIZE,height:v.GRID_LAYER_CORNER_HIT_SIZE,zIndex:2},me={...Nt,zIndex:1},we={"top-left":{top:0,left:0,transform:"translate(-50%, -50%)",cursor:"nwse-resize"},"top-right":{top:0,right:0,transform:"translate(50%, -50%)",cursor:"nesw-resize"},"bottom-left":{bottom:0,left:0,transform:"translate(-50%, 50%)",cursor:"nesw-resize"},"bottom-right":{bottom:0,right:0,transform:"translate(50%, 50%)",cursor:"nwse-resize"}},be={left:{top:v.GRID_LAYER_CORNER_HIT_SIZE,bottom:v.GRID_LAYER_CORNER_HIT_SIZE,left:0,width:v.GRID_LAYER_EDGE_HIT_THICKNESS,transform:"translateX(-50%)",cursor:"ew-resize"},right:{top:v.GRID_LAYER_CORNER_HIT_SIZE,bottom:v.GRID_LAYER_CORNER_HIT_SIZE,right:0,width:v.GRID_LAYER_EDGE_HIT_THICKNESS,transform:"translateX(50%)",cursor:"ew-resize"},top:{left:v.GRID_LAYER_CORNER_HIT_SIZE,right:v.GRID_LAYER_CORNER_HIT_SIZE,top:0,height:v.GRID_LAYER_EDGE_HIT_THICKNESS,transform:"translateY(-50%)",cursor:"ns-resize"},bottom:{left:v.GRID_LAYER_CORNER_HIT_SIZE,right:v.GRID_LAYER_CORNER_HIT_SIZE,bottom:0,height:v.GRID_LAYER_EDGE_HIT_THICKNESS,transform:"translateY(50%)",cursor:"ns-resize"}},Ee=[{key:"top-left",variant:"corner",horizontal:"left",vertical:"top"},{key:"top-right",variant:"corner",horizontal:"right",vertical:"top"},{key:"bottom-left",variant:"corner",horizontal:"left",vertical:"bottom"},{key:"bottom-right",variant:"corner",horizontal:"right",vertical:"bottom"},{key:"left",variant:"edge",horizontal:"left"},{key:"right",variant:"edge",horizontal:"right"},{key:"top",variant:"edge",vertical:"top"},{key:"bottom",variant:"edge",vertical:"bottom"}],ve=({layerId:t,onPointerDown:e})=>g.jsx(g.Fragment,{children:Ee.map(n=>{const o=n.variant==="corner"?he:me,r=n.variant==="corner"?we[n.key]:be[n.key],s={...o,...r},u=n.variant==="corner"?{"data-resize-corner":n.key}:{"data-resize-edge":n.key};return g.jsx("div",{role:"presentation","aria-hidden":"true",style:s,...u,"data-layer-id":t,onPointerDown:c=>e(n,c)},n.key)})}),Se=({pivot:t})=>{const{Outlet:e}=xt.usePivot({items:t.items,activeId:t.activeId,defaultActiveId:t.defaultActiveId,onActiveChange:t.onActiveChange,transitionMode:t.transitionMode});return g.jsx(e,{})},Ce=(t,e)=>t.pivot?g.jsx(Se,{pivot:t.pivot}):t.cache?e(t.id):t.component,At=i.memo(({layer:t,onClose:e})=>{const{getCachedContent:n}=Tt(),o=Ce(t,n);return t.floating?.chrome?g.jsx(nt,{id:t.id,config:t.floating,onClose:e,children:o}):o});At.displayName="LayerContentRenderer";const kt=i.memo(({layerId:t,isResizable:e,onPointerDown:n})=>e?g.jsx(ve,{layerId:t,onPointerDown:n}):null);kt.displayName="LayerResizeHandles";const Re=(t,e)=>t?"auto":e?"visible":"hidden",jt=i.memo(({layer:t,handleLayerPointerDown:e})=>{const{getLayerRenderState:n}=et(),{style:o,isResizable:r,isResizing:s,onResizeHandlePointerDown:u}=n(t),c=i.useMemo(()=>{const p={};return t.gridArea&&(p.gridArea=t.gridArea),t.gridRow&&(p.gridRow=t.gridRow),t.gridColumn&&(p.gridColumn=t.gridColumn),p},[t.gridArea,t.gridRow,t.gridColumn]),a=i.useMemo(()=>{const p=!!t.floating,f=Re(t.scrollable,p),m={...o,...c,minWidth:0,minHeight:0,overflow:f};return r?{...m,position:"relative"}:m},[o,c,r,t.scrollable,t.floating]),l=i.useCallback(()=>{t.floating?.onClose?.()},[t.floating]);return g.jsxs("div",{"data-layer-id":t.id,"data-draggable":!!t.floating?.draggable,"data-resizable":r,"data-resizing":s,style:a,onPointerDown:e,children:[g.jsx(Mt,{layerId:t.id,children:g.jsx(At,{layer:t,onClose:l})}),g.jsx(kt,{layerId:t.id,isResizable:r,onPointerDown:u})]})});jt.displayName="EmbeddedLayer";const ze=({layers:t})=>{const{handleLayerPointerDown:e}=et();return g.jsx(g.Fragment,{children:t.map(n=>{const o=n.floating?.mode??"embedded";return n.floating&&o==="popup"?g.jsx(le,{layer:n},n.id):g.jsx(jt,{layer:n,handleLayerPointerDown:e},n.id)})})};function j(t){const e=i.useRef(t);return e.current=t,i.useCallback((...n)=>{const o=e.current;if(o)return o(...n)},[])}function J(t,e){const n=j(e.onMove),o=j(e.onUp),r=j(e.onCancel);i.useEffect(()=>{if(t)return e.onMove&&document.addEventListener("pointermove",n,{passive:!1}),e.onUp&&document.addEventListener("pointerup",o),e.onCancel&&document.addEventListener("pointercancel",r),()=>{e.onMove&&document.removeEventListener("pointermove",n),e.onUp&&document.removeEventListener("pointerup",o),e.onCancel&&document.removeEventListener("pointercancel",r)}},[t,e.onMove,e.onUp,e.onCancel,n,o,r])}function xe(t,e,n){i.useEffect(()=>{const o=t.current;if(!(!e||!o||n===void 0))return o.setPointerCapture(n),()=>{o.hasPointerCapture&&o.hasPointerCapture(n)&&o.releasePointerCapture(n)}},[t,e,n])}function Ie(t,e,n=["pointerdown","pointermove","pointerup"]){i.useEffect(()=>{const o=t.current;if(!e||!o)return;const r=s=>{s.preventDefault()};return n.forEach(s=>{o.addEventListener(s,r,{passive:!1})}),()=>{n.forEach(s=>{o.removeEventListener(s,r)})}},[t,e,n])}function Pe(t,e,n){const{onMove:o,onUp:r,onCancel:s,pointerId:u,capturePointer:c=!0,preventDefaults:a=!0}=n;J(e,{onMove:o,onUp:r,onCancel:s}),xe(t,e?c:!1,u),Ie(t,e?a:!1)}const Gt=t=>{const e=i.useRef(null),n=i.useRef(null),o=i.useRef(0),[r,s]=i.useState(!1),u=j(f=>{t.onResize?.(f)}),c=i.useCallback(f=>t.axis==="x"?f.clientX:f.clientY,[t.axis]),a=i.useCallback(f=>{f.preventDefault(),e.current=f.currentTarget,n.current=f.pointerId,o.current=c(f),s(!0)},[c]),l=i.useCallback(f=>{const m=c(f),w=m-o.current;w!==0&&(o.current=m,u(w))},[c,u]),p=i.useCallback(()=>{s(!1),n.current=null},[]);return Pe(e,r,{onMove:l,onUp:p,pointerId:n.current??void 0,capturePointer:!0,preventDefaults:!1}),{ref:e,onPointerDown:a,isDragging:r}},Le=({element:t,component:e})=>i.forwardRef(({children:n,...o},r)=>t?i.cloneElement(t,{...o,ref:r},n??t.props.children):e?g.jsx(e,{...o,ref:r,children:n}):g.jsx("div",{...o,ref:r,children:n}));function Ft({element:t,component:e}){return i.useMemo(()=>Le({element:t,component:e}),[e,t])}const De={position:"absolute",zIndex:v.RESIZE_HANDLE_Z_INDEX},ye={vertical:{width:v.RESIZE_HANDLE_THICKNESS,height:"100%",top:0,cursor:"col-resize"},horizontal:{width:"100%",height:v.RESIZE_HANDLE_THICKNESS,left:0,cursor:"row-resize"}},Te={idle:v.COLOR_RESIZE_HANDLE_IDLE,hovered:v.COLOR_RESIZE_HANDLE_HOVER,dragging:v.COLOR_RESIZE_HANDLE_ACTIVE},$t=({direction:t,onResize:e,component:n,element:o,children:r})=>{const s=t==="vertical"?"x":"y",{ref:u,isDragging:c,onPointerDown:a}=Gt({axis:s,onResize:e}),[l,p]=i.useState(!1),f=i.useCallback(()=>{p(!0)},[]),m=i.useCallback(()=>{p(!1)},[]),w=Ft({element:o,component:n}),C=i.useMemo(()=>c?"dragging":l?"hovered":"idle",[c,l]),R=i.useMemo(()=>({...De,...ye[t],backgroundColor:Te[C],touchAction:"none"}),[t,C]);return g.jsx(w,{ref:u,style:R,role:"separator","aria-orientation":t,"aria-hidden":void 0,"data-resize-handle":"true","data-direction":t,"data-is-dragging":c?"true":void 0,onPointerDown:a,onPointerEnter:f,onPointerLeave:m,children:r})},ht={position:"absolute",pointerEvents:"auto"},mt=({direction:t,trackIndex:e,align:n,gap:o,span:r,onResize:s})=>{const u=t==="col"?"vertical":"horizontal",c=i.useCallback(p=>{const f=n==="start"?-p:p;s(t,e,f)},[n,t,e,s]),a=i.useMemo(()=>t==="col"?{gridColumn:`${e+1} / ${e+2}`,gridRow:`${r.start} / ${r.end}`}:{gridRow:`${e+1} / ${e+2}`,gridColumn:`${r.start} / ${r.end}`},[t,e,r]),l=i.useMemo(()=>{const f=Math.max(0,o)/2+v.GRID_HANDLE_THICKNESS/2;return t==="col"?{...ht,width:v.GRID_HANDLE_THICKNESS,height:"100%",top:0,bottom:0,...n==="start"?{left:-f}:{right:-f}}:{...ht,width:"100%",height:v.GRID_HANDLE_THICKNESS,left:0,right:0,...n==="start"?{top:-f}:{bottom:-f}}},[n,t,o]);return g.jsx("div",{"data-resizable":"true",style:{...a,position:"relative",pointerEvents:"none"},children:g.jsx("div",{"data-direction":u,"data-align":n,"data-handle":"true",style:l,children:g.jsx($t,{direction:u,onResize:c})})})},_e=t=>{const e=new Map;t.forEach((o,r)=>{o.forEach((s,u)=>{if(!s||s===".")return;const c=e.get(s);if(c){const l={rowStart:Math.min(c.rowStart,r),rowEnd:Math.max(c.rowEnd,r),colStart:Math.min(c.colStart,u),colEnd:Math.max(c.colEnd,u)};e.set(s,l);return}const a={rowStart:r,rowEnd:r,colStart:u,colEnd:u};e.set(s,a)})});const n=new Map;return e.forEach((o,r)=>{const s=o.rowStart+1,u=o.rowEnd+2,c=o.colStart+1,a=o.colEnd+2,l={gridArea:r,gridRow:`${s} / ${u}`,gridColumn:`${c} / ${a}`};n.set(r,l)}),n},Me=(t,e)=>{if((t.positionMode??"grid")!=="grid")return t;const o=t.gridArea??t.id,r=e.get(o);if(!r)return t;const s=!t.gridArea,u=!t.gridRow,c=!t.gridColumn;return!s&&!u&&!c?t:{...t,gridArea:s?r.gridArea:t.gridArea,gridRow:u?r.gridRow:t.gridRow,gridColumn:c?r.gridColumn:t.gridColumn}},He=(t,e)=>{const n=i.useMemo(()=>_e(t.areas),[t.areas]),o=i.useMemo(()=>e.map(c=>Me(c,n)),[e,n]),r=i.useMemo(()=>o.filter(c=>c.visible!==!1),[o]),s=i.useMemo(()=>r.filter(c=>!c.drawer),[r]),u=i.useMemo(()=>{const c=new Map;return o.forEach(a=>{c.set(a.id,a)}),c},[o]);return{normalizedLayers:o,visibleLayers:r,regularLayers:s,layerById:u}},Ne=t=>{if(!t)return{rowGap:0,columnGap:0};const e=t.split(/\s+/).map(o=>o.trim()).filter(Boolean),n=o=>{const r=o.match(/^(-?\d+(?:\.\d+)?)px$/);return r?Number.parseFloat(r[1]):0};if(e.length===1){const o=n(e[0]);return{rowGap:o,columnGap:o}}return{rowGap:n(e[0]),columnGap:n(e[1])}},Ae=(t,e)=>{if(!t)return[];const n=getComputedStyle(t);return(e==="col"?n.gridTemplateColumns:n.gridTemplateRows).split(/\s+/).map(r=>parseFloat(r)).filter(r=>!Number.isNaN(r))},ot=(t,e=Number.NEGATIVE_INFINITY,n=Number.POSITIVE_INFINITY)=>Math.min(Math.max(t,e),n),ke=(t,e)=>typeof t!="number"||!Number.isFinite(t)?e:t,V=(t,e)=>`${t}-${e}`,je=(t,e,n,o)=>{const r=V(n,o),s=e[r];return s!==void 0?`minmax(${t.minSize??0}px, ${s}px)`:t.size},wt=(t,e,n)=>t.map((o,r)=>je(o,e,n,r)).join(" "),W=(t,e)=>t.reduce((n,o,r)=>(o.resizable&&o.size.endsWith("px")&&(n[V(e,r)]=parseInt(o.size,10)),n),{}),Ge=({trackSizes:t,track:e,direction:n,trackIndex:o,containerRef:r})=>{const s=V(n,o),u=t[s];if(u!==void 0)return u;const a=Ae(r?.current??null,n)[o];return a!==void 0&&a>0?a:e.size.endsWith("px")?Number.parseInt(e.size,10):300},Fe=(t,e)=>t.reduce((n,o,r)=>r===e?n:o.size.includes("fr")?n+100:n+(o.minSize??50),0),$e=({track:t,tracks:e,trackIndex:n,direction:o,containerRef:r,gapSizes:s})=>{if(!r?.current)return t.maxSize;const u=o==="col"?r.current.offsetWidth:r.current.offsetHeight,c=Fe(e,n),a=e.length-1,l=o==="col"?s.columnGap:s.rowGap,p=a*l,f=u-c-p;return t.maxSize!==void 0?Math.min(t.maxSize,f):f},Oe=(t,e,n)=>ot(t,e??Number.NEGATIVE_INFINITY,n??Number.POSITIVE_INFINITY),bt=(t,e)=>{const n=t.length,o=[];for(let u=0;u<n;u++){const c=t[u],a=c[e],l=c[e+1];a!==l&&o.push(u)}if(o.length===0)return{start:1,end:n+1};const r=Math.min(...o),s=Math.max(...o);return{start:r+1,end:s+2}},Et=(t,e)=>{const n=t[e],o=t[e+1],r=n?.length??0,s=[];for(let a=0;a<r;a++){const l=n?.[a],p=o?.[a];l!==p&&s.push(a)}if(s.length===0)return{start:1,end:r+1};const u=Math.min(...s),c=Math.max(...s);return{start:u+1,end:c+2}},Ye=(t,e)=>{if(t.length===0)return[];const n=e.length;if(t.length===1)return t[0]?.resizable?[{trackIndex:0,align:"end",span:{start:1,end:n+1}}]:[];const o=[];return Array.from({length:t.length-1},(s,u)=>u).forEach(s=>{const u=t[s];if(t[s+1]?.resizable){const a=bt(e,s);o.push({trackIndex:s+1,align:"start",span:a});return}if(u?.resizable){const a=bt(e,s);o.push({trackIndex:s,align:"end",span:a})}}),o},We=(t,e)=>{if(t.length===0)return[];const n=e[0]?.length??0;if(t.length===1)return t[0]?.resizable?[{trackIndex:0,align:"end",span:{start:1,end:n+1}}]:[];const o=[];return Array.from({length:t.length-1},(s,u)=>u).forEach(s=>{const u=t[s];if(t[s+1]?.resizable){const a=Et(e,s);o.push({trackIndex:s+1,align:"start",span:a});return}if(u?.resizable){const a=Et(e,s);o.push({trackIndex:s,align:"end",span:a})}}),o},Be=t=>t!==void 0?{gap:t}:{},Xe=(t,e)=>{const n=Object.keys(e),o={};for(const p of n)o[p]=t[p]??e[p];const r=Object.keys(t),s=r.length!==n.length,u=r.some(p=>!Object.prototype.hasOwnProperty.call(o,p)),c=s?!0:u,a=n.some(p=>t[p]!==o[p]);return(c?!0:a)?o:null},Ve=(t,e,n)=>{const[o,r]=i.useState(()=>({...W(t.columns,"col"),...W(t.rows,"row")}));It.useIsomorphicLayoutEffect(()=>{const f={...W(t.columns,"col"),...W(t.rows,"row")};r(m=>Xe(m,f)??m)},[t.columns,t.rows]);const s=i.useMemo(()=>t.areas.map(f=>`"${f.join(" ")}"`).join(" "),[t.areas]),u=i.useMemo(()=>Ne(t.gap),[t.gap]),c=i.useMemo(()=>Ye(t.columns,t.areas),[t.columns,t.areas]),a=i.useMemo(()=>We(t.rows,t.areas),[t.rows,t.areas]),l=i.useMemo(()=>({...t.style,...e,gridTemplateAreas:s,gridTemplateRows:wt(t.rows,o,"row"),gridTemplateColumns:wt(t.columns,o,"col"),...Be(t.gap)}),[s,t.columns,t.gap,t.rows,t.style,e,o]),p=i.useCallback((f,m,w)=>{const C=f==="row"?t.rows:t.columns,R=C[m];if(!R||!R.resizable)return;const P=Ge({trackSizes:o,track:R,direction:f,trackIndex:m,containerRef:n}),L=$e({track:R,tracks:C,trackIndex:m,direction:f,containerRef:n,gapSizes:u}),M=V(f,m);r(A=>{const D=P+w,y=Oe(D,R.minSize,L);return{...A,[M]:y}})},[t.columns,t.rows,o,n,u]);return{columnHandles:c,rowHandles:a,gapSizes:u,gridStyle:l,handleResize:p}},Ze=t=>t.positionMode?t.positionMode:t.floating?(t.floating.mode??"embedded")==="embedded"?"absolute":"relative":"grid",Ke=t=>({position:t==="grid"?"relative":t}),Ue=(t,e)=>e!=="grid"?{}:{gridArea:t.gridArea,gridRow:t.gridRow,gridColumn:t.gridColumn},qe=t=>t?{top:t.top,right:t.right,bottom:t.bottom,left:t.left}:{},Je=t=>t!==void 0?{zIndex:t}:{},Qe=(t,e)=>({width:t,height:e}),tn=(t,e)=>t.pointerEvents!==void 0?typeof t.pointerEvents=="boolean"?{pointerEvents:t.pointerEvents?"auto":"none"}:{pointerEvents:t.pointerEvents}:e==="absolute"||e==="fixed"?{pointerEvents:"auto"}:{},en=t=>t.floating?t.floating.position??t.floating.defaultPosition??t.position:t.position,nn=t=>{if(t.floating){const e=t.floating.size??t.floating.defaultSize;if(e)return{width:e.width,height:e.height}}return{width:t.width,height:t.height}},on=t=>t.floating?.zIndex!==void 0?t.floating.zIndex:t.zIndex,rn=t=>{const e=Ze(t),n=en(t),o=nn(t),r=on(t);return{...t.style,...Ke(e),...Ue(t,e),...qe(n),...Je(r),...Qe(o.width,o.height),...tn(t,e)}},sn=t=>{const e=t.floating;return e?e.mode??"embedded":null},G=t=>sn(t)!=="embedded"?null:t.floating??null,vt=t=>t instanceof HTMLElement?["INPUT","TEXTAREA","SELECT","BUTTON"].includes(t.tagName):!1,St=(t,e,n)=>{const o=e??Number.NEGATIVE_INFINITY,r=n??Number.POSITIVE_INFINITY;return ot(t,o,r)},Ct=(t,e,n)=>{if(typeof t=="number"&&Number.isFinite(t))return t;throw new Error(`Floating layer "${n}" must provide a numeric "${e}" value when draggable mode is enabled.`)},Rt=t=>{const e=G(t);if(!e)throw new Error(`Floating layer "${t.id}" is missing floating configuration required for dragging.`);const n=e.position??e.defaultPosition??t.position;if(!n)throw new Error(`Floating layer "${t.id}" must define position with left and top values.`);return{left:Ct(n.left,"left",t.id),top:Ct(n.top,"top",t.id)}},an=t=>{const e=G(t);return e?e.constraints??{}:{}},cn=(t,e,n)=>t?t==="left"?e-n:e+n:e,un=(t,e,n)=>t?t==="top"?e-n:e+n:e,ln=(t,e,n)=>!t||t==="right"?e:e+n,dn=(t,e,n)=>!t||t==="bottom"?e:e+n,Q=(t,e)=>t?t.dataset.layerId===e?t:Q(t.parentElement,e):null,rt=(t,e,n)=>!t||n?.(t)?null:e(t)?t:rt(t.parentElement,e,n),fn=t=>t instanceof HTMLElement?rt(t,e=>e.dataset.dragHandle==="true",e=>e.dataset.dragIgnore==="true"):null,zt=t=>t instanceof HTMLElement?rt(t,e=>e.dataset.resizeCorner!==void 0||e.dataset.resizeEdge!==void 0)!==null:!1,B=t=>{const e=G(t);return e?e.resizable===!0:!1},X=t=>{if(!G(t))return null;const n=hn(t);if(!n)throw new Error(`Floating layer "${t.id}" must define width and height when resizable or draggable.`);return{width:n.width,height:n.height}},gn=(t,e,n)=>{const o=t.filter(B).reduce((f,m)=>{if(n===m.id){const C=e[m.id];if(C)return f[m.id]=C,f}const w=X(m);return w&&(f[m.id]=w),f},{}),r=Object.keys(e),s=Object.keys(o),u=r.length!==s.length,c=r.some(f=>!Object.prototype.hasOwnProperty.call(o,f)),a=u?!0:c,l=s.some(f=>{const m=e[f],w=o[f];return!m||!w?!0:m.width!==w.width||m.height!==w.height});return{sizes:o,changed:a?!0:l}},pn=({layers:t,layerById:e,isRootLevel:n})=>{const[o,r]=i.useState(null),[s,u]=i.useState(null),[c,a]=i.useState({}),[l,p]=i.useState({}),f=i.useRef(null),m=i.useRef(null),w=j((h,d)=>{e.get(h)?.floating?.onMove?.(d)}),C=j((h,d)=>{e.get(h)?.floating?.onResize?.(d)});It.useIsomorphicLayoutEffect(()=>{const{sizes:h,changed:d}=gn(t,l,s);d&&p(h)},[t,s]);const R=i.useCallback((h,d,b,E)=>{const S=Rt(d),I=c[h]??{x:0,y:0},z={pointerStartX:E.clientX,pointerStartY:E.clientY,initialTranslationX:I.x,initialTranslationY:I.y,baseLeft:S.left,baseTop:S.top,layerId:h,pointerId:E.pointerId,target:b};if(z.target.setPointerCapture)try{z.target.setPointerCapture(z.pointerId)}catch{}f.current=z,r(h)},[c]),P=i.useCallback(h=>{const d=h.target,b=fn(d);if(!b)return;const E=b.closest("[data-layer-id]")?.getAttribute("data-layer-id");if(!E)return;const S=e.get(E);if(!S)return;const I=G(S);if(!(!I||I.draggable!==!0)&&!vt(h.target)&&!zt(h.target)&&b){const z=Q(b,E);if(!z)return;R(E,S,z,h);return}},[R,e]),L=i.useCallback((h,d)=>{const b=e.get(h),E=b?G(b):null;if(!b||!E||E.draggable!==!0||vt(d.target)||zt(d.target))return;const S=Q(d.currentTarget,h);S&&R(h,b,S,d)},[R,e]),M=i.useCallback((h,d,b)=>{const E=e.get(h);if(!E||!B(E))return;const S=l[h]??X(E);if(!S)return;const I=Rt(E),z=an(E),H=c[h]??{x:0,y:0};if(b.stopPropagation(),b.preventDefault(),b.currentTarget.setPointerCapture)try{b.currentTarget.setPointerCapture(b.pointerId)}catch{}m.current={layerId:h,pointerId:b.pointerId,horizontalEdge:d.horizontal,verticalEdge:d.vertical,startX:b.clientX,startY:b.clientY,startWidth:S.width,startHeight:S.height,startPosition:H,baseLeft:I.left,baseTop:I.top,minWidth:z.minWidth,maxWidth:z.maxWidth,minHeight:z.minHeight,maxHeight:z.maxHeight,target:b.currentTarget},u(h)},[e,c,l]),A=i.useCallback(h=>{const d=f.current;if(!d)return;const b=h.clientX-d.pointerStartX,E=h.clientY-d.pointerStartY,S={x:d.initialTranslationX+b,y:d.initialTranslationY+E};a(I=>({...I,[d.layerId]:S})),w(d.layerId,{left:d.baseLeft+S.x,top:d.baseTop+S.y})},[w]),D=i.useCallback(h=>{const d=m.current;if(!d||d.pointerId!==h.pointerId||!e.get(d.layerId))return;const E=h.clientX-d.startX,S=h.clientY-d.startY,I=cn(d.horizontalEdge,d.startWidth,E),z=un(d.verticalEdge,d.startHeight,S),H=St(I,d.minWidth,d.maxWidth),k=St(z,d.minHeight,d.maxHeight),$=d.startWidth-H,Z=d.startHeight-k,at=ln(d.horizontalEdge,d.startPosition.x,$),Yt=dn(d.verticalEdge,d.startPosition.y,Z),K=l[d.layerId],ct={width:H,height:k};(!K||K.width!==H||K.height!==k)&&(p(U=>({...U,[d.layerId]:ct})),C(d.layerId,ct));const ut=c[d.layerId]??{x:0,y:0},O={x:at,y:Yt};(ut.x!==O.x||ut.y!==O.y)&&(a(U=>({...U,[d.layerId]:O})),w(d.layerId,{left:d.baseLeft+O.x,top:d.baseTop+O.y}))},[e,c,l,w,C]),y=i.useCallback(h=>{const d=f.current;if(d){if(d.pointerId===h.pointerId&&d.target.releasePointerCapture)try{d.target.releasePointerCapture(d.pointerId)}catch{}f.current=null}r(null)},[]),N=i.useCallback(h=>{const d=m.current;if(d){if(d.pointerId===h.pointerId&&d.target.releasePointerCapture)try{d.target.releasePointerCapture(d.pointerId)}catch{}m.current=null}u(null)},[]);J(o!==null,{onMove:A,onUp:y,onCancel:y}),J(s!==null,{onMove:D,onUp:N,onCancel:N});const T=i.useCallback(h=>{const d=rn(h),b=G(h);if(!b||b.draggable!==!0)return d;const E=c[h.id],S=o===h.id,I=s===h.id,z=E?{transform:`translate(${E.x}px, ${E.y}px)`}:{},H=l[h.id],k=B(h)?X(h):null,$=H??k,Z=$?{width:`${$.width}px`,height:`${$.height}px`}:{};return{...d,...Z,...z,...S||I?{cursor:"grabbing"}:{}}},[o,c,l,s]),x=i.useCallback(h=>{if(!B(h))return{isResizable:!1};const b=l[h.id],E=X(h);return(b??E)!==null?{isResizable:!0,onPointerDown:(H,k)=>{M(h.id,H,k)}}:{isResizable:!1}},[M,l]),st=i.useCallback(h=>{const{isResizable:d,onPointerDown:b}=x(h),E=T(h),S=s===h.id;return{style:E,isResizable:d,isResizing:S,onResizeHandlePointerDown:(I,z)=>{b&&b(I,z)}}},[T,x,s]),it=i.useCallback(h=>({"data-drag-handle":"true",role:"button","aria-roledescription":"Drag handle","aria-label":"Drag layer",onPointerDown:d=>{L(h,d)}}),[L]);return{providerValue:i.useMemo(()=>({handleLayerPointerDown:P,getLayerRenderState:st,getLayerHandleProps:it,isRootLevel:n}),[it,st,P,n]),draggingLayerId:o,resizingLayerId:s}},hn=t=>{if(t.floating){const e=t.floating.size??t.floating.defaultSize;if(e)return{width:e.width,height:e.height}}if(typeof t.width=="number"&&typeof t.height=="number")return{width:t.width,height:t.height}},Ot={display:"grid",width:"100%",height:"100%",overflow:"hidden"},mn={touchAction:"none",WebkitTouchCallout:"none",WebkitUserSelect:"none",userSelect:"none"},wn={...Ot,overflow:"visible",height:"auto",minHeight:"100%"},bn=t=>t?wn:Ot,En=({config:t,layers:e,style:n,root:o=!1})=>{const r=i.useRef(null),{isIntersecting:s}=Ut(r,{threshold:0});return g.jsx(ae,{config:t,layers:e,style:n,children:g.jsx(vn,{gridRef:r,isIntersecting:s,isRoot:o})})},vn=({gridRef:t,isIntersecting:e,isRoot:n})=>{const{config:o,style:r,layers:s}=Tt(),{normalizedLayers:u,visibleLayers:c,regularLayers:a,layerById:l}=He(o,s.defs),{columnHandles:p,rowHandles:f,gapSizes:m,gridStyle:w,handleResize:C}=Ve(o,r,t),{providerValue:R,draggingLayerId:P,resizingLayerId:L}=pn({layers:u,layerById:l,isRootLevel:n}),M=P?!0:!!L,A=i.useMemo(()=>({...bn(n),...w,...M?mn:{}}),[w,M,n]);return g.jsxs(g.Fragment,{children:[g.jsxs("div",{ref:t,style:A,"data-dragging":!!P,"data-resizing":!!L,"data-visible":e,children:[g.jsx(ie,{value:R,children:g.jsx(ze,{layers:a})}),p.map(({trackIndex:D,align:y,span:N})=>g.jsx(mt,{direction:"col",trackIndex:D,align:y,gap:m.columnGap,span:N,onResize:C},`col-${D}:${y}`)),f.map(({trackIndex:D,align:y,span:N})=>g.jsx(mt,{direction:"row",trackIndex:D,align:y,gap:m.rowGap,span:N,onResize:C},`row-${D}:${y}`))]}),g.jsx(Lt,{layers:c})]})};exports.Drawer=Pt;exports.DrawerLayers=Lt;exports.FloatingWindow=nt;exports.GridLayout=En;exports.ResizeHandle=$t;exports.clampNumber=ot;exports.runTransition=tt;exports.toFiniteNumberOr=ke;exports.useEffectEvent=j;exports.useElementComponentWrapper=Ft;exports.useGridLayoutContext=et;exports.useLayerInstance=ce;exports.useResizeDrag=Gt;exports.useTransitionState=oe;
-//# sourceMappingURL=GridLayout-BQQ63eA1.cjs.map