@arbidocs/blocks 0.5.120 → 0.5.122

package/dist/chunk-K4763GD5.cjs

@@ -0,0 +1,301 @@
+"use client";
+'use strict';
+
+var chunk2RLA6QO2_cjs = require('./chunk-2RLA6QO2.cjs');
+var chunkXJEXFEWG_cjs = require('./chunk-XJEXFEWG.cjs');
+var chunkFX3K6LNZ_cjs = require('./chunk-FX3K6LNZ.cjs');
+var ui = require('@arbidocs/react/ui');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var reactDom = require('react-dom');
+
+var btnClass = "h-7 w-7 p-0 text-muted-foreground hover:text-foreground";
+function SwitcherButton({
+  label,
+  inPopout = false,
+  onClick,
+  testId,
+  children
+}) {
+  const button = /* @__PURE__ */ jsxRuntime.jsx(
+    ui.Button,
+    {
+      variant: "ghost",
+      size: "sm",
+      className: btnClass,
+      "aria-label": label,
+      title: inPopout ? label : void 0,
+      onClick,
+      "data-testid": testId,
+      children
+    }
+  );
+  if (inPopout) return button;
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Tooltip, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.TooltipContent, { children: label })
+  ] });
+}
+var TABLET_AND_BELOW_QUERY = "(max-width: 1024px)";
+function PanelModeSwitcher({
+  mode,
+  onModeChange,
+  onClose,
+  disablePopout,
+  closeTestId = "dialog-close-button"
+}) {
+  const isPopout = mode === "popout";
+  const isSmallScreen = chunkFX3K6LNZ_cjs.useIsPhone();
+  const isTabletAndBelow = chunkFX3K6LNZ_cjs.useMediaQuery(TABLET_AND_BELOW_QUERY);
+  const closeButton = onClose && /* @__PURE__ */ jsxRuntime.jsx(
+    SwitcherButton,
+    {
+      label: "Close (Esc)",
+      onClick: (event) => {
+        event.stopPropagation();
+        onClose();
+      },
+      testId: closeTestId,
+      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5" })
+    }
+  );
+  if (isSmallScreen) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: closeButton });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: [
+    !disablePopout && !isTabletAndBelow && /* @__PURE__ */ jsxRuntime.jsx(
+      SwitcherButton,
+      {
+        label: isPopout ? "Pop back in" : "Open in new window",
+        inPopout: isPopout,
+        onClick: () => onModeChange(isPopout ? "docked" : "popout"),
+        testId: isPopout ? "pop-into-main-window-button" : "open-in-new-window-button",
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLink, { className: "w-3.5 h-3.5" })
+      }
+    ),
+    !isPopout && mode !== "docked" && /* @__PURE__ */ jsxRuntime.jsx(
+      SwitcherButton,
+      {
+        label: "Split screen",
+        onClick: () => onModeChange("docked"),
+        testId: "dock-panel-button",
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelRight, { className: "w-3.5 h-3.5" })
+      }
+    ),
+    !isPopout && mode !== "overlay" && !isTabletAndBelow && /* @__PURE__ */ jsxRuntime.jsx(
+      SwitcherButton,
+      {
+        label: "Float as overlay",
+        onClick: () => onModeChange("overlay"),
+        testId: "overlay-panel-button",
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PictureInPicture2, { className: "w-3.5 h-3.5" })
+      }
+    ),
+    !isPopout && closeButton
+  ] });
+}
+var OVERLAY_DEFAULT_PX = 544;
+var OVERLAY_MIN_PX = 360;
+function OverlaySheet({
+  panelId,
+  isExiting,
+  onClose,
+  defaultWidth,
+  scoped,
+  children
+}) {
+  const [width, setWidth] = react.useState(defaultWidth ?? OVERLAY_DEFAULT_PX);
+  const [isResizing, setIsResizing] = react.useState(false);
+  const [dragWidth, setDragWidth] = react.useState(null);
+  const dragWidthRef = react.useRef(null);
+  const [hasEntered, setHasEntered] = react.useState(false);
+  const handleResizeStart = react.useCallback((e) => {
+    e.preventDefault();
+    setHasEntered(true);
+    setIsResizing(true);
+    setDragWidth(null);
+    dragWidthRef.current = null;
+  }, []);
+  react.useEffect(() => {
+    if (!isResizing) return;
+    const handleMouseMove = (e) => {
+      const max = window.innerWidth * 0.92;
+      const next = Math.min(Math.max(window.innerWidth - e.clientX, OVERLAY_MIN_PX), max);
+      dragWidthRef.current = next;
+      setDragWidth(next);
+    };
+    const handleMouseUp = () => {
+      if (dragWidthRef.current !== null) setWidth(dragWidthRef.current);
+      setIsResizing(false);
+      setDragWidth(null);
+      dragWidthRef.current = null;
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+    document.body.style.cursor = "col-resize";
+    document.body.style.userSelect = "none";
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.body.style.cursor = "";
+      document.body.style.userSelect = "";
+    };
+  }, [isResizing]);
+  return (
+    // Scoped: absolute within the layout's overlay zone (below the topbar).
+    // Unscoped fallback: fixed over the whole viewport, as before.
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: scoped ? "absolute inset-0 z-40" : "fixed inset-0 z-50",
+        "data-testid": `${panelId}-overlay`,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: `absolute inset-0 bg-black/40 dark:bg-black/20 duration-200 ${// fill-mode-forwards holds the exit end-state — without it the
+              // element snaps back fully visible for the frames between the
+              // animation finishing and React unmounting it (a flicker).
+              isExiting ? "animate-out fade-out fill-mode-forwards" : "animate-in fade-in"}`,
+              onClick: onClose,
+              "aria-hidden": "true",
+              "data-testid": `${panelId}-overlay-backdrop`
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: { width },
+              onAnimationEnd: () => !isExiting && setHasEntered(true),
+              className: `absolute right-0 top-0 bottom-0 flex max-w-[92vw] flex-col border-l max-sm:!w-full max-sm:!max-w-full max-sm:border-l-0 border-border bg-muted shadow-2xl duration-200 ${isExiting ? "animate-out slide-out-to-right fill-mode-forwards" : (
+                // Suppress the slide transform once entered so it doesn't replay.
+                hasEntered ? "" : "animate-in slide-in-from-right"
+              )}`,
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: "absolute left-0 top-0 bottom-0 z-10 w-1.5 -translate-x-1/2 cursor-col-resize hover:bg-primary/40",
+                    onMouseDown: handleResizeStart,
+                    "data-testid": `${panelId}-overlay-resize-handle`
+                  }
+                ),
+                children
+              ]
+            }
+          ),
+          isResizing && dragWidth !== null && /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "absolute top-0 bottom-0 z-[60] w-0.5 bg-primary pointer-events-none",
+              style: { right: dragWidth }
+            }
+          ),
+          isResizing && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-[55] cursor-col-resize" })
+        ]
+      }
+    )
+  );
+}
+function PanelPortal({
+  panelId,
+  mode,
+  isOpen,
+  isExiting,
+  onPopupClosed,
+  onClose,
+  popoutTitle,
+  defaultWidth,
+  children
+}) {
+  const { windows: windowManager } = chunk2RLA6QO2_cjs.usePanelHostSupport();
+  const [popupRoot, setPopupRoot] = react.useState(null);
+  const popupWindowIdRef = react.useRef(null);
+  react.useEffect(() => {
+    if (!isOpen || mode !== "popout") {
+      if (popupWindowIdRef.current) {
+        windowManager.clearOnClose(popupWindowIdRef.current);
+        windowManager.closeWindow(popupWindowIdRef.current);
+        popupWindowIdRef.current = null;
+        setPopupRoot(null);
+      }
+      return;
+    }
+    if (popupWindowIdRef.current) return;
+    const windowId = windowManager.createPopupWindow(
+      `panel-${panelId}`,
+      () => {
+        popupWindowIdRef.current = null;
+        setPopupRoot(null);
+        onPopupClosed?.();
+      },
+      popoutTitle || panelId
+    );
+    if (windowId) {
+      const rootElement = windowManager.getRootElement(windowId);
+      if (rootElement) {
+        popupWindowIdRef.current = windowId;
+        setPopupRoot(rootElement);
+        windowManager.getWindow(windowId)?.focus();
+      }
+    }
+  }, [isOpen, mode, panelId, popoutTitle, onPopupClosed, windowManager]);
+  const pendingClose = react.useRef(null);
+  react.useEffect(() => {
+    if (pendingClose.current) {
+      clearTimeout(pendingClose.current);
+      pendingClose.current = null;
+    }
+    return () => {
+      const windowId = popupWindowIdRef.current;
+      if (!windowId) return;
+      popupWindowIdRef.current = null;
+      pendingClose.current = setTimeout(() => {
+        pendingClose.current = null;
+        if (popupWindowIdRef.current === windowId) return;
+        windowManager.closeWindow(windowId);
+      }, 0);
+    };
+  }, [windowManager]);
+  if (!isOpen && !isExiting) return null;
+  if (mode === "popout" && popupRoot) {
+    return reactDom.createPortal(
+      /* @__PURE__ */ jsxRuntime.jsx(ui.PortalContainerProvider, { container: popupRoot, children }),
+      popupRoot
+    );
+  }
+  if (mode === "overlay") {
+    const overlayZone = document.getElementById(chunkXJEXFEWG_cjs.DEFAULT_OVERLAY_ZONE_ID);
+    return reactDom.createPortal(
+      /* @__PURE__ */ jsxRuntime.jsx(
+        OverlaySheet,
+        {
+          panelId,
+          isExiting,
+          onClose,
+          defaultWidth,
+          scoped: overlayZone !== null,
+          children
+        }
+      ),
+      overlayZone ?? document.body
+    );
+  }
+  if (mode === "main") {
+    const mainZone = document.getElementById("main-zone");
+    if (mainZone) {
+      return reactDom.createPortal(children, mainZone);
+    }
+  }
+  const dockZone = document.getElementById("dock-zone");
+  if (dockZone) {
+    return reactDom.createPortal(children, dockZone);
+  }
+  return null;
+}
+
+exports.PanelModeSwitcher = PanelModeSwitcher;
+exports.PanelPortal = PanelPortal;
+//# sourceMappingURL=chunk-K4763GD5.cjs.map
+//# sourceMappingURL=chunk-K4763GD5.cjs.map

