@arbidocs/blocks 0.5.121 → 0.5.122

package/dist/shell/PanelPortal.js

@@ -151,12 +151,21 @@ function PanelPortal({
       }
     }
   }, [isOpen, mode, panelId, popoutTitle, onPopupClosed, windowManager]);
+  const pendingClose = useRef(null);
   useEffect(() => {
+    if (pendingClose.current) {
+      clearTimeout(pendingClose.current);
+      pendingClose.current = null;
+    }
     return () => {
-      if (popupWindowIdRef.current) {
-        windowManager.closeWindow(popupWindowIdRef.current);
-        popupWindowIdRef.current = null;
-      }
+      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;

package/dist/shell/PanelPortal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shell/PanelPortal.tsx"],
-  "sourcesContent": ["/**\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 \u2014 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 \u2014 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 \u2014 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 \u2014 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 \u2014 only this thin preview line moves \u2014 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 \u2014 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 \u2014 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 \u2014 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  // Clean up on unmount. The ref is cleared too: a remount (React's StrictMode replays mount\n  // effects) of a panel that mounts already popped out must open a new window, not keep\n  // pointing at the closed one.\n  useEffect(() => {\n    return () => {\n      if (popupWindowIdRef.current) {\n        windowManager.closeWindow(popupWindowIdRef.current)\n        popupWindowIdRef.current = null\n      }\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 \u2014 the content region BELOW the app topbar \u2014 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 \u2014 render nothing\n  return null\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\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 \u2014 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 \u2014 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 \u2014 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 \u2014 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 \u2014 only this thin preview line moves \u2014 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 \u2014 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 \u2014 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 \u2014 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 \u2014 the content region BELOW the app topbar \u2014 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 \u2014 render nothing\n  return null\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/shell/index.cjs

@@ -3,23 +3,24 @@
 
 var chunkVCEX7COE_cjs = require('../chunk-VCEX7COE.cjs');
 require('../chunk-34HQO4ZQ.cjs');
+var chunkKA3F6TIH_cjs = require('../chunk-KA3F6TIH.cjs');
+var chunkK4763GD5_cjs = require('../chunk-K4763GD5.cjs');
+var chunk2RLA6QO2_cjs = require('../chunk-2RLA6QO2.cjs');
+var chunkNY3YUCOW_cjs = require('../chunk-NY3YUCOW.cjs');
+var chunk325GVZE6_cjs = require('../chunk-325GVZE6.cjs');
+require('../chunk-AHDJXIUB.cjs');
+var chunk6UZC4XVV_cjs = require('../chunk-6UZC4XVV.cjs');
+require('../chunk-JV5TVUOU.cjs');
+var chunkKKYNTWDU_cjs = require('../chunk-KKYNTWDU.cjs');
+require('../chunk-3YZKDCWY.cjs');
+var chunkSJSGSHIT_cjs = require('../chunk-SJSGSHIT.cjs');
 var chunkCT3SLXB7_cjs = require('../chunk-CT3SLXB7.cjs');
-var chunkEHP6OH5D_cjs = require('../chunk-EHP6OH5D.cjs');
-var chunkQFXILJMJ_cjs = require('../chunk-QFXILJMJ.cjs');
-var chunk4NPCDS2X_cjs = require('../chunk-4NPCDS2X.cjs');
-var chunkQ6DQGGP4_cjs = require('../chunk-Q6DQGGP4.cjs');
 var chunkDEXUL3T6_cjs = require('../chunk-DEXUL3T6.cjs');
 var chunkAFQTQC7A_cjs = require('../chunk-AFQTQC7A.cjs');
 var chunkXJEXFEWG_cjs = require('../chunk-XJEXFEWG.cjs');
 var chunkYZSQ7F5K_cjs = require('../chunk-YZSQ7F5K.cjs');
 var chunkKQF7POTG_cjs = require('../chunk-KQF7POTG.cjs');
 var chunkFX3K6LNZ_cjs = require('../chunk-FX3K6LNZ.cjs');
-require('../chunk-AHDJXIUB.cjs');
-var chunk6UZC4XVV_cjs = require('../chunk-6UZC4XVV.cjs');
-require('../chunk-JV5TVUOU.cjs');
-var chunkKKYNTWDU_cjs = require('../chunk-KKYNTWDU.cjs');
-require('../chunk-3YZKDCWY.cjs');
-var chunkSJSGSHIT_cjs = require('../chunk-SJSGSHIT.cjs');
 require('../chunk-PPCATBOY.cjs');
 require('../chunk-TKHCIHE2.cjs');
 require('../chunk-JDFBEGQO.cjs');
@@ -80,193 +81,221 @@ Object.defineProperty(exports, "useInstallPrompt", {
   enumerable: true,
   get: function () { return chunkVCEX7COE_cjs.useInstallPrompt; }
 });
-Object.defineProperty(exports, "DEFAULT_DOCK_WIDTH", {
-  enumerable: true,
-  get: function () { return chunkCT3SLXB7_cjs.DEFAULT_DOCK_WIDTH; }
-});
-Object.defineProperty(exports, "Toaster", {
-  enumerable: true,
-  get: function () { return chunkCT3SLXB7_cjs.Toaster; }
-});
 Object.defineProperty(exports, "ActionCluster", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.ActionCluster; }
+  get: function () { return chunkKA3F6TIH_cjs.ActionCluster; }
 });
 Object.defineProperty(exports, "AskField", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.AskField; }
+  get: function () { return chunkKA3F6TIH_cjs.AskField; }
 });
 Object.defineProperty(exports, "AskRow", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.AskRow; }
