dsh-pocket-relay 1.0.0

package/client/mobile/LICENSE.dsh-web-mobile

@@ -0,0 +1,4 @@
+Mobile adaptation source adapted from dsh-web-mobile
+https://github.com/mexiaosqwq/dsh-web-mobile
+Copyright (c) mexiaosqwq
+MIT License — see https://github.com/mexiaosqwq/dsh-web-mobile/blob/main/LICENSE

package/client/mobile/MobileDrawerFooter.tsx

@@ -0,0 +1,56 @@
+import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+import { IconDownloadOutline16, IconPanelLeftOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
+import { NS } from './locales.ts'
+
+/** Full props for the sidebar footer action entry. */
+export interface MobileDrawerFooterProps extends PropsRuntime<'sidebar.footer.action'>, PropsLocale<typeof NS> {
+  /** Bound ctx.sessionLogDownload.download() for the current session. */
+  downloadSessionLog: (sessionId: string) => void
+  /** Bound ctx.layout.toggleSidebar(): the Files sheet closes the drawer. */
+  toggleSidebar: () => void
+}
+
+/**
+ * Mobile-only drawer footer actions, relocated from the session header to the
+ * drawer footer (beside Settings):
+ * - Files: opens the dsh-web-ui aionui explorer as a floating bottom sheet
+ *   (the explorer column is hidden on mobile until this marker is set, so
+ *   the suite's own persisted-expanded state can never cover the UI on load).
+ * - Session log: the official session-log-export controller, so the
+ *   progress/result dialog is shared with the desktop flow.
+ * Hidden entirely on wide screens (CSS media query).
+ */
+export function MobileDrawerFooter({ useSessions, downloadSessionLog, toggleSidebar, t }: MobileDrawerFooterProps) {
+  const sessionId = useSessions((state) => state.current)
+  const openExplorer = (): void => {
+    document.querySelector('[data-mobile-nav="frame"]')?.setAttribute('data-aionui-explorer-open', '')
+    toggleSidebar()
+  }
+  return (
+    <div data-mobile-nav="drawer-actions">
+      <button
+        type="button"
+        data-mobile-nav="explorer"
+        aria-label={t('files')}
+        title={t('files')}
+        onClick={openExplorer}
+      >
+        <IconPanelLeftOutline16 size={14} />
+        <span>{t('files')}</span>
+      </button>
+      <button
+        type="button"
+        data-mobile-nav="session-log"
+        aria-label={t('sessionLog')}
+        title={t('sessionLog')}
+        disabled={sessionId === undefined}
+        onClick={() => {
+          if (sessionId !== undefined) downloadSessionLog(sessionId)
+        }}
+      >
+        <IconDownloadOutline16 size={14} />
+        <span>{t('sessionLog')}</span>
+      </button>
+    </div>
+  )
+}

package/client/mobile/MobileNavOverlay.tsx

@@ -0,0 +1,290 @@
+import { useEffect, useLayoutEffect, useState } from 'react'
+import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+import { IconPanelLeftOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
+import { NS } from './locales.ts'
+import {
+  DRAWER_SELECTOR,
+  TOGGLE_SELECTOR,
+  isOverlayTap,
+  navTargetFor,
+} from './nav-targets.mjs'
+
+/** Full props for the shell overlay entry. */
+export interface MobileNavOverlayProps extends PropsRuntime<'shell.overlay'>, PropsLocale<typeof NS> {
+  /** Bound ctx.layout.toggleSidebar(). */
+  toggleSidebar: () => void
+}
+
+/** Same breakpoint as the shell's SIDEBAR_AUTO_COLLAPSE (viewport < 1024). */
+const MOBILE_QUERY = '(max-width: 1023px)'
+
+/** Live matchMedia hook for the narrow breakpoint. */
+function useMobile(): boolean {
+  const [mobile, setMobile] = useState(() => window.matchMedia(MOBILE_QUERY).matches)
+  useEffect(() => {
+    const query = window.matchMedia(MOBILE_QUERY)
+    const onChange = (event: MediaQueryListEvent) => setMobile(event.matches)
+    query.addEventListener('change', onChange)
+    return () => query.removeEventListener('change', onChange)
+  }, [])
+  return mobile
+}
+
+/** The AppFrame element: direct parent of the shell overlay layer. */
+function findFrame(): HTMLElement | null {
+  return document.querySelector('[data-shell-overlay]')?.parentElement ?? null
+}
+
+/**
+ * Mobile shell overlay: owns the `data-mobile-nav` marker on the AppFrame
+ * element (the CSS restructure keys off it), mirrors the frame's collapsed
+ * state into React state, and renders the dimmed backdrop plus a floating
+ * directory button for the hero/blank phases that have no session header.
+ */
+export function MobileNavOverlay({ toggleSidebar, t }: MobileNavOverlayProps) {
+  const mobile = useMobile()
+  const [open, setOpen] = useState(false)
+  const [fabVisible, setFabVisible] = useState(false)
+
+  // Frame ownership + open-state mirror. On wide screens this effect is inert:
+  // the marker is never set, so the layout is untouched.
+  useLayoutEffect(() => {
+    if (!mobile) {
+      setOpen(false)
+      return
+    }
+    const frame = findFrame()
+    if (frame === null) return
+    frame.setAttribute('data-mobile-nav', 'frame')
+    const sync = () => setOpen(!frame.hasAttribute('data-sidebar-collapsed'))
+    sync()
+    const observer = new MutationObserver(sync)
+    observer.observe(frame, { attributes: true, attributeFilter: ['data-sidebar-collapsed'] })
+    return () => {
+      observer.disconnect()
+      frame.removeAttribute('data-mobile-nav')
+    }
+  }, [mobile])
+
+  // The floating button is a fallback for surfaces without a session header:
+  // phase "active" means the header (and its toggle) is rendered already.
+  useEffect(() => {
+    if (!mobile) {
+      setFabVisible(false)
+      return
+    }
+    const sync = () => setFabVisible(document.querySelector('[data-phase="active"]') === null)
+    sync()
+    const observer = new MutationObserver(sync)
+    // childList: the conversation root can be replaced wholesale on session
+    // switches, so attribute-only observation would miss the new phase.
+    observer.observe(document.documentElement, {
+      subtree: true,
+      childList: true,
+      attributes: true,
+      attributeFilter: ['data-phase'],
+    })
+    return () => observer.disconnect()
+  }, [mobile])
+
+  // Escape closes the drawer — but yields to an open modal dialog (e.g. the
+  // settings panel), which owns its own Escape handling.
+  useEffect(() => {
+    if (!mobile || !open) return
+    const onKeyDown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape' && document.querySelector('[aria-modal="true"]') === null) toggleSidebar()
+    }
+    // Capture phase: run before the settings panel's own document-bubble Escape
+    // handler, so the modal is still present when we yield to it.
+    document.addEventListener('keydown', onKeyDown, true)
+    return () => document.removeEventListener('keydown', onKeyDown, true)
+  }, [mobile, open, toggleSidebar])
+
+  // Navigation inside the drawer closes it: tapping a session row or a
+  // plugin takeover entry (task board / ssh) must hand the screen to the
+  // content it just opened. Mouse clicks keep the direct close path. Touch
+  // session rows close only after aria-selected changes, so live session
+  // updates cannot strand a delayed click on a detached DOM target.
+  //
+  // Deliberately NOT closed by this rule:
+  // - Settings / Session log: their dialogs render INSIDE the drawer DOM
+  //   (portaled into the sidebar); closing the drawer would slide the dialog
+  //   off-screen with it.
+  // - Workspace folder rows (YDXeBa_projectRow), the logo: pure UI toggles,
+  //   not navigation — see NAV_TARGETS in nav-targets.mjs.
+  // - Anything while a modal dialog is open: the dialog owns the screen.
+  useEffect(() => {
+    if (!mobile || !open) return
+    let lastTouchNavAt = 0
+    let lastTouchX = 0
+    let lastTouchY = 0
+    let suppressTouchClickUntil = 0
+    let pendingTouchRow: Element | null = null
+    let selectedRowAtArm: Element | null = null
+    let navClickArrived = false
+    let navObserver: MutationObserver | null = null
+    let navTimer: number | null = null
+
+    const drawerRoot = (): HTMLElement | null =>
+      document.querySelector<HTMLElement>(DRAWER_SELECTOR)
+
+    const disarmNav = (): void => {
+      navObserver?.disconnect()
+      navObserver = null
+      if (navTimer !== null) window.clearTimeout(navTimer)
+      navTimer = null
+      pendingTouchRow = null
+      selectedRowAtArm = null
+      navClickArrived = false
+    }
+
+    const armNav = (row: Element): void => {
+      disarmNav()
+      pendingTouchRow = row
+      const drawer = drawerRoot()
+      selectedRowAtArm = drawer?.querySelector('[role="treeitem"][aria-selected="true"]') ?? null
+      if (drawer === null) return
+      navObserver = new MutationObserver(() => {
+        const frame = document.querySelector('[data-mobile-nav="frame"]')
+        if (frame === null || frame.hasAttribute('data-sidebar-collapsed')) {
+          disarmNav()
+          return
+        }
+        const selectedRow = drawerRoot()?.querySelector('[role="treeitem"][aria-selected="true"]') ?? null
+        if (navClickArrived && selectedRow !== null && selectedRow !== selectedRowAtArm) {
+          disarmNav()
+          toggleSidebar()
+        }
+      })
+      navObserver.observe(drawer, {
+        childList: true,
+        subtree: true,
+        attributes: true,
+        attributeFilter: ['aria-selected'],
+      })
+      navTimer = window.setTimeout(disarmNav, 2000)
+    }
+
+    const navigationTarget = (target: EventTarget | null): Element | null => {
+      if (document.querySelector('[aria-modal="true"]') !== null) return null
+      const frame = document.querySelector('[data-mobile-nav="frame"]')
+      if (frame === null || frame.hasAttribute('data-sidebar-collapsed')) return null
+      if (!(target instanceof Element)) return null
+      const drawer = drawerRoot()
+      if (drawer === null || !drawer.contains(target)) return null
+      return navTargetFor(target)
+    }
+
+    const isPendingTouchClick = (event: MouseEvent): boolean => {
+      const capabilities = (event as MouseEvent & {
+        sourceCapabilities?: { firesTouchEvents?: boolean }
+      }).sourceCapabilities
+      if (capabilities?.firesTouchEvents === true) return true
+      return Math.hypot(event.clientX - lastTouchX, event.clientY - lastTouchY) <= 24
+    }
+
+    const onDrawerClick = (event: MouseEvent): void => {
+      // A touch row tap owns the close through the selection observer. Let the
+      // browser click reach React without a capture-phase close racing it.
+      if (performance.now() < suppressTouchClickUntil) return
+      if (
+        pendingTouchRow !== null
+        && performance.now() - lastTouchNavAt < 500
+        && isPendingTouchClick(event)
+      ) {
+        const target = navigationTarget(event.target)
+        const row = target?.closest('[role="treeitem"]')
+        if (row !== null && row !== undefined) {
+          pendingTouchRow = row
+          navClickArrived = true
+          return
+        }
+      }
+      if (navigationTarget(event.target) !== null) toggleSidebar()
+    }
+
+    const onDrawerPointerUp = (event: PointerEvent): void => {
+      if (event.pointerType !== 'touch' && event.pointerType !== 'pen') return
+      const target = navigationTarget(event.target)
+      if (target === null) return
+
+      const row = target.closest('[role="treeitem"]')
+      if (row !== null) {
+        if (row.getAttribute('aria-selected') === 'true') {
+          // Already-selected rows will not navigate; closing now is safe.
+          suppressTouchClickUntil = performance.now() + 500
+          toggleSidebar()
+        } else {
+          // Let React navigate first, then close on the selection mutation.
+          lastTouchNavAt = performance.now()
+          lastTouchX = event.clientX
+          lastTouchY = event.clientY
+          armNav(row)
+        }
+        return
+      }
+
+      // Non-row targets keep their existing click path; only host
+      // session/search rows participate in the selected-state hand-off.
+    }
+
+    document.addEventListener('click', onDrawerClick, true)
+    document.addEventListener('pointerup', onDrawerPointerUp, true)
+    return () => {
+      disarmNav()
+      document.removeEventListener('click', onDrawerClick, true)
+      document.removeEventListener('pointerup', onDrawerPointerUp, true)
+    }
+  }, [mobile, open, toggleSidebar])
+
+  // Tap-outside closes the drawer (issue #38). The backdrop is now
+  // pointer-events: none (pure dimming layer that never steals clicks), so
+  // "tap the dimmed area to close" moves here: any click outside the drawer
+  // (and outside the header toggle) closes it, keeping the standard
+  // interaction while letting drawer contents receive clicks normally.
+  // Capture phase: the close happens before the content processes the tap
+  // (same first-tap-closes behaviour as before).
+  useEffect(() => {
+    if (!mobile || !open) return
+    const onOutsideClick = (event: MouseEvent) => {
+      if (document.querySelector('[aria-modal="true"]') !== null) return
+      const target = event.target as HTMLElement | null
+      if (target === null) return
+      if (target.closest(TOGGLE_SELECTOR) !== null) return
+      // Portaled overlays (issue #72): the workspace section's "视图选项" /
+      // "添加工作区" and the session row kebab all open menus that live on
+      // document.body — outside the drawer DOM. Without this exemption the
+      // first tap on a menu item is eaten: the drawer slides away, the menu
+      // unmounts with the sidebar, and the item's onClick never runs, so
+      // every workspace control reads as "点了没反应" on a phone.
+      if (isOverlayTap(target)) return
+      const frame = document.querySelector('[data-mobile-nav="frame"]')
+      if (frame === null || frame.hasAttribute('data-sidebar-collapsed')) return
+      const drawer = document.querySelector<HTMLElement>(DRAWER_SELECTOR)
+      if (drawer !== null && drawer.contains(target)) return
+      toggleSidebar()
+    }
+    document.addEventListener('click', onOutsideClick, true)
+    return () => document.removeEventListener('click', onOutsideClick, true)
+  }, [mobile, open, toggleSidebar])
+
+  if (!mobile) return null
+  return (
+    <>
+      {open && (
+        <div data-mobile-nav="backdrop" />
+      )}
+      {fabVisible && !open && (
+        <button
+          type="button"
+          data-mobile-nav="fab"
+          aria-label={t('open')}
+          title={t('open')}
+          onClick={() => toggleSidebar()}
+        >
+          <IconPanelLeftOutline16 size={18} />
+        </button>
+      )}
+    </>
+  )
+}

package/client/mobile/MobileNavToggle.tsx

@@ -0,0 +1,52 @@
+import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+import { IconFolderOpenOutline16, IconPanelLeftOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
+import { NS } from './locales.ts'
+
+/** Full props for the session-header directory toggle. */
+export interface MobileNavToggleProps extends PropsRuntime<'conversation.session.header.actions'>, PropsLocale<typeof NS> {
+  /** Bound ctx.layout.toggleSidebar(). */
+  toggleSidebar: () => void
+}
+
+/**
+ * Mobile-only icon buttons next to the session title:
+ * - toggle: opens the directory drawer on narrow screens.
+ * - files: toggles the dsh-web-ui explorer sheet directly — one tap opens,
+ *   a second tap closes it, no drawer round-trip. (The drawer footer keeps
+ *   a Files entry for the hero/blank phases where this header does not
+ *   exist.)
+ * Hidden entirely on wide screens (CSS media query).
+ */
+export function MobileNavToggle({ toggleSidebar, t }: MobileNavToggleProps) {
+  const toggleExplorer = (): void => {
+    const frame = document.querySelector('[data-mobile-nav="frame"]')
+    if (frame === null) return
+    if (frame.hasAttribute('data-aionui-explorer-open')) {
+      frame.removeAttribute('data-aionui-explorer-open')
+    } else {
+      frame.setAttribute('data-aionui-explorer-open', '')
+    }
+  }
+  return (
+    <>
+      <button
+        type="button"
+        data-mobile-nav="toggle"
+        aria-label={t('open')}
+        title={t('open')}
+        onClick={() => toggleSidebar()}
+      >
+        <IconPanelLeftOutline16 size={16} />
+      </button>
+      <button
+        type="button"
+        data-mobile-nav="files"
+        aria-label={t('files')}
+        title={t('files')}
+        onClick={toggleExplorer}
+      >
+        <IconFolderOpenOutline16 size={16} />
+      </button>
+    </>
+  )
+}

package/client/mobile/fileGuard.ts

@@ -0,0 +1,200 @@
+// 移动端文件守卫（issue #17）：dsh-web 在手机上点「文件链接」会触发桌面端
+// workspaces.openPath(open <path>)，既打不开（文件在电脑上），又会抛
+// "path open failed". 这里做两件事：
+//   1) 捕获阶段拦截这类激活（点击 / 键盘），改为弹一个提示；
+//   2) 在每个文件链接旁注入一个「复制」按钮，点它经主机 RPC 读文件正文再写剪贴板。
+// 另外隐藏「添加工作区」入口（手机上配工作区无意义）。
+// 移植自 dsh-web-mobile（MIT）。
+//
+// 识别方式：不依赖 dsh-web 的 hash 类名（每次构建都变），只认「文本像文件路径的
+// <button>/<a>」——文件链接按钮的文案就是路径（如 lib/proxy.mjs / /Users/.../x.ts）。
+
+/** 手机上点击文件时弹出的提示。 */
+const GUARD_MSG = '手机上无法直接打开电脑上的文件'
+/** 「添加工作区」入口的文案（随语言变化），两种都覆盖。 */
+const WS_LABELS = ['添加工作区', '添加工作区…', 'Add workspace', 'Add workspace…']
+/** 复制按钮文案。 */
+const COPY_LABEL = '复制'
+
+/** 主机 fileRead 回调返回结构（与 client/api.js 的 FileReadResult 对齐）。 */
+interface ReadFileResponse {
+  ok: boolean;
+  value?: { content: string; path: string; size: number };
+  error?: { message: string };
+}
+
+/** 文本是否像文件路径：绝对路径 / 相对路径 / 带扩展名的目录路径。 */
+function looksLikeFilePath(text: string | null): boolean {
+  const t = (text ?? '').trim()
+  if (t.length < 3 || t.length > 320) return false
+  if (/^(\/|~\/|\.\.?\/|[A-Za-z]:\\)/.test(t)) return true
+  if (/\/[\w.\-]+\.\w{1,12}$/.test(t)) return true
+  if (/[\w.\-]+\/[\w.\-]+\.\w{1,12}/.test(t)) return true
+  return false
+}
+
+/** 写剪贴板：优先 navigator.clipboard，非安全上下文（局域网 http）回退 execCommand。 */
+async function copyText(text: string): Promise<boolean> {
+  try {
+    if (navigator.clipboard?.writeText) {
+      await navigator.clipboard.writeText(text)
+      return true
+    }
+  } catch { /* 回退 */ }
+  try {
+    const ta = document.createElement('textarea')
+    ta.value = text
+    ta.style.position = 'fixed'
+    ta.style.top = '-9999px'
+    ta.style.opacity = '0'
+    document.body.appendChild(ta)
+    ta.focus()
+    ta.select()
+    const okCopy = document.execCommand('copy')
+    ta.remove()
+    return okCopy
+  } catch {
+    return false
+  }
+}
+
+export function startFileGuard(
+  readFile: (path: string) => Promise<ReadFileResponse>,
+): () => void {
+  // 轻量 toast：自包含，不依赖 dsh-pocket 面板的 React 状态。
+  let toastEl: HTMLElement | null = null
+  let toastTimer: number | null = null
+  const showToast = (text: string): void => {
+    if (toastEl === null) {
+      toastEl = document.createElement('div')
+      toastEl.setAttribute('data-mobile-nav', 'file-guard-toast')
+      Object.assign(toastEl.style, {
+        position: 'fixed',
+        left: '50%',
+        bottom: '64px',
+        transform: 'translateX(-50%)',
+        maxWidth: '84vw',
+        zIndex: '9999',
+        padding: '10px 14px',
+        borderRadius: '10px',
+        background: 'rgba(20,22,28,.92)',
+        color: '#fff',
+        fontSize: '13px',
+        lineHeight: '1.4',
+        textAlign: 'center',
+        fontFamily: 'inherit',
+        boxShadow: '0 4px 16px rgba(0,0,0,.28)',
+        pointerEvents: 'none',
+        opacity: '0',
+        transition: 'opacity .18s ease',
+      } as CSSStyleDeclaration)
+      document.body.appendChild(toastEl)
+    }
+    toastEl.textContent = text
+    requestAnimationFrame(() => {
+      if (toastEl !== null) toastEl.style.opacity = '1'
+    })
+    if (toastTimer !== null) window.clearTimeout(toastTimer)
+    toastTimer = window.setTimeout(() => {
+      if (toastEl !== null) toastEl.style.opacity = '0'
+    }, 2600)
+  }
+
+  // 捕获阶段拦截文件链接的激活。按钮的键盘激活（Enter/Space）会派发 click，
+  // 因此只拦 click 即可同时覆盖鼠标与键盘，避免重复处理。
+  const onClick = (event: MouseEvent): void => {
+    const target = event.target as HTMLElement | null
+    if (target === null) return
+    const el = target.closest('button, a') as HTMLElement | null
+    if (el === null) return
+    if (!looksLikeFilePath(el.textContent)) return
+    event.preventDefault()
+    event.stopImmediatePropagation()
+    showToast(GUARD_MSG)
+  }
+  document.addEventListener('click', onClick, true)
+
+  // 在文件链接旁注入「复制」按钮：点它经主机 RPC 读文件正文再写剪贴板。
+  // 用 data-mobile-nav-copy 标记已处理的链接，避免重复注入；React 重渲染会
+  // 产生新元素（无标记），MutationObserver 重新补上按钮。
+  const injectCopyButtons = (): void => {
+    const links = document.querySelectorAll('button, a')
+    links.forEach((el) => {
+      if (el.getAttribute('data-mobile-nav-copy') === '1') return
+      const txt = (el.textContent ?? '').trim()
+      if (!looksLikeFilePath(txt)) return
+      el.setAttribute('data-mobile-nav-copy', '1')
+      const btn = document.createElement('button')
+      btn.type = 'button'
+      btn.setAttribute('data-mobile-nav', 'copy-file')
+      btn.textContent = COPY_LABEL
+      btn.addEventListener('click', async (e) => {
+        e.preventDefault()
+        e.stopPropagation()
+        const filePath = (el.textContent ?? '').trim()
+        btn.disabled = true
+        btn.textContent = '…'
+        try {
+          const res = await readFile(filePath)
+          if (!res?.ok) {
+            showToast(res?.error?.message ?? '复制失败')
+            return
+          }
+          const content = res.value?.content ?? ''
+          const copied = await copyText(content)
+          if (copied) {
+            const kb = Math.max(1, Math.round((res.value?.size ?? content.length) / 1024))
+            showToast(`已复制文件内容（${kb} KB）`)
+          } else {
+            showToast('复制失败，请手动选择')
+          }
+        } catch (err) {
+          showToast(err instanceof Error ? err.message : '复制失败')
+        } finally {
+          btn.disabled = false
+          btn.textContent = COPY_LABEL
+        }
+      })
+      el.parentElement?.insertBefore(btn, el.nextSibling)
+    })
+  }
+  injectCopyButtons()
+  const copyObserver = new MutationObserver(() => injectCopyButtons())
+  copyObserver.observe(document.body, { childList: true, subtree: true })
+
+  // 隐藏「添加工作区」入口：图标按钮由 mobile.css.ts 按 aria-label 隐藏；
+  // 下拉菜单里的文本项 CSS 选不到，这里按文案兜底（只在新增节点时检查，省开销）。
+  const hideWsEntries = (): (() => void) => {
+    const checkOne = (node: Node): void => {
+      if (node.nodeType !== 1) return
+      const el = node as HTMLElement
+      const txt = (el.getAttribute('aria-label') ?? el.textContent ?? '').trim()
+      if (WS_LABELS.includes(txt)) {
+        el.style.display = 'none'
+        el.setAttribute('data-mobile-nav-hide', 'add-workspace')
+      }
+    }
+    const sel = '[role="menuitem"],[role="option"],li,button,a'
+    document.querySelectorAll(sel).forEach(checkOne)
+    const observer = new MutationObserver((mutations) => {
+      for (const m of mutations) {
+        m.addedNodes.forEach((n) => {
+          if (n.nodeType !== 1) return
+          checkOne(n)
+          ;(n as HTMLElement).querySelectorAll?.(sel).forEach(checkOne)
+        })
+      }
+    })
+    observer.observe(document.body, { childList: true, subtree: true })
+    return () => observer.disconnect()
+  }
+  const disconnectWs = hideWsEntries()
+
+  return () => {
+    document.removeEventListener('click', onClick, true)
+    copyObserver.disconnect()
+    disconnectWs()
+    if (toastTimer !== null) window.clearTimeout(toastTimer)
+    toastEl?.remove()
+  }
+}

package/client/mobile/layout-mode.mjs

@@ -0,0 +1,46 @@
+// 布局模式判定（issue #74：宽屏手机/Pad 可选电脑布局）
+//
+// 优先级：URL 参数 (?dsh-layout=desktop|mobile|auto) > localStorage > 默认 auto。
+//   - 'auto' 不写 localStorage，仅按 matchMedia 走；
+//   - 显式 'desktop' / 'mobile' 同步到 localStorage，下次无 URL 参数也走同样布局。
+//
+// 纯函数，便于单测；mobile-apply.tsx 读 DOM/localStorage 喂进来。
+
+/** @typedef {'mobile' | 'desktop'} ForcedLayout */
+
+/** 解析输入。 */
+export function resolveLayout({ urlValue, stored, narrowMatch }) {
+  const url = String(urlValue ?? '').trim();
+  if (url === 'desktop') return 'desktop';
+  if (url === 'mobile') return 'mobile';
+  // 'auto' / 空 / 非法值 → 用 localStorage / matchMedia
+  if (stored === 'desktop' || stored === 'mobile') return stored;
+  return narrowMatch ? 'mobile' : 'desktop';
+}
+
+/** 同步 localStorage 的副作用（在 mobileApply 入口跑一次）。返回最终存储值。 */
+export function persistLayoutFromUrl(urlValue) {
+  if (typeof localStorage === 'undefined') return '';
+  const v = String(urlValue ?? '').trim();
+  try {
+    if (v === 'desktop' || v === 'mobile') localStorage.setItem('dsh-pocket.layout', v);
+    else if (v === 'auto' || v === '') localStorage.removeItem('dsh-pocket.layout');
+  } catch { /* 隐私模式/无 storage → 静默 */ }
+  try {
+    const s = localStorage.getItem('dsh-pocket.layout');
+    return s === 'desktop' || s === 'mobile' ? s : '';
+  } catch {
+    return '';
+  }
+}
+
+/** 读 localStorage 当前的 layout 值（'desktop' | 'mobile' | ''）。 */
+export function readStoredLayout() {
+  if (typeof localStorage === 'undefined') return '';
+  try {
+    const v = localStorage.getItem('dsh-pocket.layout');
+    return v === 'desktop' || v === 'mobile' ? v : '';
+  } catch {
+    return '';
+  }
+}

package/client/mobile/locales.ts

@@ -0,0 +1,23 @@
+/** `mobileNav` namespace dictionaries: drawer controls. */
+export const NS = 'mobileNav'
+
+/** Simplified Chinese dictionary (the key-set source of truth). */
+export const zh = {
+  'open': '打开目录',
+  'close': '收起目录',
+  'backdrop': '点击关闭目录',
+  'sessionLog': '导出会话日志',
+  'files': '文件浏览',
+} as const
+
+/** English dictionary, key-identical to the Chinese source of truth. */
+export const en: Record<MobileNavKey, string> = {
+  'open': 'Open directory',
+  'close': 'Close directory',
+  'backdrop': 'Click to close directory',
+  'sessionLog': 'Session log',
+  'files': 'Files',
+}
+
+/** Key domain of the `mobileNav` namespace (zh is the source of truth). */
+export type MobileNavKey = keyof typeof zh