@tribepad/themis 1.0.0 → 1.0.2

package/dist/chunk-EP4WOI5D.mjs

@@ -1,926 +0,0 @@
-import { NumberField } from './chunk-A3YUJA6W.mjs';
-import { Button as Button$1 } from './chunk-BDXKKMBZ.mjs';
-import { cn } from './chunk-E2KQFV3O.mjs';
-import { createContext, forwardRef, useImperativeHandle, useRef, useState, useEffect, useCallback, useContext } from 'react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { z } from 'zod';
-import { cva } from 'class-variance-authority';
-import { X, GripVertical, GripHorizontal } from 'lucide-react';
-import { DialogTrigger, Button, Popover, Dialog } from 'react-aria-components';
-
-var ResizableContext = createContext(
-  null
-);
-ResizableContext.displayName = "ResizableContext";
-function useResizableContext() {
-  const context = useContext(ResizableContext);
-  if (!context) {
-    throw new Error(
-      "useResizableContext must be used within a ResizablePanelGroup. Make sure ResizablePanel and ResizableHandle are children of ResizablePanelGroup."
-    );
-  }
-  return context;
-}
-function useResizableProvider({
-  direction,
-  groupLabel,
-  sizes: controlledSizes,
-  onSizesChange
-}) {
-  const [internalSizes, setInternalSizes] = useState([]);
-  const [panels, setPanels] = useState([]);
-  const containerRef = useRef(null);
-  const liveRegionRef = useRef(null);
-  const announceTimeoutRef = useRef(null);
-  const sizesInitializedRef = useRef(false);
-  const isControlled = controlledSizes !== void 0;
-  const sizes = isControlled ? controlledSizes : internalSizes;
-  const setSizes = useCallback(
-    (newSizes) => {
-      if (isControlled) {
-        onSizesChange?.(newSizes);
-      } else {
-        setInternalSizes(newSizes);
-      }
-    },
-    [isControlled, onSizesChange]
-  );
-  const registerPanel = useCallback((index, info) => {
-    setPanels((prev) => {
-      const newPanels = [...prev];
-      newPanels[index] = info;
-      return newPanels;
-    });
-  }, []);
-  const unregisterPanel = useCallback((index) => {
-    setPanels((prev) => {
-      const newPanels = [...prev];
-      delete newPanels[index];
-      return newPanels.filter(Boolean);
-    });
-  }, []);
-  useEffect(() => {
-    if (isControlled || sizesInitializedRef.current) return;
-    const registeredPanels = panels.filter(Boolean);
-    const panelCount = registeredPanels.length;
-    if (panelCount < 2) return;
-    const needsInit = sizes.length < panelCount || sizes.some((s) => s === void 0);
-    if (needsInit) {
-      const newSizes = [];
-      const equalSize = 100 / panelCount;
-      for (let i = 0; i < panelCount; i++) {
-        newSizes[i] = equalSize;
-      }
-      sizesInitializedRef.current = true;
-      setInternalSizes(newSizes);
-    }
-  }, [panels, sizes, isControlled]);
-  useEffect(() => {
-    return () => {
-      if (announceTimeoutRef.current) {
-        clearTimeout(announceTimeoutRef.current);
-      }
-      if (liveRegionRef.current) {
-        document.body.removeChild(liveRegionRef.current);
-        liveRegionRef.current = null;
-      }
-    };
-  }, []);
-  const announce = useCallback((message) => {
-    if (!liveRegionRef.current) {
-      const liveRegion = document.createElement("div");
-      liveRegion.setAttribute("aria-live", "polite");
-      liveRegion.setAttribute("aria-atomic", "true");
-      liveRegion.className = "sr-only";
-      liveRegion.style.cssText = "position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;";
-      document.body.appendChild(liveRegion);
-      liveRegionRef.current = liveRegion;
-    }
-    liveRegionRef.current.textContent = message;
-    if (announceTimeoutRef.current) {
-      clearTimeout(announceTimeoutRef.current);
-    }
-    announceTimeoutRef.current = setTimeout(() => {
-      if (liveRegionRef.current) {
-        liveRegionRef.current.textContent = "";
-      }
-    }, 1e3);
-  }, []);
-  return {
-    direction,
-    groupLabel,
-    sizes,
-    setSizes,
-    panels,
-    registerPanel,
-    unregisterPanel,
-    announce,
-    containerRef
-  };
-}
-var ResizablePanelGroup = forwardRef(function ResizablePanelGroup2({ direction, groupLabel, sizes, onSizesChange, className, children }, ref) {
-  const contextValue = useResizableProvider({
-    direction,
-    groupLabel,
-    sizes,
-    onSizesChange
-  });
-  useImperativeHandle(
-    ref,
-    () => contextValue.containerRef.current,
-    [contextValue.containerRef]
-  );
-  return /* @__PURE__ */ jsx(ResizableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: contextValue.containerRef,
-      role: "group",
-      "aria-label": `${groupLabel}, ${direction}`,
-      "data-direction": direction,
-      className: cn(
-        "flex h-full w-full",
-        direction === "horizontal" ? "flex-row" : "flex-col",
-        className
-      ),
-      children
-    }
-  ) });
-});
-ResizablePanelGroup.displayName = "ResizablePanelGroup";
-var DEFAULT_MIN_SIZE = 10;
-var DEFAULT_MAX_SIZE = 90;
-var LONG_PRESS_THRESHOLD = 300;
-var ResizePresetSchema = z.object({
-  label: z.string().min(1),
-  sizes: z.array(z.number().min(0).max(100))
-});
-var ResizablePanelGroupPropsSchema = z.object({
-  /** Layout direction */
-  direction: z.enum(["horizontal", "vertical"]),
-  /** REQUIRED: Label for screen reader identification of this group */
-  groupLabel: z.string().min(1),
-  /** Controlled mode: current sizes as percentages */
-  sizes: z.array(z.number().min(0).max(100)).optional(),
-  /** Callback when sizes change */
-  onSizesChange: z.function().optional(),
-  /** Additional CSS classes */
-  className: z.string().optional(),
-  /** Panel children */
-  children: z.custom()
-});
-var ResizablePanelPropsSchema = z.object({
-  /** REQUIRED: Name for screen reader identification */
-  name: z.string().min(1),
-  /** Default size as percentage (auto-distributes equally if omitted) */
-  defaultSize: z.number().min(0).max(100).optional(),
-  /** Minimum size as percentage */
-  minSize: z.number().min(0).max(100).optional().default(DEFAULT_MIN_SIZE),
-  /** Maximum size as percentage */
-  maxSize: z.number().min(0).max(100).optional().default(DEFAULT_MAX_SIZE),
-  /** Whether panel can collapse to 0% */
-  collapsible: z.boolean().optional().default(false),
-  /** Callback when panel collapses */
-  onCollapse: z.function().optional(),
-  /** Callback when panel expands from collapsed */
-  onExpand: z.function().optional(),
-  /** Callback when panel resizes */
-  onResize: z.function().optional(),
-  /** Additional CSS classes */
-  className: z.string().optional(),
-  /** Panel content */
-  children: z.custom()
-});
-var ResizableHandlePropsSchema = z.object({
-  /** Whether to show the visual grip indicator */
-  withHandle: z.boolean().optional().default(true),
-  /** Size presets for quick adjustment */
-  presets: z.array(ResizePresetSchema).optional(),
-  /** Whether the handle is disabled */
-  disabled: z.boolean().optional().default(false),
-  /** Additional CSS classes */
-  className: z.string().optional()
-});
-var resizableHandleVariants = cva(
-  [
-    // Base styles - 44px touch target
-    "relative flex items-center justify-center",
-    "shrink-0",
-    "bg-transparent",
-    "transition-colors duration-150",
-    // Focus styles
-    "focus-visible:outline-none focus-visible:ring-2",
-    "focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
-    // Touch target padding for accessibility
-    "touch-none select-none"
-  ],
-  {
-    variants: {
-      direction: {
-        horizontal: [
-          "w-3 min-w-[12px]",
-          "cursor-col-resize",
-          "hover:bg-[var(--accent)]/50",
-          // Ensure 44px touch target via padding
-          "before:absolute before:inset-y-0 before:-inset-x-4",
-          "before:min-w-[44px]"
-        ],
-        vertical: [
-          "h-3 min-h-[12px]",
-          "cursor-row-resize",
-          "hover:bg-[var(--accent)]/50",
-          // Ensure 44px touch target via padding
-          "before:absolute before:inset-x-0 before:-inset-y-4",
-          "before:min-h-[44px]"
-        ]
-      },
-      disabled: {
-        true: "cursor-not-allowed opacity-50 pointer-events-none",
-        false: ""
-      },
-      isDragging: {
-        true: "bg-[var(--accent)]",
-        false: ""
-      }
-    },
-    defaultVariants: {
-      direction: "horizontal",
-      disabled: false,
-      isDragging: false
-    }
-  }
-);
-var resizableGripVariants = cva(
-  [
-    "flex items-center justify-center",
-    "rounded-full",
-    "bg-[var(--border)]",
-    "text-[var(--menu-muted)]"
-  ],
-  {
-    variants: {
-      direction: {
-        horizontal: "h-8 w-1",
-        vertical: "h-1 w-8"
-      }
-    },
-    defaultVariants: {
-      direction: "horizontal"
-    }
-  }
-);
-var ResizablePanel = forwardRef(
-  function ResizablePanel2({
-    name,
-    defaultSize: _defaultSize,
-    minSize = DEFAULT_MIN_SIZE,
-    maxSize = DEFAULT_MAX_SIZE,
-    collapsible = false,
-    onCollapse,
-    onExpand,
-    onResize,
-    className,
-    children
-  }, ref) {
-    const { sizes, registerPanel, unregisterPanel, containerRef } = useResizableContext();
-    const internalRef = useRef(null);
-    const [panelIndex, setPanelIndex] = useState(-1);
-    const prevSizeRef = useRef(null);
-    const isRegisteredRef = useRef(false);
-    const registeredIndexRef = useRef(-1);
-    useEffect(() => {
-      const panel = internalRef.current;
-      const container = containerRef.current;
-      if (!panel || !container) return;
-      const allPanels = container.querySelectorAll("[data-resizable-panel]");
-      let foundIndex = -1;
-      for (let i = 0; i < allPanels.length; i++) {
-        if (allPanels[i] === panel) {
-          foundIndex = i;
-          break;
-        }
-      }
-      if (foundIndex === -1) return;
-      if (panelIndex !== foundIndex) {
-        setPanelIndex(foundIndex);
-      }
-      if (!isRegisteredRef.current) {
-        isRegisteredRef.current = true;
-        registeredIndexRef.current = foundIndex;
-        registerPanel(foundIndex, {
-          name,
-          minSize,
-          maxSize,
-          collapsible
-        });
-      }
-      return () => {
-        if (isRegisteredRef.current) {
-          unregisterPanel(registeredIndexRef.current);
-          isRegisteredRef.current = false;
-        }
-      };
-    }, [containerRef, registerPanel, unregisterPanel, name, minSize, maxSize, collapsible, panelIndex]);
-    const currentSize = panelIndex >= 0 ? sizes[panelIndex] ?? 50 : 50;
-    useEffect(() => {
-      if (prevSizeRef.current === null) {
-        prevSizeRef.current = currentSize;
-        return;
-      }
-      const wasCollapsed = prevSizeRef.current === 0;
-      const isCollapsed = currentSize === 0;
-      if (!wasCollapsed && isCollapsed && onCollapse) {
-        onCollapse();
-      } else if (wasCollapsed && !isCollapsed && onExpand) {
-        onExpand();
-      }
-      if (onResize && prevSizeRef.current !== currentSize) {
-        onResize(currentSize);
-      }
-      prevSizeRef.current = currentSize;
-    }, [currentSize, onCollapse, onExpand, onResize]);
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref: (node) => {
-          internalRef.current = node;
-          if (typeof ref === "function") {
-            ref(node);
-          } else if (ref) {
-            ref.current = node;
-          }
-        },
-        role: "region",
-        "aria-label": name,
-        "data-resizable-panel": "",
-        "data-panel-name": name,
-        "data-panel-index": panelIndex,
-        "data-collapsed": currentSize === 0,
-        style: {
-          flexBasis: `${currentSize}%`,
-          flexGrow: 0,
-          flexShrink: 0,
-          overflow: "hidden"
-        },
-        className: cn("relative", className),
-        children
-      }
-    );
-  }
-);
-ResizablePanel.displayName = "ResizablePanel";
-function clampSize(size, min, max) {
-  return Math.max(min, Math.min(max, size));
-}
-function calculateNewSizes(sizes, panels, leftIndex, rightIndex, delta) {
-  const newSizes = [...sizes];
-  const leftPanel = panels[leftIndex];
-  const rightPanel = panels[rightIndex];
-  if (!leftPanel || !rightPanel) return sizes;
-  const leftSize = sizes[leftIndex] ?? 50;
-  const rightSize = sizes[rightIndex] ?? 50;
-  let newLeftSize = leftSize + delta;
-  let newRightSize = rightSize - delta;
-  const leftMin = leftPanel.collapsible ? 0 : leftPanel.minSize;
-  const leftMax = leftPanel.maxSize;
-  const rightMin = rightPanel.collapsible ? 0 : rightPanel.minSize;
-  const rightMax = rightPanel.maxSize;
-  newLeftSize = clampSize(newLeftSize, leftMin, leftMax);
-  newRightSize = leftSize + rightSize - newLeftSize;
-  newRightSize = clampSize(newRightSize, rightMin, rightMax);
-  newLeftSize = leftSize + rightSize - newRightSize;
-  newSizes[leftIndex] = newLeftSize;
-  newSizes[rightIndex] = newRightSize;
-  return newSizes;
-}
-function useResizable({
-  direction,
-  sizes,
-  setSizes,
-  panels,
-  containerRef,
-  leftPanelIndex,
-  rightPanelIndex,
-  disabled = false,
-  announce,
-  groupLabel,
-  onOpenPopover
-}) {
-  const [isDragging, setIsDragging] = useState(false);
-  const dragStartRef = useRef(null);
-  const longPressTimerRef = useRef(null);
-  const pointerDownTimeRef = useRef(0);
-  const wasLongPressRef = useRef(false);
-  const panelsRef = useRef(panels);
-  const sizesRef = useRef(sizes);
-  const setSizesRef = useRef(setSizes);
-  const handlePointerMoveRef = useRef(() => {
-  });
-  const handlePointerUpRef = useRef(() => {
-  });
-  useEffect(() => {
-    panelsRef.current = panels;
-    sizesRef.current = sizes;
-    setSizesRef.current = setSizes;
-  }, [panels, sizes, setSizes]);
-  const getContainerSize = useCallback(() => {
-    const container = containerRef.current;
-    if (!container) return 0;
-    return direction === "horizontal" ? container.offsetWidth : container.offsetHeight;
-  }, [containerRef, direction]);
-  const pixelsToPercent = useCallback(
-    (pixels) => {
-      const containerSize = getContainerSize();
-      if (containerSize === 0) return 0;
-      return pixels / containerSize * 100;
-    },
-    [getContainerSize]
-  );
-  const onPointerMove = useCallback((e) => {
-    handlePointerMoveRef.current(e);
-  }, []);
-  const onPointerUp = useCallback(() => {
-    handlePointerUpRef.current();
-  }, []);
-  const handlePointerMove = useCallback(
-    (event) => {
-      if (!dragStartRef.current || disabled) return;
-      const position = direction === "horizontal" ? event.clientX : event.clientY;
-      const delta = position - dragStartRef.current.position;
-      const percentDelta = pixelsToPercent(delta);
-      const newSizes = calculateNewSizes(
-        dragStartRef.current.sizes,
-        panelsRef.current,
-        leftPanelIndex,
-        rightPanelIndex,
-        percentDelta
-      );
-      setSizesRef.current(newSizes);
-    },
-    [
-      direction,
-      disabled,
-      leftPanelIndex,
-      pixelsToPercent,
-      rightPanelIndex
-    ]
-  );
-  const handlePointerUp = useCallback(() => {
-    if (longPressTimerRef.current) {
-      clearTimeout(longPressTimerRef.current);
-      longPressTimerRef.current = null;
-    }
-    const duration = Date.now() - pointerDownTimeRef.current;
-    const wasTap = duration < LONG_PRESS_THRESHOLD && !wasLongPressRef.current;
-    if (wasTap && onOpenPopover && !disabled) {
-      onOpenPopover();
-    }
-    if (isDragging) {
-      setIsDragging(false);
-      const leftPanel = panelsRef.current[leftPanelIndex];
-      const newSize = Math.round(sizesRef.current[leftPanelIndex] ?? 50);
-      if (announce && leftPanel && groupLabel) {
-        announce(
-          `${leftPanel.name} in ${groupLabel} resized to ${newSize} percent`
-        );
-      }
-    }
-    dragStartRef.current = null;
-    wasLongPressRef.current = false;
-    document.removeEventListener("pointermove", onPointerMove);
-    document.removeEventListener("pointerup", onPointerUp);
-    document.removeEventListener("pointercancel", onPointerUp);
-    document.body.style.cursor = "";
-    document.body.style.userSelect = "";
-  }, [
-    announce,
-    disabled,
-    groupLabel,
-    isDragging,
-    leftPanelIndex,
-    onOpenPopover,
-    onPointerMove,
-    onPointerUp
-  ]);
-  useEffect(() => {
-    handlePointerMoveRef.current = handlePointerMove;
-    handlePointerUpRef.current = handlePointerUp;
-  });
-  const handlePointerDown = useCallback(
-    (event) => {
-      if (disabled) return;
-      event.preventDefault();
-      const position = direction === "horizontal" ? event.clientX : event.clientY;
-      pointerDownTimeRef.current = Date.now();
-      wasLongPressRef.current = false;
-      dragStartRef.current = {
-        position,
-        sizes: [...sizes],
-        containerSize: getContainerSize()
-      };
-      longPressTimerRef.current = setTimeout(() => {
-        wasLongPressRef.current = true;
-        setIsDragging(true);
-        document.body.style.cursor = direction === "horizontal" ? "col-resize" : "row-resize";
-        document.body.style.userSelect = "none";
-      }, LONG_PRESS_THRESHOLD);
-      document.addEventListener("pointermove", onPointerMove);
-      document.addEventListener("pointerup", onPointerUp);
-      document.addEventListener("pointercancel", onPointerUp);
-      if (event.pointerType === "mouse") {
-        if (longPressTimerRef.current) {
-          clearTimeout(longPressTimerRef.current);
-          longPressTimerRef.current = null;
-        }
-        wasLongPressRef.current = true;
-        setIsDragging(true);
-        document.body.style.cursor = direction === "horizontal" ? "col-resize" : "row-resize";
-        document.body.style.userSelect = "none";
-      }
-    },
-    [
-      direction,
-      disabled,
-      getContainerSize,
-      onPointerMove,
-      onPointerUp,
-      sizes
-    ]
-  );
-  const handleKeyDown = useCallback(
-    (event) => {
-      if (disabled) return;
-      const step = event.shiftKey ? 10 : 1;
-      let delta = 0;
-      switch (event.key) {
-        case "ArrowLeft":
-        case "ArrowUp":
-          delta = -step;
-          break;
-        case "ArrowRight":
-        case "ArrowDown":
-          delta = step;
-          break;
-        case "Home": {
-          const leftPanel = panels[leftPanelIndex];
-          if (leftPanel) {
-            const minSize = leftPanel.collapsible ? 0 : leftPanel.minSize;
-            delta = minSize - (sizes[leftPanelIndex] ?? 50);
-          }
-          break;
-        }
-        case "End": {
-          const leftPanel = panels[leftPanelIndex];
-          if (leftPanel) {
-            delta = leftPanel.maxSize - (sizes[leftPanelIndex] ?? 50);
-          }
-          break;
-        }
-        case "Enter":
-        case " ":
-          event.preventDefault();
-          onOpenPopover?.();
-          return;
-        default:
-          return;
-      }
-      if (delta !== 0) {
-        event.preventDefault();
-        const newSizes = calculateNewSizes(
-          sizes,
-          panels,
-          leftPanelIndex,
-          rightPanelIndex,
-          delta
-        );
-        setSizes(newSizes);
-        const leftPanel = panels[leftPanelIndex];
-        const newSize = Math.round(newSizes[leftPanelIndex] ?? 50);
-        if (announce && leftPanel && groupLabel) {
-          announce(
-            `${leftPanel.name} in ${groupLabel} resized to ${newSize} percent`
-          );
-        }
-      }
-    },
-    [
-      announce,
-      disabled,
-      groupLabel,
-      leftPanelIndex,
-      onOpenPopover,
-      panels,
-      rightPanelIndex,
-      setSizes,
-      sizes
-    ]
-  );
-  useEffect(() => {
-    const moveHandler = onPointerMove;
-    const upHandler = onPointerUp;
-    return () => {
-      if (longPressTimerRef.current) {
-        clearTimeout(longPressTimerRef.current);
-      }
-      document.removeEventListener("pointermove", moveHandler);
-      document.removeEventListener("pointerup", upHandler);
-      document.removeEventListener("pointercancel", upHandler);
-    };
-  }, [onPointerMove, onPointerUp]);
-  return {
-    isDragging,
-    handlePointerDown,
-    handleKeyDown
-  };
-}
-var ResizablePopover = forwardRef(
-  function ResizablePopover2({
-    isOpen,
-    onOpenChange,
-    groupLabel,
-    leftPanel,
-    rightPanel,
-    leftSize,
-    rightSize,
-    onSizesChange,
-    presets,
-    triggerRef,
-    direction
-  }, _ref) {
-    const [originalSizes, setOriginalSizes] = useState({ left: leftSize, right: rightSize });
-    const wasOpenRef = useRef(false);
-    useEffect(() => {
-      if (isOpen && !wasOpenRef.current) {
-        setOriginalSizes({ left: leftSize, right: rightSize });
-      }
-      wasOpenRef.current = isOpen;
-    }, [isOpen, leftSize, rightSize]);
-    const handleLeftChange = useCallback(
-      (value) => {
-        if (value === null) return;
-        const newLeft = Math.max(
-          leftPanel.collapsible ? 0 : leftPanel.minSize,
-          Math.min(leftPanel.maxSize, value)
-        );
-        const newRight = 100 - newLeft;
-        const rightMin = rightPanel.collapsible ? 0 : rightPanel.minSize;
-        const rightMax = rightPanel.maxSize;
-        if (newRight < rightMin || newRight > rightMax) {
-          return;
-        }
-        onSizesChange(newLeft, newRight);
-      },
-      [leftPanel, rightPanel, onSizesChange]
-    );
-    const handleRightChange = useCallback(
-      (value) => {
-        if (value === null) return;
-        const newRight = Math.max(
-          rightPanel.collapsible ? 0 : rightPanel.minSize,
-          Math.min(rightPanel.maxSize, value)
-        );
-        const newLeft = 100 - newRight;
-        const leftMin = leftPanel.collapsible ? 0 : leftPanel.minSize;
-        const leftMax = leftPanel.maxSize;
-        if (newLeft < leftMin || newLeft > leftMax) {
-          return;
-        }
-        onSizesChange(newLeft, newRight);
-      },
-      [leftPanel, rightPanel, onSizesChange]
-    );
-    const handlePreset = useCallback(
-      (preset) => {
-        const leftSize2 = preset.sizes[0];
-        const rightSize2 = preset.sizes[1];
-        if (leftSize2 !== void 0 && rightSize2 !== void 0) {
-          onSizesChange(leftSize2, rightSize2);
-        }
-      },
-      [onSizesChange]
-    );
-    const handleCancel = useCallback(() => {
-      onSizesChange(originalSizes.left, originalSizes.right);
-      onOpenChange(false);
-    }, [onSizesChange, onOpenChange, originalSizes]);
-    const handleClose = useCallback(() => {
-      onOpenChange(false);
-    }, [onOpenChange]);
-    if (!isOpen) return null;
-    const placement = direction === "horizontal" ? "bottom" : "right";
-    return /* @__PURE__ */ jsxs(DialogTrigger, { isOpen, onOpenChange, children: [
-      /* @__PURE__ */ jsx(Button, { className: "sr-only", children: "Open resize controls" }),
-      /* @__PURE__ */ jsx(
-        Popover,
-        {
-          triggerRef,
-          placement,
-          offset: 8,
-          className: cn(
-            "w-72",
-            "rounded-lg border border-[var(--border)]",
-            "bg-[var(--popover)] text-[var(--popover-foreground)]",
-            "shadow-lg",
-            "outline-none",
-            "animate-in fade-in-0 zoom-in-95",
-            "data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95"
-          ),
-          children: /* @__PURE__ */ jsxs(Dialog, { className: "outline-none", children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-[var(--border)] px-4 py-3", children: [
-              /* @__PURE__ */ jsxs("h3", { className: "text-sm font-medium", children: [
-                "Resize: ",
-                groupLabel
-              ] }),
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  onPress: handleClose,
-                  className: cn(
-                    "inline-flex items-center justify-center rounded-md",
-                    "min-h-[44px] min-w-[44px]",
-                    "text-[var(--menu-muted)]",
-                    "hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)]",
-                    "focus-visible:outline-none focus-visible:ring-2",
-                    "focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2"
-                  ),
-                  "aria-label": "Close",
-                  children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "space-y-4 px-4 py-4", children: [
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                NumberField,
-                {
-                  label: `${leftPanel.name} (%)`,
-                  value: Math.round(leftSize),
-                  onChange: handleLeftChange,
-                  minValue: leftPanel.collapsible ? 0 : leftPanel.minSize,
-                  maxValue: leftPanel.maxSize,
-                  step: 1,
-                  stepperLayout: "sides"
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                NumberField,
-                {
-                  label: `${rightPanel.name} (%)`,
-                  value: Math.round(rightSize),
-                  onChange: handleRightChange,
-                  minValue: rightPanel.collapsible ? 0 : rightPanel.minSize,
-                  maxValue: rightPanel.maxSize,
-                  step: 1,
-                  stepperLayout: "sides"
-                }
-              ) }),
-              presets && presets.length > 0 && /* @__PURE__ */ jsxs("div", { className: "border-t border-[var(--border)] pt-4", children: [
-                /* @__PURE__ */ jsx("div", { className: "mb-2 text-xs font-medium text-[var(--menu-muted)]", children: "Presets" }),
-                /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: presets.map((preset, index) => /* @__PURE__ */ jsx(
-                  Button$1,
-                  {
-                    variant: "outline",
-                    size: "sm",
-                    onPress: () => handlePreset(preset),
-                    children: preset.label
-                  },
-                  index
-                )) })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx("div", { className: "flex justify-end border-t border-[var(--border)] px-4 py-3", children: /* @__PURE__ */ jsx(Button$1, { variant: "ghost", size: "sm", onPress: handleCancel, children: "Cancel" }) })
-          ] })
-        }
-      )
-    ] });
-  }
-);
-ResizablePopover.displayName = "ResizablePopover";
-var ResizableHandle = forwardRef(
-  function ResizableHandle2({ withHandle = true, presets, disabled = false, className }, ref) {
-    const {
-      direction,
-      groupLabel,
-      sizes,
-      setSizes,
-      panels,
-      announce,
-      containerRef
-    } = useResizableContext();
-    const internalRef = useRef(null);
-    const handleRef = ref || internalRef;
-    const [handleIndex, setHandleIndex] = useState(0);
-    useEffect(() => {
-      const handle = handleRef.current;
-      const container = containerRef.current;
-      if (!handle || !container) return;
-      const handles = container.querySelectorAll('[role="slider"]');
-      let index = 0;
-      handles.forEach((h, i) => {
-        if (h === handle) {
-          index = i;
-        }
-      });
-      setHandleIndex(index);
-    }, [containerRef, handleRef]);
-    const leftPanelIndex = handleIndex;
-    const rightPanelIndex = handleIndex + 1;
-    const leftPanel = panels[leftPanelIndex];
-    const rightPanel = panels[rightPanelIndex];
-    const leftSize = sizes[leftPanelIndex] ?? 50;
-    const rightSize = sizes[rightPanelIndex] ?? 50;
-    const [isPopoverOpen, setIsPopoverOpen] = useState(false);
-    const handlePopoverSizesChange = useCallback(
-      (newLeftSize, newRightSize) => {
-        const newSizes = [...sizes];
-        newSizes[leftPanelIndex] = newLeftSize;
-        newSizes[rightPanelIndex] = newRightSize;
-        setSizes(newSizes);
-      },
-      [sizes, setSizes, leftPanelIndex, rightPanelIndex]
-    );
-    const { isDragging, handlePointerDown, handleKeyDown } = useResizable({
-      direction,
-      sizes,
-      setSizes,
-      panels,
-      containerRef,
-      leftPanelIndex,
-      rightPanelIndex,
-      disabled,
-      announce,
-      groupLabel,
-      onOpenPopover: () => setIsPopoverOpen(true)
-    });
-    const ariaLabel = leftPanel && rightPanel ? `Resize handle between ${leftPanel.name} and ${rightPanel.name} in ${groupLabel}` : `Resize handle in ${groupLabel}`;
-    const GripIcon = direction === "horizontal" ? GripVertical : GripHorizontal;
-    const leftPanelInfo = leftPanel ?? {
-      name: "Panel 1",
-      minSize: DEFAULT_MIN_SIZE,
-      maxSize: DEFAULT_MAX_SIZE,
-      collapsible: false
-    };
-    const rightPanelInfo = rightPanel ?? {
-      name: "Panel 2",
-      minSize: DEFAULT_MIN_SIZE,
-      maxSize: DEFAULT_MAX_SIZE,
-      collapsible: false
-    };
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: handleRef,
-          role: "slider",
-          tabIndex: disabled ? -1 : 0,
-          "aria-label": ariaLabel,
-          "aria-valuenow": Math.round(leftSize),
-          "aria-valuemin": leftPanel?.collapsible ? 0 : leftPanel?.minSize ?? 0,
-          "aria-valuemax": leftPanel?.maxSize ?? 100,
-          "aria-orientation": direction,
-          "aria-disabled": disabled,
-          "data-direction": direction,
-          "data-dragging": isDragging,
-          "data-disabled": disabled,
-          onPointerDown: handlePointerDown,
-          onKeyDown: handleKeyDown,
-          className: cn(
-            resizableHandleVariants({
-              direction,
-              disabled,
-              isDragging
-            }),
-            className
-          ),
-          children: withHandle && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(resizableGripVariants({ direction })),
-              "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx(GripIcon, { className: "h-4 w-4" })
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        ResizablePopover,
-        {
-          isOpen: isPopoverOpen,
-          onOpenChange: setIsPopoverOpen,
-          groupLabel,
-          leftPanel: leftPanelInfo,
-          rightPanel: rightPanelInfo,
-          leftSize,
-          rightSize,
-          onSizesChange: handlePopoverSizesChange,
-          presets,
-          triggerRef: handleRef,
-          direction
-        }
-      )
-    ] });
-  }
-);
-ResizableHandle.displayName = "ResizableHandle";
-
-export { DEFAULT_MAX_SIZE, DEFAULT_MIN_SIZE, LONG_PRESS_THRESHOLD, ResizableHandle, ResizableHandlePropsSchema, ResizablePanel, ResizablePanelGroup, ResizablePanelGroupPropsSchema, ResizablePanelPropsSchema, ResizePresetSchema, resizableGripVariants, resizableHandleVariants, useResizableContext };
-//# sourceMappingURL=chunk-EP4WOI5D.mjs.map
-//# sourceMappingURL=chunk-EP4WOI5D.mjs.map