+  get: function () { return chunkKA3F6TIH_cjs.AskRow; }
 });
 Object.defineProperty(exports, "AskTrigger", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.AskTrigger; }
+  get: function () { return chunkKA3F6TIH_cjs.AskTrigger; }
 });
 Object.defineProperty(exports, "DEFAULT_ASK_FIELD_LABELS", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.DEFAULT_ASK_FIELD_LABELS; }
+  get: function () { return chunkKA3F6TIH_cjs.DEFAULT_ASK_FIELD_LABELS; }
 });
 Object.defineProperty(exports, "DEFAULT_OFFLINE_PILL_LABELS", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.DEFAULT_OFFLINE_PILL_LABELS; }
+  get: function () { return chunkKA3F6TIH_cjs.DEFAULT_OFFLINE_PILL_LABELS; }
 });
 Object.defineProperty(exports, "DEFAULT_REMOTE_CONTROL_PILL_LABELS", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.DEFAULT_REMOTE_CONTROL_PILL_LABELS; }
+  get: function () { return chunkKA3F6TIH_cjs.DEFAULT_REMOTE_CONTROL_PILL_LABELS; }
 });
 Object.defineProperty(exports, "DEFAULT_TIP_CARD_LABELS", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.DEFAULT_TIP_CARD_LABELS; }
+  get: function () { return chunkKA3F6TIH_cjs.DEFAULT_TIP_CARD_LABELS; }
 });
 Object.defineProperty(exports, "DockZone", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.DockZone; }
+  get: function () { return chunkKA3F6TIH_cjs.DockZone; }
 });
 Object.defineProperty(exports, "OfflinePill", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.OfflinePill; }
+  get: function () { return chunkKA3F6TIH_cjs.OfflinePill; }
 });
 Object.defineProperty(exports, "RemoteControlPill", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.RemoteControlPill; }
+  get: function () { return chunkKA3F6TIH_cjs.RemoteControlPill; }
 });
 Object.defineProperty(exports, "ShellSidebar", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.ShellSidebar; }
+  get: function () { return chunkKA3F6TIH_cjs.ShellSidebar; }
 });
 Object.defineProperty(exports, "SidebarRowAction", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.SidebarRowAction; }
+  get: function () { return chunkKA3F6TIH_cjs.SidebarRowAction; }
 });
 Object.defineProperty(exports, "StatusBadge", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.StatusBadge; }
+  get: function () { return chunkKA3F6TIH_cjs.StatusBadge; }
 });
 Object.defineProperty(exports, "StatusRow", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.StatusRow; }
+  get: function () { return chunkKA3F6TIH_cjs.StatusRow; }
 });
 Object.defineProperty(exports, "TipCard", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.TipCard; }
+  get: function () { return chunkKA3F6TIH_cjs.TipCard; }
 });
 Object.defineProperty(exports, "resolveSidebarLayout", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.resolveSidebarLayout; }
+  get: function () { return chunkKA3F6TIH_cjs.resolveSidebarLayout; }
 });
 Object.defineProperty(exports, "useCloseOnEscape", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.useCloseOnEscape; }
+  get: function () { return chunkKA3F6TIH_cjs.useCloseOnEscape; }
 });
 Object.defineProperty(exports, "useSidebarController", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.useSidebarController; }
+  get: function () { return chunkKA3F6TIH_cjs.useSidebarController; }
 });
 Object.defineProperty(exports, "useSidebarSettle", {
   enumerable: true,
-  get: function () { return chunkEHP6OH5D_cjs.useSidebarSettle; }
+  get: function () { return chunkKA3F6TIH_cjs.useSidebarSettle; }
 });
 Object.defineProperty(exports, "PanelModeSwitcher", {
   enumerable: true,
-  get: function () { return chunkQFXILJMJ_cjs.PanelModeSwitcher; }
+  get: function () { return chunkK4763GD5_cjs.PanelModeSwitcher; }
 });
 Object.defineProperty(exports, "PanelPortal", {
   enumerable: true,
-  get: function () { return chunkQFXILJMJ_cjs.PanelPortal; }
+  get: function () { return chunkK4763GD5_cjs.PanelPortal; }
 });
 Object.defineProperty(exports, "createPanelWindowManager", {
   enumerable: true,
-  get: function () { return chunkQFXILJMJ_cjs.createPanelWindowManager; }
+  get: function () { return chunk2RLA6QO2_cjs.createPanelWindowManager; }
 });
 Object.defineProperty(exports, "usePanelHostSupport", {
   enumerable: true,
-  get: function () { return chunkQFXILJMJ_cjs.usePanelHostSupport; }
+  get: function () { return chunk2RLA6QO2_cjs.usePanelHostSupport; }
 });
 Object.defineProperty(exports, "DEFAULT_MOBILE_BARS_LABELS", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.DEFAULT_MOBILE_BARS_LABELS; }
