@arbidocs/blocks 0.5.121 → 0.5.123

package/dist/chunk-GX2EBMJW.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/connection/panels/useSessionPanelMode.ts","../src/connection/panels/ConnectedPanelHost.tsx"],"names":["useArbiSessionState","useArbiSessionStore","useIsPhone","useRef","useEffect","useCallback","usePanelHostSupport","useState","jsx","PanelModeSwitcher","FloatingPanel","PanelPortal"],"mappings":"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","file":"chunk-GX2EBMJW.cjs","sourcesContent":["/**\n * useSessionPanelMode Hook\n *\n * Reads and writes a panel's display mode (floating/docked/popout) from the shared session.\n *\n * defaultMode is applied every time the panel opens (isOpen transitions to true),\n * so a panel with defaultMode=\"docked\" will always dock on open — even if it was\n * previously kicked to floating by another panel docking.\n *\n * Users can still switch modes manually; the switch is respected until the panel\n * closes and reopens.\n */\n\nimport { useCallback, useEffect, useRef } from 'react'\nimport { useIsPhone } from '../../lib/use-media-query'\nimport { useArbiSessionState, useArbiSessionStore, type ArbiPanelMode } from '@arbidocs/react'\n\nexport type PanelMode = ArbiPanelMode\n\nexport function useSessionPanelMode(\n  panelId: string,\n  defaultMode: PanelMode = 'docked',\n  isOpen = true\n) {\n  const panelModes = useArbiSessionState((s) => s.shell.panels.modes)\n  // Opened straight into a window of its own (`openPanel(id, 'popout')`, e.g. a document opened to\n  // share in a call): that is where it opens, not its default place.\n  const openedPoppedOut = useArbiSessionState((s) => s.shell.panels.popout === panelId)\n  const setPanelModeStore = useArbiSessionStore().setPanelMode\n  const isSmallScreen = useIsPhone()\n  const prevOpenRef = useRef(false)\n\n  // The right-hand panel mirrors the left sidebar: parked in the layout\n  // ('docked', which pushes content) or floating over it ('overlay', a\n  // slide-out sheet + backdrop). On phones the parked split and popout windows\n  // don't fit, so coerce to 'overlay' below the breakpoint — only the *default*\n  // changes with screen size. Driving the *stored* mode keeps every consumer\n  // consistent (slot placement + the FloatingPanel renderer all agree).\n  const mode: PanelMode = isSmallScreen ? 'overlay' : panelModes[panelId] || defaultMode\n\n  // Reset to the effective default when the panel opens (small screen always\n  // 'overlay'), so sidebar buttons reliably bring panels back to their mode.\n  useEffect(() => {\n    if (isOpen && !prevOpenRef.current && !(openedPoppedOut && !isSmallScreen)) {\n      setPanelModeStore(panelId, isSmallScreen ? 'overlay' : defaultMode)\n    }\n    prevOpenRef.current = isOpen\n  }, [isOpen, panelId, defaultMode, isSmallScreen, setPanelModeStore, openedPoppedOut])\n\n  // If the viewport shrinks past the breakpoint while a panel is open and still\n  // parked/popout, snap it to 'overlay' so the split layout never clips.\n  useEffect(() => {\n    if (isSmallScreen && isOpen && panelModes[panelId] && panelModes[panelId] !== 'overlay') {\n      setPanelModeStore(panelId, 'overlay')\n    }\n  }, [isSmallScreen, isOpen, panelId, panelModes, setPanelModeStore])\n\n  const setPanelMode = useCallback(\n    (newMode: PanelMode) => {\n      // Mode switching is a desktop affordance; on phones everything is 'main'.\n      if (isSmallScreen) return\n      setPanelModeStore(panelId, newMode)\n    },\n    [panelId, isSmallScreen, setPanelModeStore]\n  )\n\n  return { mode, setPanelMode }\n}\n","/**\n * ConnectedPanelHost Component\n *\n * Panel that supports four display modes via PanelPortal: docked, main, overlay, and popout.\n *\n * Binds panel placement (mode persistence, focus, Escape, slide-out animation, portals) to the\n * presentational `FloatingPanel` block in `@arbidocs/blocks`, which owns the header and body. For components that manage their own header (e.g., DocumentViewer), pass children as a\n * render function to receive the modeSwitcher element.\n */\n\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport { FloatingPanel as FloatingPanelView } from '../../settings/FloatingPanel'\nimport { PanelPortal } from '../../shell/PanelPortal'\nimport { PanelModeSwitcher } from '../../shell/PanelModeSwitcher'\nimport { useSessionPanelMode } from './useSessionPanelMode'\nimport type { PanelMode } from './useSessionPanelMode'\nimport { useArbiSessionState, useArbiSessionStore } from '@arbidocs/react'\nimport { usePanelHostSupport } from '../../shell/panel-host'\n\nexport interface ConnectedPanelHostProps {\n  /** Unique ID for persisting panel mode */\n  panelId: string\n  /** Whether the panel is open */\n  isOpen: boolean\n  /** Callback when panel is closed */\n  onClose: () => void\n  /** Panel title */\n  title: string\n  /** Subtitle shown below title */\n  subtitle?: string\n  /** Panel content — can be a render function receiving the modeSwitcher element */\n  children: React.ReactNode | ((controls: { modeSwitcher: React.ReactNode }) => React.ReactNode)\n  /** Default display mode */\n  defaultMode?: PanelMode\n  /** When true, hides the popout button and resets any persisted popout mode */\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 when multiple\n   * floating panels can be open at once and tests need to disambiguate.\n   */\n  closeTestId?: string\n  /** Initial overlay width in px (overlay mode only). */\n  defaultWidth?: number\n}\n\nexport function ConnectedPanelHost({\n  panelId,\n  isOpen,\n  onClose,\n  title,\n  subtitle,\n  children,\n  defaultMode = 'docked',\n  disablePopout,\n  closeTestId,\n  defaultWidth,\n}: ConnectedPanelHostProps) {\n  const { mode, setPanelMode } = useSessionPanelMode(panelId, defaultMode, isOpen)\n\n  // If popout is disabled but stored mode is 'popout', reset it immediately\n  useEffect(() => {\n    if (disablePopout && mode === 'popout') {\n      setPanelMode(defaultMode)\n    }\n  }, [disablePopout, mode, defaultMode, setPanelMode])\n\n  const handlePopupClosed = useCallback(() => {\n    onClose()\n  }, [onClose])\n\n  const setFocusedArea = useArbiSessionStore().setFocusedArea\n  const { popoutTitle } = usePanelHostSupport()\n  const focusedArea = useArbiSessionState((s) => s.shell.focusedArea)\n  const handlePanelFocus = useCallback(() => {\n    setFocusedArea(panelId)\n  }, [panelId, setFocusedArea])\n\n  // Escape closes the panel you're working in. Only the focused panel responds,\n  // so stacked panels don't all collapse at once. We defer to text entry and to\n  // any open dialog/popover/menu so Escape there keeps its usual meaning. Popout\n  // panels live in their own window and close with it, so they opt out here.\n  useEffect(() => {\n    if (!isOpen || mode === 'popout' || focusedArea !== panelId) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key !== 'Escape' || e.defaultPrevented) return\n      const active = document.activeElement\n      if (active?.matches('input, textarea, select, [contenteditable=\"true\"]')) return\n      if (\n        document.querySelector(\n          '[role=\"dialog\"][data-state=\"open\"], [data-radix-popper-content-wrapper]'\n        )\n      )\n        return\n      onClose()\n    }\n    window.addEventListener('keydown', onKeyDown)\n    return () => window.removeEventListener('keydown', onKeyDown)\n  }, [isOpen, mode, focusedArea, panelId, onClose])\n\n  // Slide-out animation for overlay mode: keep the sheet mounted for one\n  // animation cycle after isOpen flips false so it can animate out (mirroring\n  // the left sidebar) instead of vanishing. Docked/main/popout unmount at once.\n  //\n  // The open→closed flip is detected during render (render-phase derived\n  // state), NOT in an effect: an effect only runs after the closed render has\n  // committed, which unmounts the sheet and its full-screen backdrop for a\n  // frame and then remounts them to animate out — a visible screen flicker.\n  // Flipping the flag mid-render keeps the sheet continuously mounted from\n  // the open state straight into the exit animation.\n  const [isExiting, setIsExiting] = useState(false)\n  const prevOpenRef = useRef(isOpen)\n  if (prevOpenRef.current !== isOpen) {\n    prevOpenRef.current = isOpen\n    setIsExiting(!isOpen && mode === 'overlay')\n  }\n  useEffect(() => {\n    if (!isExiting) return\n    const timeout = setTimeout(() => setIsExiting(false), 200)\n    return () => clearTimeout(timeout)\n  }, [isExiting])\n\n  if (!isOpen && !isExiting) return null\n\n  // Mode switcher element — shared across all modes, can be injected into children\n  const modeSwitcher = (\n    <PanelModeSwitcher\n      mode={mode}\n      onModeChange={setPanelMode}\n      onClose={onClose}\n      disablePopout={disablePopout}\n      closeTestId={closeTestId}\n    />\n  )\n\n  const panelElement = (\n    <FloatingPanelView\n      panelId={panelId}\n      mode={mode}\n      title={title}\n      subtitle={subtitle}\n      modeSwitcher={modeSwitcher}\n      onPanelClick={mode === 'popout' ? undefined : handlePanelFocus}\n    >\n      {children}\n    </FloatingPanelView>\n  )\n\n  // All placements (docked / overlay / main / popout) render through PanelPortal\n  // so it stays mounted across mode switches — switching to popout from any mode\n  // then reuses the one popup-window lifecycle instead of mounting a fresh portal.\n  return (\n    <PanelPortal\n      defaultWidth={defaultWidth}\n      panelId={panelId}\n      mode={mode}\n      isOpen={isOpen}\n      isExiting={isExiting}\n      onClose={onClose}\n      onPopupClosed={handlePopupClosed}\n      popoutTitle={popoutTitle(title)}\n    >\n      {panelElement}\n    </PanelPortal>\n  )\n}\n"]}