package/dist/chunk-K4763GD5.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/shell/PanelModeSwitcher.tsx","../src/shell/PanelPortal.tsx"],"names":["jsx","Button","Tooltip","TooltipTrigger","TooltipContent","useIsPhone","useMediaQuery","X","jsxs","ExternalLink","PanelRight","PictureInPicture2","useState","useRef","useCallback","useEffect","usePanelHostSupport","createPortal","PortalContainerProvider","DEFAULT_OVERLAY_ZONE_ID"],"mappings":"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","file":"chunk-K4763GD5.cjs","sourcesContent":["/**\n * PanelModeSwitcher Component\n *\n * User-selectable placements are: popped out, docked, or overlay. `main` is\n * NOT user-selectable — the system decides which surfaces render full-width\n * (e.g. the DM modal); the user just moves floating panels between popout /\n * docked / overlay. The switcher shows a button for each placement you're not\n * currently in (plus close):\n * - Popout/pop-in toggle (unless disablePopout).\n * - Split-screen button (when not docked).\n * - Float-as-overlay button (when not overlay).\n * - Popout mode shows just the pop-in toggle (the window has its own close).\n */\n\nimport { Button, Tooltip, TooltipContent, TooltipTrigger } from '@arbidocs/react/ui'\nimport { ExternalLink, PanelRight, PictureInPicture2, X } from 'lucide-react'\nimport type { MouseEvent, ReactNode } from 'react'\nimport type { ArbiPanelMode as PanelMode } from '@arbidocs/react'\nimport { useIsPhone, useMediaQuery } from '../lib/use-media-query'\n\nconst btnClass = 'h-7 w-7 p-0 text-muted-foreground hover:text-foreground'\n\ninterface SwitcherButtonProps {\n  label: string\n  /** True when rendered inside a popout window (see note below). */\n  inPopout?: boolean\n  onClick: (event: MouseEvent) => void\n  testId: string\n  children: ReactNode\n}\n\n// Icon-only buttons get a visible tooltip with their label, so the icon's meaning\n// is readable on hover and on keyboard focus. Radix tooltips portal into the main\n// window, which would misplace them inside a popout window, so there we fall back\n// to a native title.\nfunction SwitcherButton({\n  label,\n  inPopout = false,\n  onClick,\n  testId,\n  children,\n}: SwitcherButtonProps) {\n  const button = (\n    <Button\n      variant=\"ghost\"\n      size=\"sm\"\n      className={btnClass}\n      aria-label={label}\n      title={inPopout ? label : undefined}\n      onClick={onClick}\n      data-testid={testId}\n    >\n      {children}\n    </Button>\n  )\n  if (inPopout) return button\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>{button}</TooltipTrigger>\n      <TooltipContent>{label}</TooltipContent>\n    </Tooltip>\n  )\n}\n\n// \"Open in new window\" (popout) and \"Float as overlay\" are desktop-only\n// window-management concepts — a tablet has no multi-window/overlay chrome to\n// pop into. 1024px mirrors the common tablet/small-laptop cutoff (Tailwind's\n// `lg`), the usual convention for viewport-driven chrome (as opposed to\n// DocumentViewer's container-width ResizeObserver, which fits ITS OWN toolbar buttons reflowing inside a panel\n// that can be split narrow on a wide desktop — PanelModeSwitcher instead needs\n// to know the actual device class, since popping into \"a new window\" or\n// \"floating overlay\" is meaningless on a touch tablet regardless of how the\n// panel happens to be sized in that moment). Deliberately separate from\n// `useIsPhone` (640px, phones only): this only needs to hide these two\n// buttons, not collapse the whole switcher, at tablet widths.\nconst TABLET_AND_BELOW_QUERY = '(max-width: 1024px)'\n\ninterface PanelModeSwitcherProps {\n  mode: PanelMode\n  onModeChange: (mode: PanelMode) => void\n  onClose?: () => void\n  /** When true, hides the popout button (e.g. for panels whose content breaks in a popup window) */\n  disablePopout?: boolean\n  /**\n   * Override the close-button data-testid. Defaults to `dialog-close-button`\n   * for backwards compatibility. Use a panel-specific value (e.g.\n   * `close-viewer-button`) when there are multiple PanelModeSwitchers in the\n   * DOM at once and tests need to disambiguate.\n   */\n  closeTestId?: string\n}\n\nexport function PanelModeSwitcher({\n  mode,\n  onModeChange,\n  onClose,\n  disablePopout,\n  closeTestId = 'dialog-close-button',\n}: PanelModeSwitcherProps) {\n  const isPopout = mode === 'popout'\n  const isSmallScreen = useIsPhone()\n  const isTabletAndBelow = useMediaQuery(TABLET_AND_BELOW_QUERY)\n\n  // Closing is not a click into the panel: the panel's own click handler would focus the panel\n  // that just closed, and the page's nav would lose its active row.\n  const closeButton = onClose && (\n    <SwitcherButton\n      label=\"Close (Esc)\"\n      onClick={(event) => {\n        event.stopPropagation()\n        onClose()\n      }}\n      testId={closeTestId}\n    >\n      <X className=\"w-3.5 h-3.5\" />\n    </SwitcherButton>\n  )\n\n  // Phones: every panel is an overlay and mode-switching is disabled, so only\n  // the close ✕ is meaningful.\n  if (isSmallScreen) {\n    return <div className=\"flex items-center gap-0.5 flex-shrink-0\">{closeButton}</div>\n  }\n\n  return (\n    <div className=\"flex items-center gap-0.5 flex-shrink-0\">\n      {/* Popout / pop-in toggle — hidden when disablePopout is set, or on\n          tablet-and-below where \"a new window\" isn't a real concept. */}\n      {!disablePopout && !isTabletAndBelow && (\n        <SwitcherButton\n          label={isPopout ? 'Pop back in' : 'Open in new window'}\n          inPopout={isPopout}\n          onClick={() => onModeChange(isPopout ? 'docked' : 'popout')}\n          testId={isPopout ? 'pop-into-main-window-button' : 'open-in-new-window-button'}\n        >\n          <ExternalLink className=\"w-3.5 h-3.5\" />\n        </SwitcherButton>\n      )}\n\n      {/* Split-screen (docked to the side) — shown when not already in it */}\n      {!isPopout && mode !== 'docked' && (\n        <SwitcherButton\n          label=\"Split screen\"\n          onClick={() => onModeChange('docked')}\n          testId=\"dock-panel-button\"\n        >\n          <PanelRight className=\"w-3.5 h-3.5\" />\n        </SwitcherButton>\n      )}\n\n      {/* Float as an overlay sheet — shown when not already an overlay, and\n          not on tablet-and-below (no floating-window chrome to speak of). */}\n      {!isPopout && mode !== 'overlay' && !isTabletAndBelow && (\n        <SwitcherButton\n          label=\"Float as overlay\"\n          onClick={() => onModeChange('overlay')}\n          testId=\"overlay-panel-button\"\n        >\n          <PictureInPicture2 className=\"w-3.5 h-3.5\" />\n        </SwitcherButton>\n      )}\n\n      {/* All non-popout modes: ✕ to close */}\n      {!isPopout && closeButton}\n    </div>\n  )\n}\n","/**\n * PanelPortal Component\n *\n * Thin portal layer that renders children into the right target based on panel mode:\n * - docked: portal to #dock-zone element\n * - overlay: portal to <body> as a slide-out sheet over a backdrop\n * - popout: portal to a separate browser window\n * - main: portal to #main-zone element\n *\n * Manages popup window lifecycle for popout mode.\n * Content-agnostic — just handles where things render.\n */\n\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { DEFAULT_OVERLAY_ZONE_ID } from './Shell'\nimport { usePanelHostSupport } from './panel-host'\nimport { PortalContainerProvider } from '@arbidocs/react/ui'\nimport type { FloatingPanelMode as PanelMode } from '../settings/FloatingPanel'\n\n// Overlay sheet sizing — defaults match the docked width (DEFAULT_DOCK_PX) so a\n// panel is the same size whether pinned or floating, and stays draggable here.\nconst OVERLAY_DEFAULT_PX = 544\nconst OVERLAY_MIN_PX = 360\n\nexport interface PanelPortalProps {\n  panelId: string\n  mode: PanelMode\n  isOpen: boolean\n  /** True while the overlay is animating out before unmounting. */\n  isExiting?: boolean\n  /** Called when popup window is closed externally (user closes the window) */\n  onPopupClosed?: () => void\n  /** Dismisses the panel — used by the overlay backdrop. */\n  onClose?: () => void\n  /** Window title for popout mode */\n  popoutTitle?: string\n  /** Initial overlay width in px (defaults to OVERLAY_DEFAULT_PX). */\n  defaultWidth?: number\n  children: React.ReactNode\n}\n\n/**\n * Overlay sheet — a slide-out panel over the still-visible page, resizable by\n * dragging its left edge. Slides in on mount and out (via isExiting) before\n * unmounting, mirroring the left sidebar's animation.\n */\nfunction OverlaySheet({\n  panelId,\n  isExiting,\n  onClose,\n  defaultWidth,\n  scoped,\n  children,\n}: {\n  panelId: string\n  isExiting?: boolean\n  onClose?: () => void\n  defaultWidth?: number\n  /** Rendered inside the layout's overlay zone (below the topbar) rather than\n   *  over the whole viewport. */\n  scoped?: boolean\n  children: React.ReactNode\n}) {\n  const [width, setWidth] = useState(defaultWidth ?? OVERLAY_DEFAULT_PX)\n  const [isResizing, setIsResizing] = useState(false)\n  // Live cursor position while dragging. The panel keeps its committed `width`\n  // during the drag — only this thin preview line moves — so the heavy panel\n  // content never reflows mid-drag (matching DockZone's split-screen handle).\n  // The width is committed once on mouse-up.\n  const [dragWidth, setDragWidth] = useState<number | null>(null)\n  const dragWidthRef = useRef<number | null>(null)\n  // Once the slide-in has played we drop the entry class, so later re-renders\n  // don't restart the animation.\n  const [hasEntered, setHasEntered] = useState(false)\n\n  const handleResizeStart = useCallback((e: React.MouseEvent) => {\n    e.preventDefault()\n    setHasEntered(true)\n    setIsResizing(true)\n    setDragWidth(null)\n    dragWidthRef.current = null\n  }, [])\n\n  useEffect(() => {\n    if (!isResizing) return\n    const handleMouseMove = (e: MouseEvent) => {\n      // Anchored to the right edge — width grows as the cursor moves left.\n      const max = window.innerWidth * 0.92\n      const next = Math.min(Math.max(window.innerWidth - e.clientX, OVERLAY_MIN_PX), max)\n      dragWidthRef.current = next\n      setDragWidth(next)\n    }\n    const handleMouseUp = () => {\n      if (dragWidthRef.current !== null) setWidth(dragWidthRef.current)\n      setIsResizing(false)\n      setDragWidth(null)\n      dragWidthRef.current = null\n    }\n    document.addEventListener('mousemove', handleMouseMove)\n    document.addEventListener('mouseup', handleMouseUp)\n    document.body.style.cursor = 'col-resize'\n    document.body.style.userSelect = 'none'\n    return () => {\n      document.removeEventListener('mousemove', handleMouseMove)\n      document.removeEventListener('mouseup', handleMouseUp)\n      document.body.style.cursor = ''\n      document.body.style.userSelect = ''\n    }\n  }, [isResizing])\n\n  return (\n    // Scoped: absolute within the layout's overlay zone (below the topbar).\n    // Unscoped fallback: fixed over the whole viewport, as before.\n    <div\n      className={scoped ? 'absolute inset-0 z-40' : 'fixed inset-0 z-50'}\n      data-testid={`${panelId}-overlay`}\n    >\n      {/* In dark mode a 40% black veil crushes the light page text behind the sheet to\n          mid-grey, so the veil is lighter there and the page stays readable underneath. */}\n      <div\n        className={`absolute inset-0 bg-black/40 dark:bg-black/20 duration-200 ${\n          // fill-mode-forwards holds the exit end-state — without it the\n          // element snaps back fully visible for the frames between the\n          // animation finishing and React unmounting it (a flicker).\n          isExiting ? 'animate-out fade-out fill-mode-forwards' : 'animate-in fade-in'\n        }`}\n        onClick={onClose}\n        aria-hidden=\"true\"\n        data-testid={`${panelId}-overlay-backdrop`}\n      />\n      <div\n        style={{ width }}\n        onAnimationEnd={() => !isExiting && setHasEntered(true)}\n        className={`absolute right-0 top-0 bottom-0 flex max-w-[92vw] flex-col border-l max-sm:!w-full max-sm:!max-w-full max-sm:border-l-0 border-border bg-muted shadow-2xl duration-200 ${\n          isExiting\n            ? 'animate-out slide-out-to-right fill-mode-forwards'\n            : // Suppress the slide transform once entered so it doesn't replay.\n              hasEntered\n              ? ''\n              : 'animate-in slide-in-from-right'\n        }`}\n      >\n        {/* Drag handle on the left edge to resize the sheet. */}\n        <div\n          className=\"absolute left-0 top-0 bottom-0 z-10 w-1.5 -translate-x-1/2 cursor-col-resize hover:bg-primary/40\"\n          onMouseDown={handleResizeStart}\n          data-testid={`${panelId}-overlay-resize-handle`}\n        />\n        {children}\n      </div>\n\n      {/* Preview line — tracks the cursor during the drag; the panel resizes\n          to this position only on release. */}\n      {isResizing && dragWidth !== null && (\n        <div\n          className=\"absolute top-0 bottom-0 z-[60] w-0.5 bg-primary pointer-events-none\"\n          style={{ right: dragWidth }}\n        />\n      )}\n      {/* Transparent capture layer so the drag isn't interrupted by elements\n          (iframes, the grid) swallowing pointer events. */}\n      {isResizing && <div className=\"absolute inset-0 z-[55] cursor-col-resize\" />}\n    </div>\n  )\n}\n\nexport function PanelPortal({\n  panelId,\n  mode,\n  isOpen,\n  isExiting,\n  onPopupClosed,\n  onClose,\n  popoutTitle,\n  defaultWidth,\n  children,\n}: PanelPortalProps) {\n  const { windows: windowManager } = usePanelHostSupport()\n  const [popupRoot, setPopupRoot] = useState<HTMLElement | null>(null)\n  const popupWindowIdRef = useRef<string | null>(null)\n\n  // Open popup window when switching to popout mode\n  useEffect(() => {\n    if (!isOpen || mode !== 'popout') {\n      // Close popup if we're leaving popout mode (intentional mode switch, not user closing)\n      if (popupWindowIdRef.current) {\n        // Clear the onClose callback before closing so it doesn't trigger onPopupClosed\n        windowManager.clearOnClose(popupWindowIdRef.current)\n        windowManager.closeWindow(popupWindowIdRef.current)\n        popupWindowIdRef.current = null\n        setPopupRoot(null)\n      }\n      return\n    }\n\n    // Already have a popup open\n    if (popupWindowIdRef.current) return\n\n    const windowId = windowManager.createPopupWindow(\n      `panel-${panelId}`,\n      () => {\n        popupWindowIdRef.current = null\n        setPopupRoot(null)\n        onPopupClosed?.()\n      },\n      popoutTitle || panelId\n    )\n\n    if (windowId) {\n      const rootElement = windowManager.getRootElement(windowId)\n      if (rootElement) {\n        popupWindowIdRef.current = windowId\n        setPopupRoot(rootElement)\n        windowManager.getWindow(windowId)?.focus()\n      }\n    }\n  }, [isOpen, mode, panelId, popoutTitle, onPopupClosed, windowManager])\n\n  // Close the window on unmount, a moment later: a remount straight after (React's StrictMode\n  // replays mount effects) keeps it instead. Closing it and opening another would need a second\n  // click's permission to open a window, and the browser would block the new one as a pop-up.\n  const pendingClose = useRef<ReturnType<typeof setTimeout> | null>(null)\n  useEffect(() => {\n    if (pendingClose.current) {\n      clearTimeout(pendingClose.current)\n      pendingClose.current = null\n    }\n    return () => {\n      const windowId = popupWindowIdRef.current\n      if (!windowId) return\n      popupWindowIdRef.current = null\n      pendingClose.current = setTimeout(() => {\n        pendingClose.current = null\n        // Taken up again by the remount (the open effect reuses a window that is still open).\n        if (popupWindowIdRef.current === windowId) return\n        windowManager.closeWindow(windowId)\n      }, 0)\n    }\n  }, [windowManager])\n\n  if (!isOpen && !isExiting) return null\n\n  // Popout: render into popup window. Its dialogs and menus open there too, not in the window\n  // behind it (where the Sign dialog used to open, out of sight).\n  if (mode === 'popout' && popupRoot) {\n    return createPortal(\n      <PortalContainerProvider container={popupRoot}>{children}</PortalContainerProvider>,\n      popupRoot\n    )\n  }\n\n  // Overlay: a slide-out sheet over the still-visible page. Rendered into the\n  // layout's #app-overlay-zone — the content region BELOW the app topbar — so\n  // the bar stays visible and interactive above every overlay. Falls back to\n  // <body> (viewport-covering) when no zone is mounted (e.g. embedded shells).\n  if (mode === 'overlay') {\n    const overlayZone = document.getElementById(DEFAULT_OVERLAY_ZONE_ID)\n    return createPortal(\n      <OverlaySheet\n        panelId={panelId}\n        isExiting={isExiting}\n        onClose={onClose}\n        defaultWidth={defaultWidth}\n        scoped={overlayZone !== null}\n      >\n        {children}\n      </OverlaySheet>,\n      overlayZone ?? document.body\n    )\n  }\n\n  // Main: render into main content zone\n  if (mode === 'main') {\n    const mainZone = document.getElementById('main-zone')\n    if (mainZone) {\n      return createPortal(children, mainZone)\n    }\n  }\n\n  // Docked: render into dock zone\n  const dockZone = document.getElementById('dock-zone')\n  if (dockZone) {\n    return createPortal(children, dockZone)\n  }\n\n  // No target zone mounted yet — render nothing\n  return null\n}\n"]}