+  get: function () { return chunkNY3YUCOW_cjs.DEFAULT_MOBILE_BARS_LABELS; }
 });
 Object.defineProperty(exports, "DEFAULT_WORKSPACE_KIND_LABELS", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.DEFAULT_WORKSPACE_KIND_LABELS; }
+  get: function () { return chunkNY3YUCOW_cjs.DEFAULT_WORKSPACE_KIND_LABELS; }
 });
 Object.defineProperty(exports, "DEFAULT_WORKSPACE_SWITCHER_LABELS", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.DEFAULT_WORKSPACE_SWITCHER_LABELS; }
+  get: function () { return chunkNY3YUCOW_cjs.DEFAULT_WORKSPACE_SWITCHER_LABELS; }
 });
 Object.defineProperty(exports, "MobileAppBar", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.MobileAppBar; }
+  get: function () { return chunkNY3YUCOW_cjs.MobileAppBar; }
 });
 Object.defineProperty(exports, "MobileTabBar", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.MobileTabBar; }
+  get: function () { return chunkNY3YUCOW_cjs.MobileTabBar; }
 });
 Object.defineProperty(exports, "WorkspaceIdentity", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.WorkspaceIdentity; }
+  get: function () { return chunkNY3YUCOW_cjs.WorkspaceIdentity; }
 });
 Object.defineProperty(exports, "WorkspaceSwitcher", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.WorkspaceSwitcher; }
+  get: function () { return chunkNY3YUCOW_cjs.WorkspaceSwitcher; }
 });
 Object.defineProperty(exports, "hasUnsavedInput", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.hasUnsavedInput; }
+  get: function () { return chunkNY3YUCOW_cjs.hasUnsavedInput; }
 });
 Object.defineProperty(exports, "installReloadPolicy", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.installReloadPolicy; }
+  get: function () { return chunkNY3YUCOW_cjs.installReloadPolicy; }
 });
 Object.defineProperty(exports, "markBuildStale", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.markBuildStale; }
+  get: function () { return chunkNY3YUCOW_cjs.markBuildStale; }
 });
 Object.defineProperty(exports, "prefetchChunk", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.prefetchChunk; }
+  get: function () { return chunkNY3YUCOW_cjs.prefetchChunk; }
 });
 Object.defineProperty(exports, "requestReload", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.requestReload; }
+  get: function () { return chunkNY3YUCOW_cjs.requestReload; }
 });
 Object.defineProperty(exports, "workspaceKindColor", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.workspaceKindColor; }
+  get: function () { return chunkNY3YUCOW_cjs.workspaceKindColor; }
 });
 Object.defineProperty(exports, "workspaceKindMeta", {
   enumerable: true,
-  get: function () { return chunk4NPCDS2X_cjs.workspaceKindMeta; }
+  get: function () { return chunkNY3YUCOW_cjs.workspaceKindMeta; }
 });
 Object.defineProperty(exports, "DEFAULT_SIDEBAR_LABELS", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.DEFAULT_SIDEBAR_LABELS; }
+  get: function () { return chunk325GVZE6_cjs.DEFAULT_SIDEBAR_LABELS; }
 });
 Object.defineProperty(exports, "SHELL_START_INSET_VAR", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.SHELL_START_INSET_VAR; }
+  get: function () { return chunk325GVZE6_cjs.SHELL_START_INSET_VAR; }
 });
 Object.defineProperty(exports, "Sidebar", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.Sidebar; }
+  get: function () { return chunk325GVZE6_cjs.Sidebar; }
 });
 Object.defineProperty(exports, "SidebarBadgeRow", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.SidebarBadgeRow; }
+  get: function () { return chunk325GVZE6_cjs.SidebarBadgeRow; }
 });
 Object.defineProperty(exports, "SidebarRowHoverContext", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.SidebarRowHoverContext; }
+  get: function () { return chunk325GVZE6_cjs.SidebarRowHoverContext; }
 });
 Object.defineProperty(exports, "useShellStartInset", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.useShellStartInset; }
