react-zeugma 3.0.0 → 4.1.0

package/README.md

@@ -15,7 +15,7 @@
 ### Core Features
 
 - **Recursive Split Trees**: Nest rows and columns to any depth using a simple serialized JSON node structure.
-- **5-Zone Docking Previews**: Drag panels on the top, bottom, left, or right edges of another pane to split it, or onto the center to swap their positions.
+- **4-Zone Docking Previews**: Drag panels on the top, bottom, left, or right edges of another pane to split it.
 - **Native Flexbox Resizers**: Fluid, non-blocking split handles built on pointer events.
 - **Accessible Drag-and-Drop**: Built on top of the performant and accessible [`@dnd-kit`](https://dndkit.com) toolkit.
 - **Fullscreen Zoom Toggle**: Programmatically expand any pane to cover the entire viewport and snap it back instantly.
@@ -37,23 +37,22 @@ npm install react-zeugma
 
 ## Quick Start
 
-Import the core components and configure the layout state inside your React application.
+Import the core components and configure the layout state inside your React application using the `useZeugma` hook.
 
 ```tsx
-import { useState } from 'react'
-import { Zeugma, PaneTree, Pane, DragHandle, TreeNode } from 'react-zeugma'
+import { useZeugma, Zeugma, PaneTree, Pane, DragHandle, TreeNode } from 'react-zeugma'
 
 const initialLayout: TreeNode = {
   type: 'split',
   direction: 'row',
   splitPercentage: 20,
-  first: { type: 'pane', paneId: 'explorer' },
+  first: { type: 'pane', id: 'explorer', tabs: ['explorer'], activeTabId: 'explorer' },
   second: {
     type: 'split',
     direction: 'row',
     splitPercentage: 50,
-    first: { type: 'pane', paneId: 'editor' },
-    second: { type: 'pane', paneId: 'preview' },
+    first: { type: 'pane', id: 'editor', tabs: ['editor'], activeTabId: 'editor' },
+    second: { type: 'pane', id: 'preview', tabs: ['preview'], activeTabId: 'preview' },
   },
 }
 
@@ -78,10 +77,10 @@ function MyPane({ id }: { id: string }) {
 }
 
 export default function Dashboard() {
-  const [layout, setLayout] = useState<TreeNode | null>(initialLayout)
+  const zeugma = useZeugma({ initialLayout })
 
   return (
-    <Zeugma layout={layout} onChange={setLayout} renderPane={(id) => <MyPane id={id} />}>
+    <Zeugma {...zeugma} renderPane={(id) => <MyPane id={id} />}>
       <div className="w-screen h-screen">
         <PaneTree />
       </div>
@@ -96,30 +95,47 @@ export default function Dashboard() {
 
 ### `<Zeugma>`
 
-The context provider that sets up the drag-and-drop state machine, monitors active drags, and registers layout change notifications.
-
-| Prop                     | Type                                                                  | Required | Description                                                                                                               |
-| ------------------------ | --------------------------------------------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------- |
-| `layout`                 | `TreeNode \| null`                                                    | Yes      | The serializable tree layout schema.                                                                                      |
-| `onChange`               | `(layout: TreeNode \| null) => void`                                  | Yes      | Fires when resizes, splits, swaps, or removes modify the tree.                                                            |
-| `renderPane`             | `(paneId: string) => ReactNode`                                       | Yes      | Renderer function lookup that returns a `<Pane>` structure.                                                               |
-| `classNames`             | `ZeugmaClassNames`                                                    | No       | Custom classes for overriding pane, resizer, and drop preview overlays.                                                   |
-| `fullscreenPaneId`       | `string \| null`                                                      | No       | Active ID of the pane taking full viewport coverage.                                                                      |
-| `renderDragOverlay`      | `(activeId: string, type: 'pane' \| 'tab') => ReactNode`              | No       | Renders a custom cursor-following drag preview overlay.                                                                   |
-| `onFullscreenChange`     | `(paneId: string \| null) => void`                                    | No       | Callback triggered when a pane enters or leaves fullscreen.                                                               |
-| `onRemove`               | `(paneId: string) => void`                                            | No       | Callback triggered when a pane is closed/removed from the layout tree.                                                    |
-| `dragActivationDistance` | `number`                                                              | No       | Minimum pointer drag distance (in pixels) required to activate dragging. Defaults to `8`.                                 |
-| `enableDragToDismiss`    | `boolean`                                                             | No       | If true, enables the drag-out-to-dismiss gesture where panes can be closed by dragging them outside. Defaults to `false`. |
-| `dragOutThreshold`       | `number`                                                              | No       | Distance in pixels outside the container bounds required to trigger drag-out mode. Defaults to `60`.                      |
-| `onDragOutChange`        | `(activeId: string \| null) => void`                                  | No       | Callback triggered when the drag-out state changes. Receives the pane ID or `null`.                                       |
-| `onDragStart`            | `(activeId: string) => void`                                          | No       | Callback triggered when dragging starts on a pane.                                                                        |
-| `onDragEnd`              | `(activeId: string, overId: string \| null, dropAction: any) => void` | No       | Callback triggered when dragging ends, providing swap or split details.                                                   |
-| `onResizeStart`          | `(currentNode: SplitNode) => void`                                    | No       | Callback triggered when resizing starts on a split node.                                                                  |
-| `onResize`               | `(currentNode: SplitNode, percentage: number) => void`                | No       | Callback triggered continuously while resizing a split node.                                                              |
-| `onResizeEnd`            | `(currentNode: SplitNode, percentage: number) => void`                | No       | Callback triggered when resizing ends on a split node.                                                                    |
-| `minSplitPercentage`     | `number`                                                              | No       | Minimum resizing limit percentage. Defaults to `5`.                                                                       |
-| `maxSplitPercentage`     | `number`                                                              | No       | Maximum resizing limit percentage. Defaults to `95`.                                                                      |
-| `renderWidget`           | `(tabId: string) => ReactNode`                                        | No       | Render function mapping tab IDs to React elements. Used to render tab widgets inside portals.                             |
+The context provider that sets up the drag-and-drop state machine, monitors active drags, and registers layout change notifications. It extends `ZeugmaController` directly; you typically spread the controller object returned by `useZeugma` onto it.
+
+| Prop                 | Type                                                     | Required | Description                                                                                                               |
+| -------------------- | -------------------------------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------- |
+| `...controllerProps` | `ZeugmaController`                                       | Yes      | All properties returned by `useZeugma(options)`. Usually passed by spreading the controller object (e.g., `{...zeugma}`). |
+| `renderPane`         | `(paneId: string) => ReactNode`                          | Yes      | Renderer function lookup that returns a `<Pane>` structure.                                                               |
+| `classNames`         | `ZeugmaClassNames`                                       | No       | Custom classes for overriding pane, resizer, and drop preview overlays.                                                   |
+| `renderDragOverlay`  | `(activeId: string, type: 'pane' \| 'tab') => ReactNode` | No       | Renders a custom cursor-following drag preview overlay.                                                                   |
+| `renderWidget`       | `(tabId: string) => ReactNode`                           | No       | Render function mapping tab IDs to React elements. Used to render tab widgets inside portals.                             |
+
+### `useZeugma(options)`
+
+A custom state hook that initializes and manages the recursive layout tree and handles drag-and-drop actions.
+
+| Option                   | Type                                                                  | Default | Description                                                                |
+| ------------------------ | --------------------------------------------------------------------- | ------- | -------------------------------------------------------------------------- |
+| `initialLayout`          | `TreeNode \| null`                                                    | Yes     | Initial layout tree structure.                                             |
+| `locked`                 | `boolean`                                                             | `false` | If true, layout resizes and drags are disabled.                            |
+| `dragActivationDistance` | `number`                                                              | `8`     | Minimum pointer drag distance (in pixels) required to activate dragging.   |
+| `snapThreshold`          | `number`                                                              | `8`     | Threshold in pixels to snap layout resizers to adjacent edges.             |
+| `minSplitPercentage`     | `number`                                                              | `5`     | Minimum resizing limit percentage.                                         |
+| `maxSplitPercentage`     | `number`                                                              | `95`    | Maximum resizing limit percentage.                                         |
+| `enableDragToDismiss`    | `boolean`                                                             | `false` | If true, enables the drag-out-to-dismiss gesture to close widgets.         |
+| `dismissThreshold`       | `number`                                                              | `60`    | Distance in pixels outside container bounds required to trigger dismissal. |
+| `onRemove`               | `(paneId: string) => void`                                            | —       | Callback triggered when a pane is removed.                                 |
+| `onDragStart`            | `(activeId: string) => void`                                          | —       | Callback triggered when dragging starts.                                   |
+| `onDragEnd`              | `(activeId: string, overId: string \| null, dropAction: any) => void` | —       | Callback triggered when dragging ends.                                     |
+| `onResizeStart`          | `(currentNode: SplitNode) => void`                                    | —       | Callback triggered when resizing starts.                                   |
+| `onResize`               | `(currentNode: SplitNode, percentage: number) => void`                | —       | Callback triggered during resizing.                                        |
+| `onResizeEnd`            | `(currentNode: SplitNode, percentage: number) => void`                | —       | Callback triggered when resizing ends.                                     |
+| `onDismissIntentChange`  | `(paneId: string \| null) => void`                                    | —       | Callback triggered when drag-out intent changes.                           |
+
+### `useZeugmaContext()`
+
+A custom React context hook that returns the unified layout controller properties and state actions. Must be used within a `<Zeugma>` provider component.
+
+Provides direct access to the current layout state (e.g., `layout`, `locked`) and mutation actions (e.g., `addPane`, `removePane`, `splitPane`, `updateTabMetadata`, etc.).
+
+```ts
+const { layout, locked, addPane, removeTab } = useZeugmaContext()
+```
 
 ### `<PaneTree>`
 
@@ -189,10 +205,6 @@ Recursively scans the layout tree, removes the targeted pane node, and collapses
 
 Recursively matches the bottommost/rightmost pane leaf in the tree, splits it, and inserts the target `paneToAdd`.
 
-#### `swapPanes(tree: TreeNode | null, idA: string, idB: string): TreeNode | null`
-
-Swaps the positions of `idA` and `idB` nodes directly inside the tree structure.
-
 #### `splitPane(tree, targetId, direction, splitType, paneToAdd)`
 
 Splits the targeted `targetId` pane inside the tree with `direction` (_row_ / _column_) and type (_left_, _right_, _top_, _bottom_) to insert `paneToAdd`.
@@ -209,17 +221,13 @@ Use custom CSS or styling rules to style resizers, dragging states, drop preview
 
 ```tsx
 <Zeugma
-  layout={layout}
-  onChange={setLayout}
-  renderPane={renderPane}
+  {...zeugma}
   classNames={{
     // resizer handles
     resizer:
       'bg-transparent hover:bg-indigo-500/50 active:bg-indigo-500 transition-colors duration-150',
     // split previews
     dropPreview: 'bg-indigo-500/10 border-2 border-dashed border-indigo-500/50 backdrop-blur-xs',
-    // swap previews
-    swapPreview: 'bg-amber-500/10 border-2 border-dashed border-amber-500/50 backdrop-blur-xs',
   }}
 >
   <PaneTree />
@@ -250,77 +258,6 @@ export interface PaneNode {
 }
 
 export type TreeNode = SplitNode | PaneNode
-
-export interface ZeugmaClassNames {
-  pane?: string
-  dropPreview?: string
-  swapPreview?: string
-  dragOverlay?: string
-  resizer?: string
-  dragOut?: string
-}
-
-export interface PaneRenderProps {
-  isDragging: boolean
-  isFullscreen: boolean
-  toggleFullscreen: () => void
-  remove: () => void
-  metadata: Record<string, unknown> | undefined
-  updateMetadata: (
-    updater: (current: Record<string, unknown> | undefined) => Record<string, unknown> | undefined,
-  ) => void
-  tabs: string[]
-  activeTabId: string
-  selectTab: (tabId: string) => void
-  removeTab: (tabId: string) => void
-  tabsMetadata: Record<string, Record<string, unknown>> | undefined
-  updateTabMetadata: (
-    tabId: string,
-    updater: (current: Record<string, unknown> | undefined) => Record<string, unknown> | undefined,
-  ) => void
-  renderActiveTab: () => ReactNode
-}
-
-export interface ZeugmaStateValue {
-  layout: TreeNode | null
-  onLayoutChange: (newLayout: TreeNode | null) => void
-  renderPane: (paneId: string) => ReactNode
-  activeId: string | null
-  dismissIntentId: string | null
-  setContainerRef: (element: HTMLElement | null) => void
-  fullscreenPaneId: string | null
-  classNames: ZeugmaClassNames
-  onRemove?: (paneId: string) => void
-  onFullscreenChange?: (paneId: string | null) => void
-  snapThreshold?: number
-  onResizeStart?: (currentNode: SplitNode) => void
-  onResize?: (currentNode: SplitNode, percentage: number) => void
-  onResizeEnd?: (currentNode: SplitNode, percentage: number) => void
-  minSplitPercentage?: number
-  maxSplitPercentage?: number
-}
-
-export interface ZeugmaActionsValue {
-  removePane: (paneId: string) => void
-  addPane: (paneId: string) => void
-  swapPanes: (paneIdA: string, paneIdB: string) => void
-  splitPane: (
-    targetId: string,
-    direction: SplitDirection,
-    splitType: 'left' | 'right' | 'top' | 'bottom',
-    paneToAdd: string,
-  ) => void
-  updateSplitPercentage: (currentNode: SplitNode, percentage: number) => void
-  updateTabMetadata: (
-    tabId: string,
-    updater: (current: Record<string, unknown> | undefined) => Record<string, unknown> | undefined,
-  ) => void
-  updatePaneLock: (paneId: string, locked: boolean) => void
-  selectTab: (paneId: string, tabId: string) => void
-  mergeTab: (draggedTabId: string, targetPaneId: string) => void
-  moveTab: (draggedTabId: string, targetTabId: string, position?: 'before' | 'after') => void
-  removeTab: (tabId: string) => void
-}
 ```
 
 ---
@@ -380,27 +317,42 @@ The root context provider. It handles the drag-and-drop event loop and coordinat
 
 #### Props
 
-- `layout: TreeNode | null` — The current dashboard layout tree.
-- `onChange: (newLayout: TreeNode | null) => void` — Callback triggered when the layout tree changes (resizing, dragging to split, dragging to swap).
+- `...controllerProps: ZeugmaController` — The controller properties returned by the `useZeugma` hook (typically passed via `{...zeugma}`).
 - `renderPane: (paneId: string) => ReactNode` — Callback to render the contents of a pane given its ID.
 - `renderDragOverlay?: (activeId: string, type: 'pane' | 'tab') => ReactNode` — (Optional) Renders a custom cursor-following drag preview.
 - `classNames?: ZeugmaClassNames` — (Optional) CSS class overrides for styling various layout elements.
-- `fullscreenPaneId?: string | null` — (Optional) ID of the pane currently in fullscreen mode.
-- `onFullscreenChange?: (paneId: string | null) => void` — (Optional) Callback triggered when a pane enters/leaves fullscreen.
-- `onRemove?: (paneId: string) => void` — (Optional) Callback triggered when a pane is closed/removed.
-- `dragActivationDistance?: number` — (Optional) Minimum pointer drag distance (in pixels) required to activate dragging. Defaults to `8`.
-- `enableDragToDismiss?: boolean` — (Optional) Whether to enable the drag-out-to-dismiss gesture. Defaults to `false`.
-- `dragOutThreshold?: number` — (Optional) Distance in pixels outside the container boundaries required to activate drag-out mode. Defaults to `60`.
-- `onDragOutChange?: (activeId: string | null) => void` — (Optional) Callback triggered when the drag-out state changes.
-- `onDragStart?: (activeId: string) => void` — (Optional) Callback triggered when dragging starts on a pane.
-- `onDragEnd?: (activeId: string, overId: string | null, dropAction: any) => void` — (Optional) Callback triggered when dragging ends, providing swap or split details.
-- `onResizeStart?: (currentNode: SplitNode) => void` — (Optional) Callback triggered when resizing starts.
-- `onResize?: (currentNode: SplitNode, percentage: number) => void` — (Optional) Callback triggered during resizing.
-- `onResizeEnd?: (currentNode: SplitNode, percentage: number) => void` — (Optional) Callback triggered when resizing ends.
-- `minSplitPercentage?: number` — (Optional) Minimum resizing limit percentage (defaults to `5`).
-- `maxSplitPercentage?: number` — (Optional) Maximum resizing limit percentage (defaults to `95`).
 - `renderWidget?: (tabId: string) => ReactNode` — (Optional) Render function mapping tab IDs to React elements. Used to render tab widgets inside portals.
 
+### `useZeugma(options)`
+
+A custom hook to manage the dashboard layout state.
+
+#### Options
+
+- `initialLayout: TreeNode | null` — Initial layout tree.
+- `locked?: boolean` — Whether the layout is globally locked.
+- `dragActivationDistance?: number` — Minimum pointer drag distance (in pixels) required to activate dragging (defaults to `8`).
+- `snapThreshold?: number` — Threshold in pixels to snap layout resizers to adjacent edges (defaults to `8`).
+- `minSplitPercentage?: number` — Minimum resizing limit percentage (defaults to `5`).
+- `maxSplitPercentage?: number` — Maximum resizing limit percentage (defaults to `95`).
+- `enableDragToDismiss?: boolean` — Whether to enable drag-out-to-dismiss (defaults to `false`).
+- `dismissThreshold?: number` — Distance in pixels outside container bounds required to trigger dismissal (defaults to `60`).
+- `onRemove?: (paneId: string) => void` — Callback when a pane is removed.
+- `onDragStart?: (activeId: string) => void` — Callback when dragging starts.
+- `onDragEnd?: (activeId: string, overId: string | null, dropAction: any) => void` — Callback when dragging ends.
+- `onResizeStart?: (currentNode: SplitNode) => void` — Callback when resizing starts.
+- `onResize?: (currentNode: SplitNode, percentage: number) => void` — Callback during resizing.
+- `onResizeEnd?: (currentNode: SplitNode, percentage: number) => void` — Callback when resizing ends.
+- `onDismissIntentChange?: (paneId: string | null) => void` — Callback when drag-out intent changes.
+
+### `useZeugmaContext()`
+
+A context consumer hook that retrieves the parent `<Zeugma>` controller state and actions.
+
+```ts
+const { layout, addPane, removeTab } = useZeugmaContext()
+```
+
 ### `<PaneTree>`
 
 Recursively renders the split nodes and pane nodes. Must be placed inside `<Zeugma>`.
@@ -480,46 +432,24 @@ Import these helpers from `react-zeugma` to manipulate the tree layout programma
   Removes a pane from the tree and collapses the leftover sibling split node.
 - **`splitPane(tree: TreeNode | null, targetId: string, direction: SplitDirection, splitType: 'left' | 'right' | 'top' | 'bottom', paneToAdd: string): TreeNode | null`**
   Splits a specific target pane by nesting it under a new `SplitNode` along with a new pane.
-- **`swapPanes(tree: TreeNode | null, idA: string, idB: string): TreeNode | null`**
-  Swaps the positions of two panes in the tree.
 - **`updateTabMetadata(tree: TreeNode | null, tabId: string, updater: (current: Record<string, unknown> | undefined) => Record<string, unknown> | undefined): TreeNode | null`**
   Updates the metadata of a specific tab.
 - **`findPane(tree: TreeNode | null, paneId: string): PaneNode | null`**
   Recursively searches the layout tree and returns the target `PaneNode` if found, or `null` otherwise.
 
-Alternatively, you can consume state and mutation helpers directly from the context hooks:
-
-- **`useZeugmaState()`**: Returns the reactive state values (e.g., `layout`, `activeId`, `classNames`). Consumers of this hook will re-render whenever layout state updates.
-- **`useZeugmaActions()`**: Returns the stable layout mutation actions (e.g., `removePane`, `splitPane`). Because these actions have a permanent identity, consumers of this hook **will not** re-render when layout state changes, providing a significant performance optimization.
-
-The actions returned by `useZeugmaActions()` are:
-
-- **`removePane(paneId: string) => void`**
-- **`addPane(paneId: string) => void`**
-- **`swapPanes(paneIdA: string, paneIdB: string) => void`**
-- **`splitPane(targetId: string, direction: SplitDirection, splitType: string, paneToAdd: string) => void`**
-- **`updateSplitPercentage(currentNode: SplitNode, percentage: number) => void`**
-- **`updateTabMetadata(tabId: string, updater: (current: Record<string, unknown> | undefined) => Record<string, unknown> | undefined) => void`**
-- **`updatePaneLock(paneId: string, locked: boolean) => void`**
-- **`selectTab(paneId: string, tabId: string) => void`**
-- **`mergeTab(draggedTabId: string, targetPaneId: string) => void`**
-- **`moveTab(draggedTabId: string, targetTabId: string, position?: 'before' | 'after') => void`**
-- **`removeTab(tabId: string) => void`**
-
 ---
 
 ## 4. Basic Integration Recipe
 
 ```tsx
-import { useState } from 'react'
-import { Zeugma, PaneTree, Pane, DragHandle, TreeNode } from 'react-zeugma'
+import { useZeugma, Zeugma, PaneTree, Pane, DragHandle, TreeNode } from 'react-zeugma'
 
 const initialLayout: TreeNode = {
   type: 'split',
   direction: 'row',
   splitPercentage: 50,
-  first: { type: 'pane', paneId: 'sidebar' },
-  second: { type: 'pane', paneId: 'main' },
+  first: { type: 'pane', id: 'sidebar', tabs: ['sidebar'], activeTabId: 'sidebar' },
+  second: { type: 'pane', id: 'main', tabs: ['main'], activeTabId: 'main' },
 }
 
 function CustomPane({ id }: { id: string }) {
@@ -544,23 +474,12 @@ function CustomPane({ id }: { id: string }) {
 }
 
 export default function App() {
-  const [layout, setLayout] = useState<TreeNode | null>(initialLayout)
-  const [fullscreenId, setFullscreenId] = useState<string | null>(null)
-
-  const handleRemove = (paneId: string) => {
-    // Remove the pane and update layout
-    setLayout((prev) => removePane(prev, paneId))
-  }
+  const zeugma = useZeugma({
+    initialLayout,
+  })
 
   return (
-    <Zeugma
-      layout={layout}
-      onChange={setLayout}
-      renderPane={(id) => <CustomPane id={id} />}
-      fullscreenPaneId={fullscreenId}
-      onFullscreenChange={setFullscreenId}
-      onRemove={handleRemove}
-    >
+    <Zeugma {...zeugma} renderPane={(id) => <CustomPane id={id} />}>
       <div style={{ width: '100vw', height: '100vh' }}>
         <PaneTree />
       </div>
@@ -579,7 +498,6 @@ export default function App() {
 interface ZeugmaClassNames {
   pane?: string // Applied to the outer wrapper of <Pane>
   dropPreview?: string // Applied to the preview box when hovering over edge dropzones
-  swapPreview?: string // Applied to the preview box when hovering over center dropzone
   dragOverlay?: string // Applied to the cursor-following drag preview portal
   resizer?: string // Applied to the drag-to-resize split bar
 }
@@ -598,16 +516,6 @@ interface ZeugmaClassNames {
 }
 
 /* Edge drop previews */
-.my-drop-preview {
-  background-color: rgba(59, 130, 246, 0.2);
-  border: 2px dashed #3b82f6;
-}
-
-/* Center swap preview */
-.my-swap-preview {
-  background-color: rgba(16, 185, 129, 0.25);
-  border: 2px solid #10b981;
-}
 ```
 ````
 

package/dist/index.cjs

@@ -1,7 +1,7 @@
-'use strict';var nn=require('react'),reactDom=require('react-dom'),core=require('@dnd-kit/core'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var nn__default=/*#__PURE__*/_interopDefault(nn);var De=nn.createContext(void 0),Me=nn.createContext(void 0);var Q=()=>{let e=nn.useContext(De);if(!e)throw new Error("useZeugmaState must be used within a Zeugma provider");return e},We=()=>{let e=nn.useContext(Me);if(!e)throw new Error("useZeugmaActions must be used within a Zeugma provider");return e};function bt(e){let t=nn.useRef(null);return nn.useEffect(()=>{if(!e){t.current=null;return}let r=n=>{t.current={x:n.clientX,y:n.clientY};},i=n=>{let o=n.touches[0]||n.changedTouches[0];o&&(t.current={x:o.clientX,y:o.clientY});};return window.addEventListener("pointermove",r,{passive:true}),window.addEventListener("touchmove",i,{passive:true}),()=>{window.removeEventListener("pointermove",r),window.removeEventListener("touchmove",i);}},[e]),t}function gt(e){nn.useEffect(()=>(e?document.body.style.setProperty("cursor","not-allowed","important"):document.body.style.removeProperty("cursor"),()=>{document.body.style.removeProperty("cursor");}),[e]);}function vt(){let[e,t]=nn.useState({}),r=nn.useCallback((i,n)=>{t(o=>o[i]===n?o:{...o,[i]:n});},[]);return {portalTargets:e,registerPortalTarget:r}}var Ce=nn.createContext(void 0);function he(e,t){if(e===null)return null;if(e.type==="pane")return e.id===t?null:e;let r=he(e.first,t),i=he(e.second,t);return r===null?i:i===null?r:{...e,first:r,second:i}}function de(e,t){if(e===null)return null;if(e.type==="pane"){if(e.tabs.includes(t)){let n=e.tabs.filter(s=>s!==t);if(n.length===0)return null;let o=e.activeTabId;return e.activeTabId===t&&(o=n[0]),{...e,tabs:n,activeTabId:o}}return e}let r=de(e.first,t),i=de(e.second,t);return r===null?i:i===null?r:{...e,first:r,second:i}}function we(e,t,r,i,n){if(e===null)return typeof n=="string"?{type:"pane",id:n,tabs:[n],activeTabId:n}:n;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){let o=typeof n=="string"?{type:"pane",id:n,tabs:[n],activeTabId:n}:n,s=i==="left"||i==="top";return {type:"split",direction:r,first:s?o:e,second:s?e:o,splitPercentage:50}}return e}return {...e,first:we(e.first,t,r,i,n)||e.first,second:we(e.second,t,r,i,n)||e.second}}function _e(e,t,r){if(e===null)return null;let i=_(e,t),n=_(e,r);if(!i||!n)return e;function o(s){return s.type==="pane"?s.id===i.id?{...n}:s.id===n.id?{...i}:s:{...s,first:o(s.first),second:o(s.second)}}return o(e)}function ht(e,t){if(e===null)return {type:"pane",id:t,tabs:[t],activeTabId:t};function r(i,n){return i.type==="pane"?{type:"split",direction:n==="row"?"column":"row",splitPercentage:50,first:i,second:{type:"pane",id:t,tabs:[t],activeTabId:t}}:{...i,second:r(i.second,i.direction)}}return r(e,null)}function pe(e,t,r){return e===null?null:e===t?{...e,splitPercentage:r}:e.type==="split"?{...e,first:pe(e.first,t,r)||e.first,second:pe(e.second,t,r)||e.second}:e}function _(e,t){return e===null?null:e.type==="pane"?e.id===t||e.tabs.includes(t)?e:null:_(e.first,t)??_(e.second,t)}function ze(e,t,r){if(e===null)return null;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){let i=e.tabsMetadata||{},n=i[t],o=r(n),s={...i};return o===void 0?delete s[t]:s[t]=o,{...e,tabsMetadata:Object.keys(s).length>0?s:void 0}}return e}return {...e,first:ze(e.first,t,r)??e.first,second:ze(e.second,t,r)??e.second}}function $e(e,t,r){if(e===null)return null;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){if(r===false){let{locked:i,...n}=e;return n}return {...e,locked:r}}return e}return {...e,first:$e(e.first,t,r)??e.first,second:$e(e.second,t,r)??e.second}}function Ie(e,t,r){return e===null?null:e.type==="pane"?e.id===t||e.tabs.includes(t)?{...e,activeTabId:r}:e:{...e,first:Ie(e.first,t,r)??e.first,second:Ie(e.second,t,r)??e.second}}function Pt(e,t,r){if(e===null)return null;let n=_(e,t)?.tabsMetadata?.[t],o=de(e,t);if(o===null)return {type:"pane",id:t,tabs:[t],activeTabId:t,tabsMetadata:n?{[t]:n}:void 0};function s(c){if(c.type==="pane"){if(c.id===r||c.tabs.includes(r)){let d=[...c.tabs];d.includes(t)||d.push(t);let T={...c.tabsMetadata};return n&&(T[t]=n),{...c,tabs:d,activeTabId:t,tabsMetadata:Object.keys(T).length>0?T:void 0}}return c}return {...c,first:s(c.first),second:s(c.second)}}return s(o)}function Ye(e,t,r,i="before"){if(e===null)return null;let o=_(e,t)?.tabsMetadata?.[t],s=de(e,t);if(s===null)return {type:"pane",id:t,tabs:[t],activeTabId:t,tabsMetadata:o?{[t]:o}:void 0};function c(d){if(d.type==="pane"){if(d.id===r||d.tabs.includes(r)){let S=[...d.tabs].filter(x=>x!==t),g=S.indexOf(r);g<0&&(g=0),i==="after"&&(g+=1),S.splice(g,0,t);let p={...d.tabsMetadata};return o&&(p[t]=o),{...d,tabs:S,activeTabId:t,tabsMetadata:Object.keys(p).length>0?p:void 0}}return d}return {...d,first:c(d.first),second:c(d.second)}}return c(s)}function j(e,t=0,r=0,i=100,n=100,o="root"){if(e===null)return {panes:[],splitters:[]};if(e.type==="pane")return {panes:[{paneId:e.id,left:t,top:r,width:i,height:n,node:e}],splitters:[]};let{direction:s,splitPercentage:c,first:d,second:T}=e,g={id:`splitter-${o}-${s}`,currentNode:e,direction:s,left:s==="row"?t+i*(c/100):t,top:s==="column"?r+n*(c/100):r,width:s==="row"?0:i,height:s==="column"?0:n,parentLeft:t,parentTop:r,parentWidth:i,parentHeight:n},p={panes:[],splitters:[]},x={panes:[],splitters:[]};if(s==="row"){let P=i*(c/100);p=j(d,t,r,P,n,`${o}-L`),x=j(T,t+P,r,i-P,n,`${o}-R`);}else {let P=n*(c/100);p=j(d,t,r,i,P,`${o}-T`),x=j(T,t,r+P,i,n-P,`${o}-B`);}return {panes:[...p.panes,...x.panes],splitters:[g,...p.splitters,...x.splitters]}}var Ot=8,Vt=8,Vn=4;var yt=({activeId:e,render:t,className:r})=>{let i=nn.useRef(null);return nn.useEffect(()=>{let n=o=>{i.current&&(i.current.style.transform=`translate(${o.clientX+12}px, ${o.clientY+12}px)`);};return document.addEventListener("pointermove",n),()=>document.removeEventListener("pointermove",n)},[]),jsxRuntime.jsx("div",{ref:i,className:r,style:{position:"fixed",top:0,left:0,zIndex:9999,pointerEvents:"none"},children:t(e)})};var ke=class extends core.PointerSensor{static activators=[{eventName:"onPointerDown",handler:({nativeEvent:t})=>!t.target?.closest(".drag-cancel")}]},He=class extends core.TouchSensor{static activators=[{eventName:"onTouchStart",handler:({nativeEvent:t})=>!t.target?.closest(".drag-cancel")}]};function Be(e){if(e instanceof MouseEvent||e instanceof PointerEvent)return {x:e.clientX,y:e.clientY};if(typeof TouchEvent<"u"&&e instanceof TouchEvent){let t=e.touches[0]||e.changedTouches[0];if(t)return {x:t.clientX,y:t.clientY}}return null}var Qt=({layout:e,onChange:t,renderPane:r,renderWidget:i,renderDragOverlay:n,classNames:o={},fullscreenPaneId:s=null,onFullscreenChange:c,onRemove:d,dragActivationDistance:T=8,snapThreshold:S=8,onDragStart:g,onDragEnd:p,onResizeStart:x,onResize:P,onResizeEnd:E,minSplitPercentage:N=5,maxSplitPercentage:$=95,enableDragToDismiss:b=false,dismissThreshold:y=60,onDismissIntentChange:R,locked:I=false,children:B})=>{let[l,w]=nn.useState(e),[k,ee]=nn.useState(e);e!==k&&(ee(e),w(e));let[D,V]=nn.useState(null),[q,Y]=nn.useState(null),[v,H]=nn.useState(null),{portalTargets:G,registerPortalTarget:F}=vt(),M=nn.useRef(null),f=nn.useRef(null),O=bt(D),me=nn.useCallback(a=>{M.current=a;},[]),[U,le]=nn.useState(false);gt(U);let xe=nn.useCallback(a=>r(a),[r]),be=nn.useMemo(()=>o,[o.pane,o.paneLocked,o.dropPreview,o.swapPreview,o.dragOverlay,o.resizer,o.dismissPreview,o.dashboardLocked,o.lockedPreview]),Se=core.useSensors(core.useSensor(ke,{activationConstraint:{distance:T}}),core.useSensor(He,{activationConstraint:{delay:250,tolerance:5}})),ge=nn.useCallback(a=>{let u=core.pointerWithin(a);if(u.length>0)return u;if(a.active.id.toString().startsWith("tab-header-")){let C=a.droppableContainers.filter(W=>W.id.toString().startsWith("tab-drop-"));return core.closestCenter({...a,droppableContainers:C})}return []},[]),ce=a=>{let u=a.active.id.toString(),m=u.startsWith("tab-header-"),C=m?u.substring(11):u;V(C),Y(m?"tab":"pane");let W=a.activatorEvent;O.current=Be(W),b&&M.current?f.current=M.current.getBoundingClientRect():f.current=null,g&&g(C);},te=a=>{let{over:u}=a,C=(u?.id.toString()||"").startsWith("drop-locked-");if(le(C),!b)return;let W=a.active.id.toString(),ne=W.startsWith("tab-header-")?W.substring(11):W,L=f.current;if(!L){v!==null&&(H(null),R?.(null));return}let Ee=a.activatorEvent,K=null,J=null;if(O.current)K=O.current.x,J=O.current.y;else {let z=Be(Ee);z&&(K=z.x+a.delta.x,J=z.y+a.delta.y);}let re=0;if(K!==null&&J!==null){let z=0,X=0;K<L.left?z=L.left-K:K>L.right&&(z=K-L.right),J<L.top?X=L.top-J:J>L.bottom&&(X=J-L.bottom),re=Math.sqrt(z*z+X*X);}else {let z=a.active.rect.current.translated;if(z){let X=z.left+z.width/2,ve=z.top+z.height/2,ue=0,oe=0;X<L.left?ue=L.left-X:X>L.right&&(ue=X-L.right),ve<L.top?oe=L.top-ve:ve>L.bottom&&(oe=ve-L.bottom),re=Math.sqrt(ue*ue+oe*oe);}}re>y?v!==ne&&(H(ne),R?.(ne)):v!==null&&(H(null),R?.(null));},A=a=>{V(null),Y(null),le(false);let{active:u,over:m}=a,C=u.id.toString(),W=C.startsWith("tab-header-"),h=W?C.substring(11):C,ne=b&&v===h;if(H(null),R?.(null),f.current=null,ne){d?d(h):Ve(h),p&&p(h,null,null);return}if(!m){p&&p(h,null,null);return}let L=m.id.toString();if(L.startsWith("drop-locked-")){p&&p(h,null,null);return}let Ee=L.match(/^tab-drop-(.+)$/);if(Ee){let[,ie]=Ee;if(h!==ie){let se="before",ut=m.rect,kt=a.activatorEvent,Le=null;if(O.current)Le=O.current.x;else {let Ne=Be(kt);Ne&&(Le=Ne.x+a.delta.x);}if(Le!==null){let Ne=ut.left+ut.width/2;Le>Ne&&(se="after");}let dt=Ye(l,h,ie,se);w(dt),t(dt);}p&&p(h,ie,{type:"swap",position:"center"});return}let K=L.match(/^drop-center-(.+)$/);if(K){let[,ie]=K;if(h!==ie){let se=_e(l,h,ie);w(se),t(se);}p&&p(h,ie,{type:"swap",position:"center"});return}let J=L.match(/^drop-(left|right|top|bottom)-(.+)$/);if(!J){p&&p(h,null,null);return}let[,re,Te]=J,z=_(l,h),X=z&&z.id===Te,ve=z&&z.tabs.length===1;if(h===Te||X&&ve){p&&p(h,null,null);return}let ue=re==="left"||re==="right"?"row":"column",oe;if(W){let se=_(l,h)?.tabsMetadata?.[h];oe={type:"pane",id:h,tabs:[h],activeTabId:h,tabsMetadata:se?{[h]:se}:void 0};}else oe=_(l,h)??{type:"pane",id:h,tabs:[h],activeTabId:h};let It=W?de(l,h):he(l,h),ct=we(It,Te,ue,re,oe);w(ct),t(ct),p&&p(h,Te,{type:"split",direction:ue,position:re});},Je=nn.useCallback((a,u=false)=>{w(a),u||t(a);},[t]),Qe=nn.useCallback(a=>{let u=he(l,a);w(u),t(u);},[l,t]),je=nn.useCallback(a=>{let u=ht(l,a);w(u),t(u);},[l,t]),et=nn.useCallback((a,u)=>{let m=_e(l,a,u);w(m),t(m);},[l,t]),tt=nn.useCallback((a,u,m,C)=>{let W=_(l,C)??{type:"pane",id:C,tabs:[C],activeTabId:C},h=he(l,C),ne=we(h,a,u,m,W);w(ne),t(ne);},[l,t]),nt=nn.useCallback((a,u)=>{let m=Ie(l,a,u);w(m),t(m);},[l,t]),rt=nn.useCallback((a,u)=>{let m=Pt(l,a,u);w(m),t(m);},[l,t]),ot=nn.useCallback((a,u,m)=>{let C=Ye(l,a,u,m);w(C),t(C);},[l,t]),Ve=nn.useCallback(a=>{let u=de(l,a);w(u),t(u);},[l,t]),it=nn.useCallback((a,u)=>{let m=pe(l,a,u);w(m),t(m);},[l,t]),st=nn.useCallback((a,u)=>{let m=ze(l,a,u);w(m),t(m);},[l,t]),at=nn.useCallback((a,u)=>{let m=$e(l,a,u);w(m),t(m);},[l,t]),lt=nn.useCallback((a,u)=>{E&&E(a,u);},[E]),Mt=nn.useMemo(()=>({layout:l,onLayoutChange:Je,renderPane:xe,activeId:D,dismissIntentId:v,setContainerRef:me,fullscreenPaneId:s,classNames:be,onRemove:d,onFullscreenChange:c,snapThreshold:S,onResizeStart:x,onResize:P,onResizeEnd:lt,minSplitPercentage:N,maxSplitPercentage:$,locked:I}),[l,D,v,me,s,be,d,c,S,x,P,N,$,Je,xe,lt,I]),Ct=nn.useMemo(()=>({removePane:Qe,addPane:je,swapPanes:et,splitPane:tt,updateSplitPercentage:it,updateTabMetadata:st,updatePaneLock:at,selectTab:nt,mergeTab:rt,moveTab:ot,removeTab:Ve}),[Qe,je,et,tt,it,st,at,nt,rt,ot,Ve]),zt=nn.useMemo(()=>{let a=[];function u(m){m&&(m.type==="pane"?a.push(...m.tabs):(u(m.first),u(m.second)));}return u(l),a},[l]),$t=nn.useMemo(()=>({registerPortalTarget:F}),[F]);return jsxRuntime.jsx(Me.Provider,{value:Ct,children:jsxRuntime.jsx(De.Provider,{value:Mt,children:jsxRuntime.jsxs(Ce.Provider,{value:$t,children:[jsxRuntime.jsx(core.DndContext,{id:"zeugma-dnd-context",sensors:Se,collisionDetection:ge,onDragStart:ce,onDragMove:te,onDragEnd:A,children:B}),D&&q&&n&&jsxRuntime.jsx(yt,{activeId:D,render:a=>n(a,q),className:`${o.dragOverlay||""} ${D===v?o.dismissPreview||"zeugma-dismiss-preview":""}`.trim()}),jsxRuntime.jsx("div",{id:"zeugma-portal-host",style:{display:"none"},children:zt.map(a=>jsxRuntime.jsx(jt,{tabId:a,target:G[a]||null,renderWidget:i},a))})]})})})},jt=({tabId:e,target:t,renderWidget:r})=>{let i=nn.useRef(null);!i.current&&typeof window<"u"&&(i.current=document.createElement("div"),i.current.className=`zeugma-portal-wrapper-${e}`,i.current.style.width="100%",i.current.style.height="100%");let n=i.current;return nn.useEffect(()=>{if(n)if(t)t.appendChild(n);else {let o=document.getElementById("zeugma-hidden-portal-container");o||(o=document.createElement("div"),o.id="zeugma-hidden-portal-container",o.style.display="none",document.body.appendChild(o)),o.appendChild(n);}},[t,n]),nn.useEffect(()=>()=>{i.current&&i.current.remove();},[]),!n||!r?null:reactDom.createPortal(r(e),n)};function Ze({cursor:e,resizerEl:t,onMove:r,onEnd:i}){document.body.classList.add("zeugma-resizing");let n=document.createElement("style");n.id="zeugma-global-cursor-style",n.textContent=`
+'use strict';var tn=require('react'),reactDom=require('react-dom'),core=require('@dnd-kit/core'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var tn__default=/*#__PURE__*/_interopDefault(tn);var ze=tn.createContext(void 0),Ie=tn.createContext(void 0);var ee=()=>{let e=tn.useContext(ze);if(!e)throw new Error("useZeugmaState must be used within a Zeugma provider");return e},$e=()=>{let e=tn.useContext(Ie);if(!e)throw new Error("useZeugmaActions must be used within a Zeugma provider");return e};function st(e){let t=tn.useRef(null);return tn.useEffect(()=>{if(!e){t.current=null;return}let r=n=>{t.current={x:n.clientX,y:n.clientY};},s=n=>{let o=n.touches[0]||n.changedTouches[0];o&&(t.current={x:o.clientX,y:o.clientY});};return window.addEventListener("pointermove",r,{passive:true}),window.addEventListener("touchmove",s,{passive:true}),()=>{window.removeEventListener("pointermove",r),window.removeEventListener("touchmove",s);}},[e]),t}function it(e){tn.useEffect(()=>(e?document.body.style.setProperty("cursor","not-allowed","important"):document.body.style.removeProperty("cursor"),()=>{document.body.style.removeProperty("cursor");}),[e]);}function at(){let[e,t]=tn.useState({}),r=tn.useRef(true);tn.useEffect(()=>(r.current=true,()=>{r.current=false;}),[]);let s=tn.useCallback((n,o)=>{setTimeout(()=>{r.current&&t(i=>i[n]===o?i:{...i,[n]:o});},0);},[]);return {portalTargets:e,registerPortalTarget:s}}var ke=tn.createContext(void 0);var Ht=8,At=8,Fn=4;function ie(){return "pane-"+Math.random().toString(36).substring(2,11)}function be(e,t){if(e===null)return null;if(e.type==="pane")return e.id===t?null:e;let r=be(e.first,t),s=be(e.second,t);return r===null?s:s===null?r:{...e,first:r,second:s}}function de(e,t){if(e===null)return null;if(e.type==="pane"){if(e.tabs.includes(t)){let n=e.tabs.filter(a=>a!==t);if(n.length===0)return null;let o=e.activeTabId;e.activeTabId===t&&(o=n[0]);let i={...e.tabsMetadata};return delete i[t],{...e,tabs:n,activeTabId:o,tabsMetadata:Object.keys(i).length>0?i:void 0}}return e}let r=de(e.first,t),s=de(e.second,t);return r===null?s:s===null?r:{...e,first:r,second:s}}function ye(e,t,r,s,n){if(e===null)return typeof n=="string"?{type:"pane",id:ie(),tabs:[n],activeTabId:n}:n;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){let o=typeof n=="string"?{type:"pane",id:ie(),tabs:[n],activeTabId:n}:n,i=s==="left"||s==="top";return {type:"split",direction:r,first:i?o:e,second:i?e:o,splitPercentage:50}}return e}return {...e,first:ye(e.first,t,r,s,n)||e.first,second:ye(e.second,t,r,s,n)||e.second}}function lt(e,t){if(e===null)return {type:"pane",id:ie(),tabs:[t],activeTabId:t};function r(s,n){return s.type==="pane"?{type:"split",direction:n==="row"?"column":"row",splitPercentage:50,first:s,second:{type:"pane",id:ie(),tabs:[t],activeTabId:t}}:{...s,second:r(s.second,s.direction)}}return r(e,null)}function ve(e,t,r){return e===null?null:e===t?{...e,splitPercentage:r}:e.type==="split"?{...e,first:ve(e.first,t,r)||e.first,second:ve(e.second,t,r)||e.second}:e}function q(e,t){return e===null?null:e.type==="pane"?e.id===t||e.tabs.includes(t)?e:null:q(e.first,t)??q(e.second,t)}function Ze(e,t,r){if(e===null)return null;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){let s=e.tabsMetadata||{},n=s[t],o=r(n),i={...s};return o===void 0?delete i[t]:i[t]=o,{...e,tabsMetadata:Object.keys(i).length>0?i:void 0}}return e}return {...e,first:Ze(e.first,t,r)??e.first,second:Ze(e.second,t,r)??e.second}}function He(e,t,r){if(e===null)return null;if(e.type==="pane"){if(e.id===t||e.tabs.includes(t)){if(r===false){let{locked:s,...n}=e;return n}return {...e,locked:r}}return e}return {...e,first:He(e.first,t,r)??e.first,second:He(e.second,t,r)??e.second}}function Ae(e,t,r){return e===null?null:e.type==="pane"?e.id===t||e.tabs.includes(t)?{...e,activeTabId:r}:e:{...e,first:Ae(e.first,t,r)??e.first,second:Ae(e.second,t,r)??e.second}}function ct(e,t,r){if(e===null)return null;let n=q(e,t)?.tabsMetadata?.[t],o=de(e,t);if(o===null)return {type:"pane",id:ie(),tabs:[t],activeTabId:t,tabsMetadata:n?{[t]:n}:void 0};function i(a){if(a.type==="pane"){if(a.id===r||a.tabs.includes(r)){let l=[...a.tabs];l.includes(t)||l.push(t);let y={...a.tabsMetadata};return n&&(y[t]=n),{...a,tabs:l,activeTabId:t,tabsMetadata:Object.keys(y).length>0?y:void 0}}return a}return {...a,first:i(a.first),second:i(a.second)}}return i(o)}function ut(e,t,r,s="before"){if(e===null)return null;let o=q(e,t)?.tabsMetadata?.[t],i=de(e,t);if(i===null)return {type:"pane",id:ie(),tabs:[t],activeTabId:t,tabsMetadata:o?{[t]:o}:void 0};function a(l){if(l.type==="pane"){if(l.id===r||l.tabs.includes(r)){let D=[...l.tabs].filter(x=>x!==t),c=D.indexOf(r);c<0&&(c=0),s==="after"&&(c+=1),D.splice(c,0,t);let T={...l.tabsMetadata};return o&&(T[t]=o),{...l,tabs:D,activeTabId:t,tabsMetadata:Object.keys(T).length>0?T:void 0}}return l}return {...l,first:a(l.first),second:a(l.second)}}return a(i)}function se(e,t=0,r=0,s=100,n=100,o="root"){if(e===null)return {panes:[],splitters:[]};if(e.type==="pane")return {panes:[{paneId:e.id,left:t,top:r,width:s,height:n,node:e}],splitters:[]};let{direction:i,splitPercentage:a,first:l,second:y}=e,c={id:`splitter-${o}-${i}`,currentNode:e,direction:i,left:i==="row"?t+s*(a/100):t,top:i==="column"?r+n*(a/100):r,width:i==="row"?0:s,height:i==="column"?0:n,parentLeft:t,parentTop:r,parentWidth:s,parentHeight:n},T={panes:[],splitters:[]},x={panes:[],splitters:[]};if(i==="row"){let v=s*(a/100);T=se(l,t,r,v,n,`${o}-L`),x=se(y,t+v,r,s-v,n,`${o}-R`);}else {let v=n*(a/100);T=se(l,t,r,s,v,`${o}-T`),x=se(y,t,r+v,s,n-v,`${o}-B`);}return {panes:[...T.panes,...x.panes],splitters:[c,...T.splitters,...x.splitters]}}function Ft(e){let{initialLayout:t,onChange:r,fullscreenPaneId:s,onFullscreenChange:n,locked:o=false,dragActivationDistance:i=8,snapThreshold:a=8,minSplitPercentage:l=5,maxSplitPercentage:y=95,enableDragToDismiss:D=false,dismissThreshold:c=60,onRemove:T,onDragStart:x,onDragEnd:v,onResizeStart:R,onResize:E,onResizeEnd:L,onDismissIntentChange:p}=e,[b,f]=tn.useState(t),[z,A]=tn.useState(s||null),[I,V]=tn.useState(o),[w,K]=tn.useState(null),[h,F]=tn.useState(null),[Y,O]=tn.useState(null),m=tn.useRef(null),$=tn.useCallback(u=>{m.current=u;},[]),_=tn.useCallback(u=>{A(u),n?.(u);},[n]);tn.useEffect(()=>{V(o);},[o]),tn.useEffect(()=>{s!==void 0&&A(s);},[s]);let k=tn.useRef(true);tn.useEffect(()=>{if(k.current){k.current=false;return}r?.(b);},[b,r]);let N=tn.useCallback(u=>{f(S=>be(S,u));},[]),d=tn.useCallback(u=>{f(S=>lt(S,u));},[]),B=tn.useCallback((u,S,P,ne)=>{f(Re=>{let Ye=q(Re,ne)??{type:"pane",id:ne,tabs:[ne],activeTabId:ne},Be=be(Re,ne);return ye(Be,u,S,P,Ye)});},[]),ae=tn.useCallback((u,S)=>{f(P=>ve(P,u,S));},[]),W=tn.useCallback((u,S)=>{f(P=>Ze(P,u,S));},[]),te=tn.useCallback((u,S)=>{f(P=>He(P,u,S));},[]),le=tn.useCallback((u,S)=>{f(P=>Ae(P,u,S));},[]),fe=tn.useCallback((u,S)=>{f(P=>ct(P,u,S));},[]),me=tn.useCallback((u,S,P)=>{f(ne=>ut(ne,u,S,P));},[]),j=tn.useCallback(u=>{f(S=>de(S,u));},[]);return {layout:b,setLayout:f,fullscreenPaneId:z,setFullscreenPaneId:_,locked:I,setLocked:V,activeId:w,setActiveId:K,activeType:h,setActiveType:F,dismissIntentId:Y,setDismissIntentId:O,containerRef:m,setContainerRef:$,dragActivationDistance:i,snapThreshold:a,minSplitPercentage:l,maxSplitPercentage:y,enableDragToDismiss:D,dismissThreshold:c,onRemove:T,onDragStart:x,onDragEnd:v,onResizeStart:R,onResize:E,onResizeEnd:L,onDismissIntentChange:p,removePane:N,addPane:d,splitPane:B,updateSplitPercentage:ae,updateTabMetadata:W,updatePaneLock:te,selectTab:le,mergeTab:fe,moveTab:me,removeTab:j}}var Ot=()=>{let e=ee(),t=$e();return {...e,...t}};var pt=({activeId:e,render:t,className:r})=>{let s=tn.useRef(null);return tn.useEffect(()=>{let n=o=>{s.current&&(s.current.style.transform=`translate(${o.clientX+12}px, ${o.clientY+12}px)`);};return document.addEventListener("pointermove",n),()=>document.removeEventListener("pointermove",n)},[]),jsxRuntime.jsx("div",{ref:s,className:r,style:{position:"fixed",top:0,left:0,zIndex:9999,pointerEvents:"none"},children:t(e)})};var Fe=class extends core.PointerSensor{static activators=[{eventName:"onPointerDown",handler:({nativeEvent:t})=>!t.target?.closest(".drag-cancel")}]},Oe=class extends core.TouchSensor{static activators=[{eventName:"onTouchStart",handler:({nativeEvent:t})=>!t.target?.closest(".drag-cancel")}]};function je(e){if(e instanceof MouseEvent||e instanceof PointerEvent)return {x:e.clientX,y:e.clientY};if(typeof TouchEvent<"u"&&e instanceof TouchEvent){let t=e.touches[0]||e.changedTouches[0];if(t)return {x:t.clientX,y:t.clientY}}return null}var jt=e=>{let{renderPane:t,renderWidget:r,renderDragOverlay:s,classNames:n={},children:o,layout:i,setLayout:a,fullscreenPaneId:l,setFullscreenPaneId:y,locked:D,activeId:c,setActiveId:T,activeType:x,setActiveType:v,dismissIntentId:R,setDismissIntentId:E,containerRef:L,setContainerRef:p,dragActivationDistance:b,snapThreshold:f,minSplitPercentage:z,maxSplitPercentage:A,enableDragToDismiss:I,dismissThreshold:V,onRemove:w,onDragStart:K,onDragEnd:h,onResizeStart:F,onResize:Y,onResizeEnd:O,onDismissIntentChange:m,removePane:$,addPane:_,splitPane:k,updateSplitPercentage:N,updateTabMetadata:d,updatePaneLock:B,selectTab:ae,mergeTab:W,moveTab:te,removeTab:le}=e,{portalTargets:fe,registerPortalTarget:me}=at(),j=tn.useRef(null),u=st(c),[S,P]=tn.useState(false);it(S);let ne=tn.useCallback(g=>t(g),[t]),Re=tn.useMemo(()=>n,[n.pane,n.paneLocked,n.dropPreview,n.dragOverlay,n.resizer,n.dismissPreview,n.dashboardLocked,n.lockedPreview]),Ye=core.useSensors(core.useSensor(Fe,{activationConstraint:{distance:b}}),core.useSensor(Oe,{activationConstraint:{delay:250,tolerance:5}})),Be=tn.useCallback(g=>{let Z=core.pointerWithin(g);if(Z.length>0)return Z;if(g.active.id.toString().startsWith("tab-header-")){let re=g.droppableContainers.filter(J=>J.id.toString().startsWith("tab-drop-"));return core.closestCenter({...g,droppableContainers:re})}return []},[]),Dt=g=>{let Z=g.active.id.toString(),U=Z.startsWith("tab-header-"),re=U?Z.substring(11):Z;T(re),v(U?"tab":"pane");let J=g.activatorEvent;u.current=je(J),I&&L.current?j.current=L.current.getBoundingClientRect():j.current=null,K&&K(re);},Et=g=>{let{over:Z}=g,re=(Z?.id.toString()||"").startsWith("drop-locked-");if(P(re),!I)return;let J=g.active.id.toString(),Se=J.startsWith("tab-header-")?J.substring(11):J,M=j.current;if(!M){R!==null&&(E(null),m?.(null));return}let we=g.activatorEvent,oe=null,X=null;if(u.current)oe=u.current.x,X=u.current.y;else {let H=je(we);H&&(oe=H.x+g.delta.x,X=H.y+g.delta.y);}let ce=0;if(oe!==null&&X!==null){let H=0,Q=0;oe<M.left?H=M.left-oe:oe>M.right&&(H=oe-M.right),X<M.top?Q=M.top-X:X>M.bottom&&(Q=X-M.bottom),ce=Math.sqrt(H*H+Q*Q);}else {let H=g.active.rect.current.translated;if(H){let Q=H.left+H.width/2,ge=H.top+H.height/2,ue=0,Pe=0;Q<M.left?ue=M.left-Q:Q>M.right&&(ue=Q-M.right),ge<M.top?Pe=M.top-ge:ge>M.bottom&&(Pe=ge-M.bottom),ce=Math.sqrt(ue*ue+Pe*Pe);}}ce>V?R!==Se&&(E(Se),m?.(Se)):R!==null&&(E(null),m?.(null));},Ct=g=>{T(null),v(null),P(false);let{active:Z,over:U}=g,re=Z.id.toString(),J=re.startsWith("tab-header-"),C=J?re.substring(11):re,Se=I&&R===C;if(E(null),m?.(null),j.current=null,Se){w?w(C):le(C),h&&h(C,null,null);return}if(!U){h&&h(C,null,null);return}let M=U.id.toString();if(M.startsWith("drop-locked-")){h&&h(C,null,null);return}let we=M.match(/^tab-drop-(.+)$/);if(we){let[,Ne]=we;if(C!==Ne){let Ee="before",tt=U.rect,It=g.activatorEvent,Me=null;if(u.current)Me=u.current.x;else {let Le=je(It);Le&&(Me=Le.x+g.delta.x);}if(Me!==null){let Le=tt.left+tt.width/2;Me>Le&&(Ee="after");}te(C,Ne,Ee);}h&&h(C,Ne,{type:"swap",position:"center"});return}let oe=M.match(/^drop-(left|right|top|bottom)-(.+)$/);if(!oe){h&&h(C,null,null);return}let[,X,ce]=oe,De=q(i,C),H=De&&De.id===ce,Q=De&&De.tabs.length===1;if(C===ce||H&&Q){h&&h(C,null,null);return}let ge=X==="left"||X==="right"?"row":"column",ue;if(J){let Ee=q(i,C)?.tabsMetadata?.[C];ue={type:"pane",id:ie(),tabs:[C],activeTabId:C,tabsMetadata:Ee?{[C]:Ee}:void 0};}else ue=q(i,C)??{type:"pane",id:ie(),tabs:[C],activeTabId:C};let Pe=J?de(i,C):be(i,C),zt=ye(Pe,ce,ge,X,ue);a(zt),h&&h(C,ce,{type:"split",direction:ge,position:X});},et=tn.useCallback((g,Z)=>{O&&O(g,Z);},[O]),wt=tn.useMemo(()=>({layout:i,onLayoutChange:g=>a(g),renderPane:ne,activeId:c,dismissIntentId:R,setContainerRef:p,fullscreenPaneId:l,classNames:Re,onRemove:w,onFullscreenChange:y,snapThreshold:f,onResizeStart:F,onResize:Y,onResizeEnd:et,minSplitPercentage:z,maxSplitPercentage:A,locked:D}),[i,c,R,p,l,Re,w,y,f,F,Y,z,A,a,ne,et,D]),Nt=tn.useMemo(()=>({removePane:$,addPane:_,splitPane:k,updateSplitPercentage:N,updateTabMetadata:d,updatePaneLock:B,selectTab:ae,mergeTab:W,moveTab:te,removeTab:le}),[$,_,k,N,d,B,ae,W,te,le]),Mt=tn.useMemo(()=>{let g=[];function Z(U){U&&(U.type==="pane"?g.push(...U.tabs):(Z(U.first),Z(U.second)));}return Z(i),g},[i]),Lt=tn.useMemo(()=>({registerPortalTarget:me}),[me]);return jsxRuntime.jsx(Ie.Provider,{value:Nt,children:jsxRuntime.jsx(ze.Provider,{value:wt,children:jsxRuntime.jsxs(ke.Provider,{value:Lt,children:[jsxRuntime.jsx(core.DndContext,{id:"zeugma-dnd-context",sensors:Ye,collisionDetection:Be,onDragStart:Dt,onDragMove:Et,onDragEnd:Ct,children:o}),c&&x&&s&&jsxRuntime.jsx(pt,{activeId:c,render:g=>s(g,x),className:`${n.dragOverlay||""} ${c===R?n.dismissPreview||"zeugma-dismiss-preview":""}`.trim()}),jsxRuntime.jsx("div",{id:"zeugma-portal-host",style:{display:"none"},children:Mt.map(g=>jsxRuntime.jsx(Jt,{tabId:g,target:fe[g]||null,renderWidget:r},g))})]})})})},Jt=({tabId:e,target:t,renderWidget:r})=>{let[s,n]=tn.useState(false),o=tn.useRef(null);if(tn.useEffect(()=>{n(true);},[]),tn.useEffect(()=>{if(!s||!o.current)return;let a=o.current;if(t)t.appendChild(a);else {let l=document.getElementById("zeugma-hidden-portal-container");l||(l=document.createElement("div"),l.id="zeugma-hidden-portal-container",l.style.display="none",document.body.appendChild(l)),l.appendChild(a);}},[t,s]),tn.useEffect(()=>()=>{o.current&&o.current.remove();},[]),!s)return null;o.current||(o.current=document.createElement("div"),o.current.className=`zeugma-portal-wrapper-${e}`,o.current.style.width="100%",o.current.style.height="100%");let i=o.current;return !i||!r?null:reactDom.createPortal(r(e),i)};function Ve({cursor:e,resizerEl:t,onMove:r,onEnd:s}){document.body.classList.add("zeugma-resizing");let n=document.createElement("style");n.id="zeugma-global-cursor-style",n.textContent=`
     * {
       cursor: ${e} !important;
       user-select: none !important;
     }
-  `,document.head.appendChild(n),t.setAttribute("data-resizing","true");let o=c=>{r(c);},s=()=>{document.body.classList.remove("zeugma-resizing"),t.removeAttribute("data-resizing");let c=document.getElementById("zeugma-global-cursor-style");c&&c.remove(),document.removeEventListener("pointermove",o),document.removeEventListener("pointerup",s),i();};document.addEventListener("pointermove",o),document.addEventListener("pointerup",s);}function Xe({containerRef:e,isRow:t,direction:r,splitPercentage:i,resizerSize:n,snapThreshold:o,layout:s,currentNode:c,onLayoutChange:d,onResizeStart:T,onResizeEnd:S,parentLeft:g,parentTop:p,parentWidth:x,parentHeight:P}){let{onResizeStart:E,onResize:N,onResizeEnd:$,minSplitPercentage:b=5,maxSplitPercentage:y=95,locked:R=false}=Q();return nn.useCallback(I=>{if(R)return;I.preventDefault();let B=e.current;if(!B)return;T&&T(),E&&E(c);let l=B.getBoundingClientRect(),w=I.clientX,k=I.clientY,ee=i,D=I.currentTarget,V=l.left+l.width*(g/100),q=l.top+l.height*(p/100),Y=l.width*(x/100),v=l.height*(P/100),G=Array.from(document.querySelectorAll('div[role="separator"][data-direction]')).filter(M=>M!==D&&M.getAttribute("data-direction")===r).map(M=>{let f=M.getBoundingClientRect();return t?f.left+f.width/2:f.top+f.height/2}),F=ee;Ze({cursor:t?"col-resize":"row-resize",resizerEl:D,onMove:M=>{let f=t?(M.clientX-w)/Y*100:(M.clientY-k)/v*100,O=ee+f,me=t?V+(Y-n)*(O/100)+n/2:q+(v-n)*(O/100)+n/2,U=1/0,le=null;for(let ge of G){let ce=Math.abs(me-ge);ce<o&&ce<U&&(U=ce,le=ge);}let xe=O;le!==null&&(xe=t?(le-n/2-V)/(Y-n)*100:(le-n/2-q)/(v-n)*100);let be=Math.max(b,Math.min(y,xe));F=be;let Se=pe(s,c,be);if(Se){let{panes:ge,splitters:ce}=j(Se),te=e.current;if(te){for(let A of ge)te.style.setProperty(`--pane-left-${A.paneId}`,`${A.left}%`),te.style.setProperty(`--pane-top-${A.paneId}`,`${A.top}%`),te.style.setProperty(`--pane-width-${A.paneId}`,`${A.width}%`),te.style.setProperty(`--pane-height-${A.paneId}`,`${A.height}%`);for(let A of ce)te.style.setProperty(`--splitter-pos-${A.id}`,`${A.direction==="row"?A.left:A.top}%`);}}N&&N(c,be);},onEnd:()=>{let M=pe(s,c,F),f=e.current;if(f){let{panes:O,splitters:me}=j(M);for(let U of O)f.style.removeProperty(`--pane-left-${U.paneId}`),f.style.removeProperty(`--pane-top-${U.paneId}`),f.style.removeProperty(`--pane-width-${U.paneId}`),f.style.removeProperty(`--pane-height-${U.paneId}`);for(let U of me)f.style.removeProperty(`--splitter-pos-${U.id}`);}d(M),S&&S(),$&&$(c,F);}});},[e,t,r,i,n,o,s,c,d,T,S,E,N,$,b,y,g,p,x,P])}var an=({splitter:e,resizerSize:t,snapThreshold:r,containerRef:i})=>{let{layout:n,onLayoutChange:o,classNames:s,locked:c}=Q(),[d,T]=nn.useState(false),{currentNode:S,direction:g,left:p,top:x,width:P,height:E,parentLeft:N,parentTop:$,parentWidth:b,parentHeight:y}=e,R=g==="row",I=Xe({containerRef:i,isRow:R,direction:g,splitPercentage:S.splitPercentage,resizerSize:t,snapThreshold:r,layout:n,currentNode:S,onLayoutChange:o,onResizeStart:()=>T(true),onResizeEnd:()=>T(false),parentLeft:N,parentTop:$,parentWidth:b,parentHeight:y}),B=R?{position:"absolute",left:`calc(var(--splitter-pos-${e.id}, ${p}%) - ${t/2}px)`,top:`calc(${x}% + ${t/2}px)`,width:`${t}px`,height:`calc(${E}% - ${t}px)`,cursor:c?"default":"col-resize",pointerEvents:c?"none":"auto",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box"}:{position:"absolute",left:`calc(${p}% + ${t/2}px)`,top:`calc(var(--splitter-pos-${e.id}, ${x}%) - ${t/2}px)`,width:`calc(${P}% - ${t}px)`,height:`${t}px`,cursor:c?"default":"row-resize",pointerEvents:c?"none":"auto",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box"};return jsxRuntime.jsx("div",{className:`zeugma-resizer ${s.resizer||""}`.trim(),"data-direction":g,"data-resizing":d||void 0,style:B,onPointerDown:I,role:"separator","aria-valuenow":S.splitPercentage,"aria-valuemin":5,"aria-valuemax":95})},ln=nn__default.default.memo(({paneId:e,renderPane:t})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:t(e)}),(e,t)=>e.paneId===t.paneId&&e.renderPane===t.renderPane),cn=({tree:e,resizerSize:t=4,snapThreshold:r})=>{let{layout:i,renderPane:n,activeId:o,dismissIntentId:s,setContainerRef:c,fullscreenPaneId:d,snapThreshold:T,locked:S,classNames:g}=Q(),p=r!==void 0?r:T??8,x=e!==void 0?e:i,P=nn.useRef(null),{panes:E,splitters:N}=nn.useMemo(()=>x?j(x):{panes:[],splitters:[]},[x]);if(!x)return null;let $=()=>jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[E.map(b=>{let y=d===b.paneId;return jsxRuntime.jsx("div",{style:{position:"absolute",left:y?"0%":`var(--pane-left-${b.paneId}, ${b.left}%)`,top:y?"0%":`var(--pane-top-${b.paneId}, ${b.top}%)`,width:y?"100%":`var(--pane-width-${b.paneId}, ${b.width}%)`,height:y?"100%":`var(--pane-height-${b.paneId}, ${b.height}%)`,overflow:"hidden",zIndex:y?20:1,display:d&&!y?"none":"block",padding:y?"0px":`${t/2}px`,boxSizing:"border-box"},children:jsxRuntime.jsx(ln,{paneId:b.paneId,renderPane:n})},b.paneId)}),!d&&N.map(b=>jsxRuntime.jsx(an,{splitter:b,resizerSize:t,snapThreshold:p,containerRef:P},b.id))]});if(e===void 0){let b=o!==null&&o===s,y=I=>{c(I),P.current=I;},R=`zeugma-dashboard-root ${b?"zeugma-dashboard-dismiss-active":""} ${S?g.dashboardLocked||"zeugma-dashboard-locked":""}`.trim();return jsxRuntime.jsx("div",{ref:y,className:R,style:{position:"relative",width:"100%",height:"100%",overflow:"hidden"},children:$()})}return jsxRuntime.jsx("div",{ref:P,style:{position:"relative",width:"100%",height:"100%",overflow:"hidden"},children:$()})};var Lt="zeugma-height:",fn="default-pane";function mn(e){try{let t=localStorage.getItem(Lt+e);if(t!==null){let r=Number(t);if(Number.isFinite(r)&&r>0)return r}}catch{}return null}function Et(e,t){try{localStorage.setItem(Lt+e,String(Math.round(t)));}catch{}}var Nt=({children:e,active:t=true,height:r,onHeightChange:i,minHeight:n=100,maxHeight:o=1/0,persist:s,localStorageKey:c,resizerHeight:d=6,className:T,resizerClassName:S})=>{let g=s?c||fn:null,p=()=>{let R=(g?mn(g):null)??r??400;return Ae(R,n,o)},[x,P]=nn.useState(p),E=nn.useRef(null),N=g?x:r??x,$=nn.useRef(r);nn.useEffect(()=>{if(r!==void 0&&r!==$.current){let R=Ae(r,n,o);P(R),g&&Et(g,R);}$.current=r;},[r,n,o,g]);let b=nn.useCallback(()=>o,[o]),y=nn.useCallback(R=>{R.preventDefault();let I=R.clientY,B=N,l=b(),w=R.currentTarget,k=Dt(E.current),ee=k?k.scrollTop:0,D=I,V=null,q=(v,H)=>{let G=H-ee,M=v-I+G,f=Ae(B+M,n,l);return E.current&&(E.current.style.height=`${f}px`),f},Y=()=>{if(!k)return;let v=k===document.documentElement||k===document.body?{top:0,bottom:window.innerHeight}:k.getBoundingClientRect(),H=40,G=10,F=0;D>v.bottom-H?F=Math.min(1,(D-(v.bottom-H))/H)*G:D<v.top+H&&(F=-Math.min(1,(v.top+H-D)/H)*G),F!==0&&(k.scrollTop+=F,q(D,k.scrollTop)),V=requestAnimationFrame(Y);};V=requestAnimationFrame(Y),Ze({cursor:"row-resize",resizerEl:w,onMove:v=>{D=v.clientY,k&&q(D,k.scrollTop);},onEnd:()=>{V!==null&&cancelAnimationFrame(V);let v=B;E.current&&(v=E.current.getBoundingClientRect().height),v=Ae(v,n,l),P(v),i&&i(v),g&&Et(g,v);}});},[N,n,b,i,g]);return t?jsxRuntime.jsxs("div",{ref:E,className:`zeugma-resizable-container ${T||""}`.trim(),style:{height:`${N}px`,position:"relative",overflow:"hidden",boxSizing:"border-box"},children:[jsxRuntime.jsx("div",{style:{height:`calc(100% - ${d}px)`,overflow:"hidden"},children:e}),jsxRuntime.jsx("div",{className:`zeugma-resizable-handle ${S||""}`.trim(),style:{height:`${d}px`,cursor:"row-resize",position:"relative",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box",flexShrink:0},onPointerDown:y,role:"separator","aria-orientation":"horizontal","aria-valuenow":Math.round(N),"aria-valuemin":n,"aria-valuemax":o===1/0?void 0:o})]}):jsxRuntime.jsx("div",{className:`zeugma-resizable-container disabled ${T||""}`.trim(),style:{height:"100%",position:"relative",overflow:"hidden",boxSizing:"border-box"},children:jsxRuntime.jsx("div",{style:{height:"100%",overflow:"hidden"},children:e})})};function Ae(e,t,r){return Math.max(t,Math.min(r,e))}function Dt(e){if(typeof window>"u"||!e)return null;let t=e.parentElement;if(!t)return document.documentElement;let i=window.getComputedStyle(t).overflowY;return i==="auto"||i==="scroll"?t:Dt(t)}var Oe=nn.createContext(null);var Tn={top:{position:"absolute",top:0,left:"25%",width:"50%",height:"25%",zIndex:20,pointerEvents:"auto"},bottom:{position:"absolute",bottom:0,left:"25%",width:"50%",height:"25%",zIndex:20,pointerEvents:"auto"},left:{position:"absolute",top:"25%",left:0,width:"25%",height:"50%",zIndex:20,pointerEvents:"auto"},right:{position:"absolute",top:"25%",right:0,width:"25%",height:"50%",zIndex:20,pointerEvents:"auto"},center:{position:"absolute",top:"25%",left:"25%",width:"50%",height:"50%",zIndex:20,pointerEvents:"auto"},full:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:20,pointerEvents:"auto",cursor:"not-allowed"}},wn={top:{position:"absolute",top:0,left:0,right:0,height:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},bottom:{position:"absolute",bottom:0,left:0,right:0,height:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},left:{position:"absolute",top:0,bottom:0,left:0,width:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},right:{position:"absolute",top:0,bottom:0,right:0,width:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},center:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:21,pointerEvents:"none",boxSizing:"border-box"},full:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:21,pointerEvents:"none",boxSizing:"border-box"}},Ge=({id:e,position:t,activeClassName:r})=>{let{setNodeRef:i,isOver:n}=core.useDroppable({id:e});return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{ref:i,style:Tn[t]}),n&&jsxRuntime.jsx("div",{className:r,style:wn[t]})]})},Rn=({id:e,children:t,style:r,locked:i=false})=>{let{layout:n,activeId:o,classNames:s,fullscreenPaneId:c,onFullscreenChange:d,locked:T}=Q(),{removePane:S,updateTabMetadata:g,selectTab:p,removeTab:x}=We(),P=nn.useContext(Ce);if(!P)throw new Error("Pane must be used within a Zeugma provider");let{registerPortalTarget:E}=P,N=nn.useMemo(()=>_(n,e),[n,e]),$=N?.id??e,b=N?.tabs??[e],y=N?.activeTabId??e,R=N?.tabsMetadata,I=R?.[e],B=N?.locked??false,l=i||B,w=T||l,k=T||l,ee=o!==null&&o!==e&&(!b.includes(o)||b.length>1)&&!k,{attributes:D,listeners:V,setNodeRef:q}=core.useDraggable({id:e,disabled:w}),Y=o!==null&&b.includes(o),v=c===e,H=nn.useCallback(()=>jsxRuntime.jsx("div",{id:`zeugma-tab-target-${y}`,className:"zeugma-tab-content-wrapper",style:{height:"100%",width:"100%"}}),[y]);nn.useEffect(()=>{let f=document.getElementById(`zeugma-tab-target-${y}`);return E(y,f),()=>{E(y,null);}},[y,E]);let G=nn.useMemo(()=>({isDragging:Y,isFullscreen:v,toggleFullscreen:()=>d?.(v?null:e),remove:()=>{v&&d?.(null),S($);},metadata:I,updateMetadata:f=>{g(e,f);},locked:w,tabs:b,activeTabId:y,selectTab:f=>p($,f),removeTab:f=>{v&&f===y&&d?.(null),x(f);},tabsMetadata:R,updateTabMetadata:(f,O)=>{g(f,O);},renderActiveTab:H}),[Y,v,d,e,x,I,g,w,b,y,p,$,R,H]),F=nn.useMemo(()=>w?{disabled:true}:{...V,...D},[V,D,w]),M=`${s.pane||""} ${l?s.paneLocked||"zeugma-pane-locked":""}`.trim();return jsxRuntime.jsx(Oe.Provider,{value:F,children:jsxRuntime.jsxs("div",{ref:q,className:M,style:{position:"relative",width:"100%",height:"100%",...r},children:[t(G),ee&&jsxRuntime.jsxs("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:15,pointerEvents:"none"},children:[["top","bottom","left","right"].map(f=>jsxRuntime.jsx(Ge,{id:`drop-${f}-${e}`,position:f,activeClassName:s.dropPreview},f)),!b.includes(o)&&jsxRuntime.jsx(Ge,{id:`drop-center-${e}`,position:"center",activeClassName:s.swapPreview})]}),o!==null&&o!==e&&k&&jsxRuntime.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:15,pointerEvents:"none"},children:jsxRuntime.jsx(Ge,{id:`drop-locked-${e}`,position:"full",activeClassName:s.lockedPreview||"zeugma-locked-preview"})})]})})};var Ln=({children:e,className:t,style:r})=>{let i=nn.useContext(Oe);if(!i)throw new Error("<DragHandle> must be used inside a <Pane>");let{disabled:n,...o}=i;return jsxRuntime.jsx("div",{className:t,style:{cursor:n?"default":"grab",userSelect:n?"auto":"none",touchAction:n?"auto":"none",...r},...n?{}:o,children:e})};var Cn=({id:e,locked:t=false,children:r,className:i,style:n})=>{let{locked:o}=Q(),s=t||o,{attributes:c,listeners:d,setNodeRef:T,isDragging:S}=core.useDraggable({id:`tab-header-${e}`,disabled:s}),{setNodeRef:g,isOver:p}=core.useDroppable({id:`tab-drop-${e}`,disabled:s});return jsxRuntime.jsx("div",{ref:P=>{T(P),g(P);},className:i,style:{display:"inline-flex",cursor:s?"default":"grab",...n},...s?{}:d,...s?{}:c,children:r({isDragging:S,isOver:p})})};exports.DEFAULT_DRAG_ACTIVATION_DISTANCE=Vt;exports.DEFAULT_RESIZER_SIZE=Vn;exports.DEFAULT_SNAP_THRESHOLD=Ot;exports.DragHandle=Ln;exports.Pane=Rn;exports.PaneTree=cn;exports.ResizableContainer=Nt;exports.Tab=Cn;exports.Zeugma=Qt;exports.addPane=ht;exports.computeLayout=j;exports.createDragSession=Ze;exports.findPane=_;exports.mergeTab=Pt;exports.moveTab=Ye;exports.removePane=he;exports.removeTab=de;exports.selectTab=Ie;exports.splitPane=we;exports.swapPanes=_e;exports.updatePaneLock=$e;exports.updateSplitPercentage=pe;exports.updateTabMetadata=ze;exports.useResizer=Xe;exports.useZeugmaActions=We;exports.useZeugmaState=Q;//# sourceMappingURL=index.cjs.map
+  `,document.head.appendChild(n),t.setAttribute("data-resizing","true");let o=a=>{r(a);},i=()=>{document.body.classList.remove("zeugma-resizing"),t.removeAttribute("data-resizing");let a=document.getElementById("zeugma-global-cursor-style");a&&a.remove(),document.removeEventListener("pointermove",o),document.removeEventListener("pointerup",i),s();};document.addEventListener("pointermove",o),document.addEventListener("pointerup",i);}function Je({containerRef:e,isRow:t,direction:r,splitPercentage:s,resizerSize:n,snapThreshold:o,layout:i,currentNode:a,onLayoutChange:l,onResizeStart:y,onResizeEnd:D,parentLeft:c,parentTop:T,parentWidth:x,parentHeight:v}){let{onResizeStart:R,onResize:E,onResizeEnd:L,minSplitPercentage:p=5,maxSplitPercentage:b=95,locked:f=false}=ee();return tn.useCallback(z=>{if(f)return;z.preventDefault();let A=e.current;if(!A)return;y&&y(),R&&R(a);let I=A.getBoundingClientRect(),V=z.clientX,w=z.clientY,K=s,h=z.currentTarget,F=I.left+I.width*(c/100),Y=I.top+I.height*(T/100),O=I.width*(x/100),m=I.height*(v/100),_=Array.from(document.querySelectorAll('div[role="separator"][data-direction]')).filter(N=>N!==h&&N.getAttribute("data-direction")===r).map(N=>{let d=N.getBoundingClientRect();return t?d.left+d.width/2:d.top+d.height/2}),k=K;Ve({cursor:t?"col-resize":"row-resize",resizerEl:h,onMove:N=>{let d=t?(N.clientX-V)/O*100:(N.clientY-w)/m*100,B=K+d,ae=t?F+(O-n)*(B/100)+n/2:Y+(m-n)*(B/100)+n/2,W=1/0,te=null;for(let j of _){let u=Math.abs(ae-j);u<o&&u<W&&(W=u,te=j);}let le=B;te!==null&&(le=t?(te-n/2-F)/(O-n)*100:(te-n/2-Y)/(m-n)*100);let fe=Math.max(p,Math.min(b,le));k=fe;let me=ve(i,a,fe);if(me){let{panes:j,splitters:u}=se(me),S=e.current;if(S){for(let P of j)S.style.setProperty(`--pane-left-${P.paneId}`,`${P.left}%`),S.style.setProperty(`--pane-top-${P.paneId}`,`${P.top}%`),S.style.setProperty(`--pane-width-${P.paneId}`,`${P.width}%`),S.style.setProperty(`--pane-height-${P.paneId}`,`${P.height}%`);for(let P of u)S.style.setProperty(`--splitter-pos-${P.id}`,`${P.direction==="row"?P.left:P.top}%`);}}E&&E(a,fe);},onEnd:()=>{let N=ve(i,a,k),d=e.current;if(d){let{panes:B,splitters:ae}=se(N);for(let W of B)d.style.removeProperty(`--pane-left-${W.paneId}`),d.style.removeProperty(`--pane-top-${W.paneId}`),d.style.removeProperty(`--pane-width-${W.paneId}`),d.style.removeProperty(`--pane-height-${W.paneId}`);for(let W of ae)d.style.removeProperty(`--splitter-pos-${W.id}`);}l(N),D&&D(),L&&L(a,k);}});},[e,t,r,s,n,o,i,a,l,y,D,R,E,L,p,b,c,T,x,v])}var sn=({splitter:e,resizerSize:t,snapThreshold:r,containerRef:s})=>{let{layout:n,onLayoutChange:o,classNames:i,locked:a}=ee(),[l,y]=tn.useState(false),{currentNode:D,direction:c,left:T,top:x,width:v,height:R,parentLeft:E,parentTop:L,parentWidth:p,parentHeight:b}=e,f=c==="row",z=Je({containerRef:s,isRow:f,direction:c,splitPercentage:D.splitPercentage,resizerSize:t,snapThreshold:r,layout:n,currentNode:D,onLayoutChange:o,onResizeStart:()=>y(true),onResizeEnd:()=>y(false),parentLeft:E,parentTop:L,parentWidth:p,parentHeight:b}),A=f?{position:"absolute",left:`calc(var(--splitter-pos-${e.id}, ${T}%) - ${t/2}px)`,top:`calc(${x}% + ${t/2}px)`,width:`${t}px`,height:`calc(${R}% - ${t}px)`,cursor:a?"default":"col-resize",pointerEvents:a?"none":"auto",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box"}:{position:"absolute",left:`calc(${T}% + ${t/2}px)`,top:`calc(var(--splitter-pos-${e.id}, ${x}%) - ${t/2}px)`,width:`calc(${v}% - ${t}px)`,height:`${t}px`,cursor:a?"default":"row-resize",pointerEvents:a?"none":"auto",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box"};return jsxRuntime.jsx("div",{className:`zeugma-resizer ${i.resizer||""}`.trim(),"data-direction":c,"data-resizing":l||void 0,style:A,onPointerDown:z,role:"separator","aria-valuenow":D.splitPercentage,"aria-valuemin":5,"aria-valuemax":95})},an=tn__default.default.memo(({paneId:e,renderPane:t})=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:t(e)}),(e,t)=>e.paneId===t.paneId&&e.renderPane===t.renderPane),ln=({tree:e,resizerSize:t=4,snapThreshold:r})=>{let{layout:s,renderPane:n,activeId:o,dismissIntentId:i,setContainerRef:a,fullscreenPaneId:l,snapThreshold:y,locked:D,classNames:c}=ee(),T=r!==void 0?r:y??8,x=e!==void 0?e:s,v=tn.useRef(null),{panes:R,splitters:E}=tn.useMemo(()=>x?se(x):{panes:[],splitters:[]},[x]);if(!x)return null;let L=()=>jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[R.map(p=>{let b=l===p.paneId;return jsxRuntime.jsx("div",{style:{position:"absolute",left:b?"0%":`var(--pane-left-${p.paneId}, ${p.left}%)`,top:b?"0%":`var(--pane-top-${p.paneId}, ${p.top}%)`,width:b?"100%":`var(--pane-width-${p.paneId}, ${p.width}%)`,height:b?"100%":`var(--pane-height-${p.paneId}, ${p.height}%)`,overflow:"hidden",zIndex:b?20:1,display:l&&!b?"none":"block",padding:b?"0px":`${t/2}px`,boxSizing:"border-box"},children:jsxRuntime.jsx(an,{paneId:p.paneId,renderPane:n})},p.paneId)}),!l&&E.map(p=>jsxRuntime.jsx(sn,{splitter:p,resizerSize:t,snapThreshold:T,containerRef:v},p.id))]});if(e===void 0){let p=o!==null&&o===i,b=z=>{a(z),v.current=z;},f=`zeugma-dashboard-root ${p?"zeugma-dashboard-dismiss-active":""} ${D?c.dashboardLocked||"zeugma-dashboard-locked":""}`.trim();return jsxRuntime.jsx("div",{ref:b,className:f,style:{position:"relative",width:"100%",height:"100%",overflow:"hidden"},children:L()})}return jsxRuntime.jsx("div",{ref:v,style:{position:"relative",width:"100%",height:"100%",overflow:"hidden"},children:L()})};var yt="zeugma-height:",pn="default-pane";function fn(e){try{let t=localStorage.getItem(yt+e);if(t!==null){let r=Number(t);if(Number.isFinite(r)&&r>0)return r}}catch{}return null}function Pt(e,t){try{localStorage.setItem(yt+e,String(Math.round(t)));}catch{}}var xt=({children:e,active:t=true,height:r,onHeightChange:s,minHeight:n=100,maxHeight:o=1/0,persist:i,localStorageKey:a,resizerHeight:l=6,className:y,resizerClassName:D})=>{let c=i?a||pn:null,T=()=>{let f=(c?fn(c):null)??r??400;return We(f,n,o)},[x,v]=tn.useState(T),R=tn.useRef(null),E=c?x:r??x,L=tn.useRef(r);tn.useEffect(()=>{if(r!==void 0&&r!==L.current){let f=We(r,n,o);v(f),c&&Pt(c,f);}L.current=r;},[r,n,o,c]);let p=tn.useCallback(()=>o,[o]),b=tn.useCallback(f=>{f.preventDefault();let z=f.clientY,A=E,I=p(),V=f.currentTarget,w=Tt(R.current),K=w?w.scrollTop:0,h=z,F=null,Y=(m,$)=>{let _=$-K,N=m-z+_,d=We(A+N,n,I);return R.current&&(R.current.style.height=`${d}px`),d},O=()=>{if(!w)return;let m=w===document.documentElement||w===document.body?{top:0,bottom:window.innerHeight}:w.getBoundingClientRect(),$=40,_=10,k=0;h>m.bottom-$?k=Math.min(1,(h-(m.bottom-$))/$)*_:h<m.top+$&&(k=-Math.min(1,(m.top+$-h)/$)*_),k!==0&&(w.scrollTop+=k,Y(h,w.scrollTop)),F=requestAnimationFrame(O);};F=requestAnimationFrame(O),Ve({cursor:"row-resize",resizerEl:V,onMove:m=>{h=m.clientY,w&&Y(h,w.scrollTop);},onEnd:()=>{F!==null&&cancelAnimationFrame(F);let m=A;R.current&&(m=R.current.getBoundingClientRect().height),m=We(m,n,I),v(m),s&&s(m),c&&Pt(c,m);}});},[E,n,p,s,c]);return t?jsxRuntime.jsxs("div",{ref:R,className:`zeugma-resizable-container ${y||""}`.trim(),style:{height:`${E}px`,position:"relative",overflow:"hidden",boxSizing:"border-box"},children:[jsxRuntime.jsx("div",{style:{height:`calc(100% - ${l}px)`,overflow:"hidden"},children:e}),jsxRuntime.jsx("div",{className:`zeugma-resizable-handle ${D||""}`.trim(),style:{height:`${l}px`,cursor:"row-resize",position:"relative",zIndex:10,userSelect:"none",touchAction:"none",boxSizing:"border-box",flexShrink:0},onPointerDown:b,role:"separator","aria-orientation":"horizontal","aria-valuenow":Math.round(E),"aria-valuemin":n,"aria-valuemax":o===1/0?void 0:o})]}):jsxRuntime.jsx("div",{className:`zeugma-resizable-container disabled ${y||""}`.trim(),style:{height:"100%",position:"relative",overflow:"hidden",boxSizing:"border-box"},children:jsxRuntime.jsx("div",{style:{height:"100%",overflow:"hidden"},children:e})})};function We(e,t,r){return Math.max(t,Math.min(r,e))}function Tt(e){if(typeof window>"u"||!e)return null;let t=e.parentElement;if(!t)return document.documentElement;let s=window.getComputedStyle(t).overflowY;return s==="auto"||s==="scroll"?t:Tt(t)}var _e=tn.createContext(null);var xn={top:{position:"absolute",top:0,left:"25%",width:"50%",height:"25%",zIndex:20,pointerEvents:"auto"},bottom:{position:"absolute",bottom:0,left:"25%",width:"50%",height:"25%",zIndex:20,pointerEvents:"auto"},left:{position:"absolute",top:"25%",left:0,width:"25%",height:"50%",zIndex:20,pointerEvents:"auto"},right:{position:"absolute",top:"25%",right:0,width:"25%",height:"50%",zIndex:20,pointerEvents:"auto"},full:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:20,pointerEvents:"auto",cursor:"not-allowed"}},Tn={top:{position:"absolute",top:0,left:0,right:0,height:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},bottom:{position:"absolute",bottom:0,left:0,right:0,height:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},left:{position:"absolute",top:0,bottom:0,left:0,width:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},right:{position:"absolute",top:0,bottom:0,right:0,width:"50%",zIndex:21,pointerEvents:"none",boxSizing:"border-box"},full:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:21,pointerEvents:"none",boxSizing:"border-box"}},Rt=({id:e,position:t,activeClassName:r})=>{let{setNodeRef:s,isOver:n}=core.useDroppable({id:e});return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{ref:s,style:xn[t]}),n&&jsxRuntime.jsx("div",{className:r,style:Tn[t]})]})},Rn=({id:e,children:t,style:r,locked:s=false})=>{let{layout:n,activeId:o,classNames:i,fullscreenPaneId:a,onFullscreenChange:l,locked:y}=ee(),{removePane:D,updateTabMetadata:c,selectTab:T,removeTab:x}=$e(),v=tn.useContext(ke);if(!v)throw new Error("Pane must be used within a Zeugma provider");let{registerPortalTarget:R}=v,E=tn.useMemo(()=>q(n,e),[n,e]),L=E?.id??e,p=E?.tabs??[e],b=E?.activeTabId??e,f=E?.tabsMetadata,z=f?.[e],A=E?.locked??false,I=s||A,V=y||I,w=y||I,K=o!==null&&o!==e&&(!p.includes(o)||p.length>1)&&!w,{attributes:h,listeners:F,setNodeRef:Y}=core.useDraggable({id:e,disabled:V}),O=o!==null&&p.includes(o),m=a===e,$=tn.useCallback(()=>jsxRuntime.jsx("div",{id:`zeugma-tab-target-${b}`,className:"zeugma-tab-content-wrapper",style:{height:"100%",width:"100%"}}),[b]);tn.useEffect(()=>{let d=document.getElementById(`zeugma-tab-target-${b}`);return R(b,d),()=>{R(b,null);}},[b,R]);let _=tn.useMemo(()=>({isDragging:O,isFullscreen:m,toggleFullscreen:()=>l?.(m?null:e),remove:()=>{m&&l?.(null),D(L);},metadata:z,updateMetadata:d=>{c(e,d);},locked:V,tabs:p,activeTabId:b,selectTab:d=>T(L,d),removeTab:d=>{m&&d===b&&l?.(null),x(d);},tabsMetadata:f,updateTabMetadata:(d,B)=>{c(d,B);},renderActiveTab:$}),[O,m,l,e,x,z,c,V,p,b,T,L,f,$]),k=tn.useMemo(()=>V?{disabled:true}:{...F,...h},[F,h,V]),N=`${i.pane||""} ${I?i.paneLocked||"zeugma-pane-locked":""}`.trim();return jsxRuntime.jsx(_e.Provider,{value:k,children:jsxRuntime.jsxs("div",{ref:Y,className:N,style:{position:"relative",width:"100%",height:"100%",...r},children:[t(_),K&&jsxRuntime.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:15,pointerEvents:"none"},children:["top","bottom","left","right"].map(d=>jsxRuntime.jsx(Rt,{id:`drop-${d}-${e}`,position:d,activeClassName:i.dropPreview},d))}),o!==null&&o!==e&&w&&jsxRuntime.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:15,pointerEvents:"none"},children:jsxRuntime.jsx(Rt,{id:`drop-locked-${e}`,position:"full",activeClassName:i.lockedPreview||"zeugma-locked-preview"})})]})})};var En=({children:e,className:t,style:r})=>{let s=tn.useContext(_e);if(!s)throw new Error("<DragHandle> must be used inside a <Pane>");let{disabled:n,...o}=s;return jsxRuntime.jsx("div",{className:t,style:{cursor:n?"default":"grab",userSelect:n?"auto":"none",touchAction:n?"auto":"none",...r},...n?{}:o,children:e})};var Mn=({id:e,locked:t=false,children:r,className:s,style:n})=>{let{locked:o}=ee(),i=t||o,{attributes:a,listeners:l,setNodeRef:y,isDragging:D}=core.useDraggable({id:`tab-header-${e}`,disabled:i}),{setNodeRef:c,isOver:T}=core.useDroppable({id:`tab-drop-${e}`,disabled:i});return jsxRuntime.jsx("div",{ref:v=>{y(v),c(v);},className:s,style:{display:"inline-flex",cursor:i?"default":"grab",...n},...i?{}:l,...i?{}:a,children:r({isDragging:D,isOver:T})})};exports.DEFAULT_DRAG_ACTIVATION_DISTANCE=At;exports.DEFAULT_RESIZER_SIZE=Fn;exports.DEFAULT_SNAP_THRESHOLD=Ht;exports.DragHandle=En;exports.Pane=Rn;exports.PaneTree=ln;exports.ResizableContainer=xt;exports.Tab=Mn;exports.Zeugma=jt;exports.addPane=lt;exports.computeLayout=se;exports.createDragSession=Ve;exports.findPane=q;exports.generateUniqueId=ie;exports.mergeTab=ct;exports.moveTab=ut;exports.removePane=be;exports.removeTab=de;exports.selectTab=Ae;exports.splitPane=ye;exports.updatePaneLock=He;exports.updateSplitPercentage=ve;exports.updateTabMetadata=Ze;exports.useResizer=Je;exports.useZeugma=Ft;exports.useZeugmaContext=Ot;//# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map