+  get: function () { return chunk325GVZE6_cjs.useShellStartInset; }
 });
 Object.defineProperty(exports, "useSidebarContext", {
   enumerable: true,
-  get: function () { return chunkQ6DQGGP4_cjs.useSidebarContext; }
+  get: function () { return chunk325GVZE6_cjs.useSidebarContext; }
+});
+Object.defineProperty(exports, "DEFAULT_FILTER_FIELDS", {
+  enumerable: true,
+  get: function () { return chunk6UZC4XVV_cjs.DEFAULT_FILTER_FIELDS; }
+});
+Object.defineProperty(exports, "DEFAULT_FILTER_INPUT_LABELS", {
+  enumerable: true,
+  get: function () { return chunk6UZC4XVV_cjs.DEFAULT_FILTER_INPUT_LABELS; }
+});
+Object.defineProperty(exports, "FilterInput", {
+  enumerable: true,
+  get: function () { return chunk6UZC4XVV_cjs.FilterInput; }
+});
+Object.defineProperty(exports, "getInstallInstructions", {
+  enumerable: true,
+  get: function () { return chunkKKYNTWDU_cjs.getInstallInstructions; }
+});
+Object.defineProperty(exports, "isIosDevice", {
+  enumerable: true,
+  get: function () { return chunkKKYNTWDU_cjs.isIosDevice; }
+});
+Object.defineProperty(exports, "DEFAULT_TAB_HEADER_LABELS", {
+  enumerable: true,
+  get: function () { return chunkSJSGSHIT_cjs.DEFAULT_TAB_HEADER_LABELS; }
+});
+Object.defineProperty(exports, "TabHeader", {
+  enumerable: true,
+  get: function () { return chunkSJSGSHIT_cjs.TabHeader; }
+});
+Object.defineProperty(exports, "DEFAULT_DOCK_WIDTH", {
+  enumerable: true,
+  get: function () { return chunkCT3SLXB7_cjs.DEFAULT_DOCK_WIDTH; }
+});
+Object.defineProperty(exports, "Toaster", {
+  enumerable: true,
+  get: function () { return chunkCT3SLXB7_cjs.Toaster; }
 });
 Object.defineProperty(exports, "STATUS_ROW_BASE_CLASS", {
   enumerable: true,
@@ -328,33 +357,5 @@ Object.defineProperty(exports, "useMediaQuery", {
   enumerable: true,
   get: function () { return chunkFX3K6LNZ_cjs.useMediaQuery; }
 });
-Object.defineProperty(exports, "DEFAULT_FILTER_FIELDS", {
-  enumerable: true,
-  get: function () { return chunk6UZC4XVV_cjs.DEFAULT_FILTER_FIELDS; }
-});
-Object.defineProperty(exports, "DEFAULT_FILTER_INPUT_LABELS", {
-  enumerable: true,
-  get: function () { return chunk6UZC4XVV_cjs.DEFAULT_FILTER_INPUT_LABELS; }
-});
-Object.defineProperty(exports, "FilterInput", {
-  enumerable: true,
-  get: function () { return chunk6UZC4XVV_cjs.FilterInput; }
-});
-Object.defineProperty(exports, "getInstallInstructions", {
-  enumerable: true,
-  get: function () { return chunkKKYNTWDU_cjs.getInstallInstructions; }
-});
-Object.defineProperty(exports, "isIosDevice", {
-  enumerable: true,
-  get: function () { return chunkKKYNTWDU_cjs.isIosDevice; }
-});
-Object.defineProperty(exports, "DEFAULT_TAB_HEADER_LABELS", {
-  enumerable: true,
-  get: function () { return chunkSJSGSHIT_cjs.DEFAULT_TAB_HEADER_LABELS; }
-});
-Object.defineProperty(exports, "TabHeader", {
-  enumerable: true,
-  get: function () { return chunkSJSGSHIT_cjs.TabHeader; }
-});
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/shell/panel-windows.js

@@ -12,6 +12,7 @@ class PanelWindowManager {
     if (this.windows.has(windowId)) {
       const existing = this.windows.get(windowId);
       if (existing && !existing.window.closed) {
+        if (onClose) existing.onClose = onClose;
         existing.window.focus();
         return windowId;
       } else {

package/dist/shell/panel-windows.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shell/panel-windows.ts"],
-  "sourcesContent": ["/**\n * Window Manager for Pop-out Panels\n *\n * Handles creating, managing, and communicating with popup windows\n */\n\ninterface PopupWindow {\n  id: string\n  window: Window\n  panelId: string\n  rootElement: HTMLElement | null\n  onClose?: () => void\n}\n\n/** Window lifecycle port; hosts may share or replace the browser implementation. */\nexport interface PanelWindows {\n  createPopupWindow(panelId: string, onClose?: () => void, title?: string): string | null\n  getWindow(windowId: string): Window | null\n  getRootElement(windowId: string): HTMLElement | null\n  focusPanelWindow(panelId: string): boolean\n  clearOnClose(windowId: string): void\n  closeWindow(windowId: string): void\n  closeAllWindows(): void\n}\n\nclass PanelWindowManager implements PanelWindows {\n  constructor(private readonly defaultTitle = 'Panel') {}\n  private windows = new Map<string, PopupWindow>()\n  /** Counts the windows opened, for their browser names. */\n  private opened = 0\n\n  createPopupWindow(panelId: string, onClose?: () => void, title?: string): string | null {\n    const windowId = `panel-window-${panelId}`\n\n    // Check if window already exists\n    if (this.windows.has(windowId)) {\n      const existing = this.windows.get(windowId)\n      if (existing && !existing.window.closed) {\n        existing.window.focus()\n        return windowId\n      } else {\n        // Clean up closed window\n        this.windows.delete(windowId)\n      }\n    }\n\n    // Position popup in the right half of the screen\n    const currentWidth = window.outerWidth\n    const currentHeight = window.outerHeight\n    const currentLeft = window.screenX ?? window.screenLeft ?? 0\n    const currentTop = window.screenY ?? window.screenTop ?? 0\n\n    // Calculate popup position (right half)\n    const halfWidth = Math.floor(currentWidth / 2)\n    const popupWidth = halfWidth\n    const popupHeight = currentHeight\n    const left = currentLeft + halfWidth\n    const top = currentTop\n\n    const popup = window.open(\n      '',\n      // A browser window name of its own: one closed a moment ago (a panel remounted, as React's\n      // StrictMode does) may still be closing, and reusing its name would hand back that window.\n      `${windowId}-${++this.opened}`,\n      `width=${popupWidth},height=${popupHeight},left=${left},top=${top},scrollbars=yes,resizable=yes,menubar=no,toolbar=no,location=no,status=no`\n    )\n\n    if (!popup) {\n      console.error('Failed to create popup window - popup blocked?')\n      return null\n    }\n\n    // Set up the popup window HTML with proper CSS links\n    const mainDocument = document\n    const stylesheets = Array.from(\n      mainDocument.head.querySelectorAll('link[rel=\"stylesheet\"], style')\n    )\n      .map((el) => el.outerHTML)\n      .join('\\n')\n\n    popup.document.write(`\n      <!DOCTYPE html>\n      <html lang=\"en\">\n        <head>\n          <meta charset=\"UTF-8\">\n          <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n          <title></title>\n          <!-- about:blank has no base, so copied @font-face / asset URLs (e.g.\n               /assets/font.woff2) would resolve against nothing and render as\n               tofu squares. Anchor relative URLs to the app origin. -->\n          <base href=\"${window.location.origin}/\">\n          ${stylesheets}\n          <style>\n            body {\n              margin: 0;\n              padding: 0;\n              font-family: system-ui, -apple-system, sans-serif;\n            }\n            #panel-root {\n              width: 100%;\n              height: 100vh;\n              overflow: hidden;\n            }\n            * {\n              box-sizing: border-box;\n            }\n          </style>\n        </head>\n        <body>\n          <div id=\"panel-root\"></div>\n        </body>\n      </html>\n    `)\n    popup.document.close()\n    // A host title is text, even when it contains HTML delimiters.\n    popup.document.title = title || this.defaultTitle\n\n    // Belt-and-suspenders: re-register the parent's already-loaded web fonts in\n    // the popup's FontFaceSet, so glyphs render even if a copied @font-face\n    // doesn't re-fetch. Best-effort \u2014 engines that reject a cross-document add\n    // just fall back to the <base>-anchored @font-face rules above.\n    try {\n      mainDocument.fonts.forEach((font) => {\n        try {\n          popup.document.fonts.add(font)\n        } catch {\n          /* ignore per-font failures */\n        }\n      })\n    } catch {\n      /* FontFaceSet unavailable \u2014 ignore */\n    }\n\n    // Get root element after DOM is ready\n    const rootElement = popup.document.getElementById('panel-root')\n\n    // Store window reference\n    const popupWindow: PopupWindow = {\n      id: windowId,\n      window: popup,\n      panelId,\n      rootElement,\n      onClose,\n    }\n    this.windows.set(windowId, popupWindow)\n\n    // Handle window close \u2014 read onClose from the map entry so clearOnClose() works\n    const closeCheckInterval = setInterval(() => {\n      if (popup.closed) {\n        clearInterval(closeCheckInterval)\n        const entry = this.windows.get(windowId)\n        // The panel may have a newer window by now (closed and reopened): leave that one be.\n        if (entry?.window !== popup) return\n        this.windows.delete(windowId)\n        entry.onClose?.()\n      }\n    }, 200)\n\n    return windowId\n  }\n\n  getWindow(windowId: string): Window | null {\n    const popup = this.windows.get(windowId)\n    return popup && !popup.window.closed ? popup.window : null\n  }\n\n  getRootElement(windowId: string): HTMLElement | null {\n    const popup = this.windows.get(windowId)\n    return popup && !popup.window.closed ? popup.rootElement : null\n  }\n\n  /** Focus the popup window for a given panel ID. Returns true if focused. */\n  focusPanelWindow(panelId: string): boolean {\n    const windowId = `panel-window-panel-${panelId}`\n    const popup = this.windows.get(windowId)\n    if (popup && !popup.window.closed) {\n      popup.window.focus()\n      return true\n    }\n    return false\n  }\n\n  /** Remove the onClose callback so it won't fire when the window is closed programmatically. */\n  clearOnClose(windowId: string): void {\n    const popup = this.windows.get(windowId)\n    if (popup) {\n      popup.onClose = undefined\n    }\n  }\n\n  closeWindow(windowId: string): void {\n    const popup = this.windows.get(windowId)\n    if (popup && !popup.window.closed) {\n      popup.window.close()\n    }\n    this.windows.delete(windowId)\n  }\n\n  closeAllWindows(): void {\n    for (const [, popup] of this.windows) {\n      if (!popup.window.closed) {\n        popup.window.close()\n      }\n    }\n    this.windows.clear()\n  }\n}\n\n/** A window registry shared by the host's panel controls and portal layer. */\nexport function createPanelWindowManager(options: { defaultTitle?: string } = {}) {\n  return new PanelWindowManager(options.defaultTitle)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * Window Manager for Pop-out Panels\n *\n * Handles creating, managing, and communicating with popup windows\n */\n\ninterface PopupWindow {\n  id: string\n  window: Window\n  panelId: string\n  rootElement: HTMLElement | null\n  onClose?: () => void\n}\n\n/** Window lifecycle port; hosts may share or replace the browser implementation. */\nexport interface PanelWindows {\n  createPopupWindow(panelId: string, onClose?: () => void, title?: string): string | null\n  getWindow(windowId: string): Window | null\n  getRootElement(windowId: string): HTMLElement | null\n  focusPanelWindow(panelId: string): boolean\n  clearOnClose(windowId: string): void\n  closeWindow(windowId: string): void\n  closeAllWindows(): void\n}\n\nclass PanelWindowManager implements PanelWindows {\n  constructor(private readonly defaultTitle = 'Panel') {}\n  private windows = new Map<string, PopupWindow>()\n  /** Counts the windows opened, for their browser names. */\n  private opened = 0\n\n  createPopupWindow(panelId: string, onClose?: () => void, title?: string): string | null {\n    const windowId = `panel-window-${panelId}`\n\n    // Check if window already exists\n    if (this.windows.has(windowId)) {\n      const existing = this.windows.get(windowId)\n      if (existing && !existing.window.closed) {\n        // Opened ahead in a click (so the browser lets it open); the panel adopts it.\n        if (onClose) existing.onClose = onClose\n        existing.window.focus()\n        return windowId\n      } else {\n        // Clean up closed window\n        this.windows.delete(windowId)\n      }\n    }\n\n    // Position popup in the right half of the screen\n    const currentWidth = window.outerWidth\n    const currentHeight = window.outerHeight\n    const currentLeft = window.screenX ?? window.screenLeft ?? 0\n    const currentTop = window.screenY ?? window.screenTop ?? 0\n\n    // Calculate popup position (right half)\n    const halfWidth = Math.floor(currentWidth / 2)\n    const popupWidth = halfWidth\n    const popupHeight = currentHeight\n    const left = currentLeft + halfWidth\n    const top = currentTop\n\n    const popup = window.open(\n      '',\n      // A browser window name of its own: one closed a moment ago (a panel remounted, as React's\n      // StrictMode does) may still be closing, and reusing its name would hand back that window.\n      `${windowId}-${++this.opened}`,\n      `width=${popupWidth},height=${popupHeight},left=${left},top=${top},scrollbars=yes,resizable=yes,menubar=no,toolbar=no,location=no,status=no`\n    )\n\n    if (!popup) {\n      console.error('Failed to create popup window - popup blocked?')\n      return null\n    }\n\n    // Set up the popup window HTML with proper CSS links\n    const mainDocument = document\n    const stylesheets = Array.from(\n      mainDocument.head.querySelectorAll('link[rel=\"stylesheet\"], style')\n    )\n      .map((el) => el.outerHTML)\n      .join('\\n')\n\n    popup.document.write(`\n      <!DOCTYPE html>\n      <html lang=\"en\">\n        <head>\n          <meta charset=\"UTF-8\">\n          <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n          <title></title>\n          <!-- about:blank has no base, so copied @font-face / asset URLs (e.g.\n               /assets/font.woff2) would resolve against nothing and render as\n               tofu squares. Anchor relative URLs to the app origin. -->\n          <base href=\"${window.location.origin}/\">\n          ${stylesheets}\n          <style>\n            body {\n              margin: 0;\n              padding: 0;\n              font-family: system-ui, -apple-system, sans-serif;\n            }\n            #panel-root {\n              width: 100%;\n              height: 100vh;\n              overflow: hidden;\n            }\n            * {\n              box-sizing: border-box;\n            }\n          </style>\n        </head>\n        <body>\n          <div id=\"panel-root\"></div>\n        </body>\n      </html>\n    `)\n    popup.document.close()\n    // A host title is text, even when it contains HTML delimiters.\n    popup.document.title = title || this.defaultTitle\n\n    // Belt-and-suspenders: re-register the parent's already-loaded web fonts in\n    // the popup's FontFaceSet, so glyphs render even if a copied @font-face\n    // doesn't re-fetch. Best-effort \u2014 engines that reject a cross-document add\n    // just fall back to the <base>-anchored @font-face rules above.\n    try {\n      mainDocument.fonts.forEach((font) => {\n        try {\n          popup.document.fonts.add(font)\n        } catch {\n          /* ignore per-font failures */\n        }\n      })\n    } catch {\n      /* FontFaceSet unavailable \u2014 ignore */\n    }\n\n    // Get root element after DOM is ready\n    const rootElement = popup.document.getElementById('panel-root')\n\n    // Store window reference\n    const popupWindow: PopupWindow = {\n      id: windowId,\n      window: popup,\n      panelId,\n      rootElement,\n      onClose,\n    }\n    this.windows.set(windowId, popupWindow)\n\n    // Handle window close \u2014 read onClose from the map entry so clearOnClose() works\n    const closeCheckInterval = setInterval(() => {\n      if (popup.closed) {\n        clearInterval(closeCheckInterval)\n        const entry = this.windows.get(windowId)\n        // The panel may have a newer window by now (closed and reopened): leave that one be.\n        if (entry?.window !== popup) return\n        this.windows.delete(windowId)\n        entry.onClose?.()\n      }\n    }, 200)\n\n    return windowId\n  }\n\n  getWindow(windowId: string): Window | null {\n    const popup = this.windows.get(windowId)\n    return popup && !popup.window.closed ? popup.window : null\n  }\n\n  getRootElement(windowId: string): HTMLElement | null {\n    const popup = this.windows.get(windowId)\n    return popup && !popup.window.closed ? popup.rootElement : null\n  }\n\n  /** Focus the popup window for a given panel ID. Returns true if focused. */\n  focusPanelWindow(panelId: string): boolean {\n    const windowId = `panel-window-panel-${panelId}`\n    const popup = this.windows.get(windowId)\n    if (popup && !popup.window.closed) {\n      popup.window.focus()\n      return true\n    }\n    return false\n  }\n\n  /** Remove the onClose callback so it won't fire when the window is closed programmatically. */\n  clearOnClose(windowId: string): void {\n    const popup = this.windows.get(windowId)\n    if (popup) {\n      popup.onClose = undefined\n    }\n  }\n\n  closeWindow(windowId: string): void {\n    const popup = this.windows.get(windowId)\n    if (popup && !popup.window.closed) {\n      popup.window.close()\n    }\n    this.windows.delete(windowId)\n  }\n\n  closeAllWindows(): void {\n    for (const [, popup] of this.windows) {\n      if (!popup.window.closed) {\n        popup.window.close()\n      }\n    }\n    this.windows.clear()\n  }\n}\n\n/** A window registry shared by the host's panel controls and portal layer. */\nexport function createPanelWindowManager(options: { defaultTitle?: string } = {}) {\n  return new PanelWindowManager(options.defaultTitle)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/studio/index.cjs

@@ -1,34 +1,24 @@
 "use client";
 'use strict';
 
-var chunk474GPLCM_cjs = require('../chunk-474GPLCM.cjs');
-require('../chunk-NAJN32MF.cjs');
-require('../chunk-NLOETJCB.cjs');
-require('../chunk-GKVE5JGB.cjs');
-require('../chunk-GQXPNIRE.cjs');
+var chunk7L4X6QN2_cjs = require('../chunk-7L4X6QN2.cjs');
+require('../chunk-XF355M7O.cjs');
+require('../chunk-2F57IO7S.cjs');
+require('../chunk-UFT22LAB.cjs');
+require('../chunk-WAV762GP.cjs');
 var chunk4EK7TAP7_cjs = require('../chunk-4EK7TAP7.cjs');
 var chunkUZHWXKS6_cjs = require('../chunk-UZHWXKS6.cjs');
 var chunkPBPO54KZ_cjs = require('../chunk-PBPO54KZ.cjs');
 var chunkVRK3IQAP_cjs = require('../chunk-VRK3IQAP.cjs');
 var chunkANWJG4A4_cjs = require('../chunk-ANWJG4A4.cjs');
 var chunkICZSVCDT_cjs = require('../chunk-ICZSVCDT.cjs');
-var chunk2W5E62EY_cjs = require('../chunk-2W5E62EY.cjs');
+var chunkSGYSDABK_cjs = require('../chunk-SGYSDABK.cjs');
 var chunkNEGFHF3V_cjs = require('../chunk-NEGFHF3V.cjs');
 require('../chunk-ADMNU2CR.cjs');
 var chunkPCB2BPN3_cjs = require('../chunk-PCB2BPN3.cjs');
-require('../chunk-KNGZZC4O.cjs');
-require('../chunk-IDCD5TEZ.cjs');
-require('../chunk-M2FOXGJU.cjs');
-require('../chunk-5F4DCIHS.cjs');
 var chunk34HQO4ZQ_cjs = require('../chunk-34HQO4ZQ.cjs');
-require('../chunk-Q6DQGGP4.cjs');
+require('../chunk-325GVZE6.cjs');
 require('../chunk-NWNVWO6L.cjs');
-require('../chunk-AFQTQC7A.cjs');
-require('../chunk-XJEXFEWG.cjs');
-require('../chunk-YZSQ7F5K.cjs');
-require('../chunk-MCXS6X37.cjs');
-require('../chunk-KQF7POTG.cjs');
-require('../chunk-75BNMCUX.cjs');
 var chunkULPTSXXO_cjs = require('../chunk-ULPTSXXO.cjs');
 var chunkZU2B2RZK_cjs = require('../chunk-ZU2B2RZK.cjs');
 var chunkNSD37OF5_cjs = require('../chunk-NSD37OF5.cjs');
@@ -36,23 +26,33 @@ require('../chunk-OEJQFPWO.cjs');
 require('../chunk-I4IS6ST6.cjs');
 require('../chunk-7JLJH5CW.cjs');
 require('../chunk-EVZH6Z5O.cjs');
-require('../chunk-IN6ILI5A.cjs');
-require('../chunk-HSLPFBK2.cjs');
 require('../chunk-II2OEXHW.cjs');
-require('../chunk-MZ2KZXNU.cjs');
+require('../chunk-WXUU3COI.cjs');
 require('../chunk-AHDJXIUB.cjs');
 require('../chunk-YVCOQHCE.cjs');
-require('../chunk-QGVOT7E4.cjs');
-require('../chunk-QRAQZTJE.cjs');
-require('../chunk-UDSHVNU3.cjs');
 require('../chunk-JV5TVUOU.cjs');
-var chunkIPSHAMO2_cjs = require('../chunk-IPSHAMO2.cjs');
 require('../chunk-VZOOGA47.cjs');
 require('../chunk-HQDR43JC.cjs');
 var chunkJR2YSBD5_cjs = require('../chunk-JR2YSBD5.cjs');
 require('../chunk-3YZKDCWY.cjs');
-require('../chunk-PPCATBOY.cjs');
 var chunkZW6FPIFC_cjs = require('../chunk-ZW6FPIFC.cjs');
+require('../chunk-KNGZZC4O.cjs');
+require('../chunk-IDCD5TEZ.cjs');
+require('../chunk-M2FOXGJU.cjs');
+require('../chunk-5F4DCIHS.cjs');
+require('../chunk-AFQTQC7A.cjs');
+require('../chunk-XJEXFEWG.cjs');
+require('../chunk-YZSQ7F5K.cjs');
+require('../chunk-MCXS6X37.cjs');
+require('../chunk-KQF7POTG.cjs');
+require('../chunk-75BNMCUX.cjs');
+require('../chunk-IN6ILI5A.cjs');
+require('../chunk-HSLPFBK2.cjs');
+require('../chunk-QGVOT7E4.cjs');
+require('../chunk-QRAQZTJE.cjs');
+require('../chunk-UDSHVNU3.cjs');
+var chunkIPSHAMO2_cjs = require('../chunk-IPSHAMO2.cjs');
+require('../chunk-PPCATBOY.cjs');
 var chunkTKHCIHE2_cjs = require('../chunk-TKHCIHE2.cjs');
 require('../chunk-JDFBEGQO.cjs');
 require('../chunk-ULWRNGGE.cjs');
@@ -619,7 +619,7 @@ function StudioEditor({
           className: "w-80 shrink-0 border-l border-border",
           "data-testid": `${testIdPrefix}-theme-drawer`,
           children: /* @__PURE__ */ jsxRuntime.jsx(
-            chunk2W5E62EY_cjs.ThemeEditor,
+            chunkSGYSDABK_cjs.ThemeEditor,
             {
               bundle: themeBundle,
               variant: "drawer",
@@ -992,7 +992,7 @@ function latestImageDocId(artifacts) {
   return null;
 }
 function useImageGen() {
-  const task = chunk474GPLCM_cjs.useConnectedAiTask();
+  const task = chunk7L4X6QN2_cjs.useConnectedAiTask();
   const { run } = task;
   const generate = react.useCallback(
     async (prompt, referenceDocIds = []) => {
@@ -3391,7 +3391,7 @@ function VerticalBuilder({
         ] })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx(ui.TabsContent, { value: "theme", children: /* @__PURE__ */ jsxRuntime.jsx(
-        chunk2W5E62EY_cjs.ThemeEditor,
+        chunkSGYSDABK_cjs.ThemeEditor,
         {
           bundle: themeBundle,
           variant: "panel",