dsh-zen-remote 1.1.13 → 1.1.14

package/scripts/check-upload-endpoint.mjs

@@ -1,17 +1,24 @@
-// Integration check for the S7 upload route (src/index.ts handleUpload).
+// Integration check for the S7 upload route (lib/index.js handleUpload).
 //
 // Drives the real handler over a real node:http socket with a fake sessions
 // service and a throwaway workspace, so the accept/reject decisions and the
 // bytes that reach disk are the ones the phone would produce. No harness, no
 // session, no message: writing a file into a workspace is not a prompt.
 //
-// Run: node scripts/check-upload-endpoint.mjs   (needs Node >= 23.6 type stripping)
+// Imports the BUILT lib/index.js rather than src/index.ts: since the host
+// source became multi-file (src/share-export.js import), strip-only type
+// stripping can no longer load the source graph — relative specifiers need
+// their .js extension for the runtime, and nothing rewrites them back to .ts.
+// lib/ is the committed build artifact, the same one check-client-externals
+// reads, so run pnpm build first when editing src/.
+//
+// Run: node scripts/check-upload-endpoint.mjs
 import assert from 'node:assert/strict'
 import { createServer } from 'node:http'
 import { mkdtemp, mkdir, readFile, readdir, rm, symlink, writeFile } from 'node:fs/promises'
 import { tmpdir } from 'node:os'
 import { join } from 'node:path'
-import { UPLOAD_DIR, handleUpload, safeUploadName, sameOriginPost } from '../src/index.ts'
+import { UPLOAD_DIR, handleUpload, safeUploadName, sameOriginPost } from '../lib/index.js'
 
 const MAX_BYTES = 4096
 

package/src/client/MobileAttachButton.tsx

@@ -5,6 +5,7 @@ import { IconPaperclipOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { SessionId } from './compat/types.ts'
 import { NS } from './locales.ts'
 import { draftWithMention, rememberThumbnail, uploadUrl } from './attach-upload.ts'
+import { useOwnAttachUi } from './host-attach.ts'
 
 /** Full props for the composer attachment seat. */
 export type MobileAttachButtonProps =
@@ -40,6 +41,13 @@ async function uploadFile(sessionId: SessionId, file: File): Promise<string> {
  * the CLIENT's picker — no `accept` attribute on purpose, so iOS offers the
  * full 相册 / 拍照 / 选取文件 sheet rather than one of them.
  *
+ * DSH 0.1.5 gave the official tool row its own paperclip (the host attachment
+ * flow), which made TWO identical controls on a phone. This button now stands
+ * down entirely while the host ships its own picker (`host-attach.ts` probes
+ * for it) — the official flow uploads into `~/.dsh/attachments` and renders
+ * its own rail, so the composer keeps exactly one attach affordance. On a
+ * host without one (DSH ≤ 0.1.2) everything below loads exactly as before.
+ *
  * Every picked file takes the SAME path: upload to the node half, then append
  * `@.dsh-uploads/name` to the draft through `inputActions.setDraft` (the
  * official write path — no DOM value poking). S7.1 removed the split that used
@@ -55,6 +63,7 @@ export function MobileAttachButton({ t, sessionId, useInput, inputActions }: Mob
   const [busy, setBusy] = useState(false)
   const [error, setError] = useState<string | null>(null)
   const draft = useInput((state) => state.draft)
+  const ownUi = useOwnAttachUi()
   // Uploads are awaited, so the `draft` captured at pick time goes stale — the
   // user can keep typing while a file is in flight. The ref is refreshed on
   // every render (useInput re-renders us on each draft change), so the loop
@@ -62,6 +71,10 @@ export function MobileAttachButton({ t, sessionId, useInput, inputActions }: Mob
   const liveDraft = useRef(draft)
   liveDraft.current = draft
 
+  // The host's own attach button owns this seat now — render nothing (the
+  // hidden picker input goes with it). All hooks stay above this line.
+  if (!ownUi) return null
+
   const pick = async (event: ChangeEvent<HTMLInputElement>) => {
     const files = Array.from(event.target.files ?? [])
     // Reset first: picking the same file twice in a row fires no change event

package/src/client/MobileAttachChips.tsx

@@ -10,6 +10,7 @@ import {
   releaseThumbnailsExcept,
   thumbnailFor,
 } from './attach-upload.ts'
+import { useOwnAttachUi } from './host-attach.ts'
 
 /** Full props for the attachment preview row. */
 export type MobileAttachChipsProps =
@@ -44,12 +45,18 @@ export type MobileAttachChipsProps =
  */
 export function MobileAttachChips({ t, useInput, inputActions }: MobileAttachChipsProps) {
   const draft = useInput((state) => state.draft)
-  const attachments = mentionsIn(draft)
+  const ownUi = useOwnAttachUi()
 
   useEffect(() => {
     releaseThumbnailsExcept(mentionsIn(draft))
   }, [draft])
 
+  // Same gate as MobileAttachButton (host-attach.ts): where the host ships
+  // its own attachment flow, our chips row stands down too — the official
+  // rail owns the preview seat. The effect above still runs, so object URLs
+  // from OUR flow get revoked even after the switch.
+  if (!ownUi) return null
+  const attachments = mentionsIn(draft)
   if (attachments.length === 0) return null
 
   return (

package/src/client/MobileSessionHeader.tsx

@@ -275,16 +275,86 @@ export type MobileHeaderUtilitiesProps =
   & PropsRuntime<'conversation.session.header.utilities'>
   & PropsLocale<typeof NS>
 
+/**
+ * Where the header's sidebar button routes. Three ways, resolved at runtime
+ * (user decision 2026-09-11, after DSH 0.1.5 grew an official right sidebar):
+ *
+ * - `'better'` — dsh-better-sidebar is installed: the original design, the
+ *   button clicks the plugin's own (CSS-hidden) toggle.
+ * - `'official'` — no better-sidebar but the host ships the right sidebar:
+ *   the button drives the official controls instead.
+ * - `null` — neither: the button does not render at all.
+ *
+ * In every case the OTHER sidebar buttons (the official corner ExpandButton,
+ * better-sidebar's toggle cluster) stay hidden on the phone — this button is
+ * the one visible affordance. Detection is by stable, non-hashed DOM
+ * markers, never by locale: better-sidebar's root mount marker, and the
+ * official rightbar's always-mounted panel (`data-sidebar-right-panel`; its
+ * corner ExpandButton unmounts while expanded, so the PANEL is the probe).
+ */
+type SidebarTarget = 'better' | 'official' | null
+
+const BETTER_ROOT = '[data-dsh-better-sidebar]'
+const BETTER_TOGGLE = '[data-dsh-better-sidebar] button[class$="_toggleButton"]'
+const OFFICIAL_PANEL = '[data-sidebar-right-panel]'
+const OFFICIAL_EXPAND = '[data-sidebar-right-expand]'
+const OFFICIAL_COLLAPSE = '[data-sidebar-right-toggle]'
+
+/** Synchronous read of which sidebar backend this host offers. */
+function readSidebarTarget(): SidebarTarget {
+  if (document.querySelector(BETTER_ROOT) !== null) return 'better'
+  if (document.querySelector(OFFICIAL_PANEL) !== null) return 'official'
+  return null
+}
+
+/**
+ * Toggle whichever sidebar `target` names, by clicking the official/plugin
+ * control through its stable marker. The official pair is open-only in the
+ * corner (`ExpandButton` unmounts once shown) and close-only inside the
+ * panel (`data-sidebar-right-toggle` rides the panel's own strip), so the
+ * open state is read off the panel's `data-sidebar-right-open` attribute and
+ * the matching control is clicked. Synthetic `.click()` fires both React
+ * handlers through `display: none` (the tablist precedent this plugin
+ * already relies on for the view switch).
+ */
+function toggleSidebarTarget(target: SidebarTarget): void {
+  if (target === 'better') {
+    document.querySelector<HTMLButtonElement>(BETTER_TOGGLE)?.click()
+    return
+  }
+  if (target === 'official') {
+    const shown = document.querySelector(`${OFFICIAL_PANEL}[data-sidebar-right-open]`) !== null
+    const control = shown
+      ? document.querySelector<HTMLButtonElement>(OFFICIAL_COLLAPSE)
+      : document.querySelector<HTMLButtonElement>(OFFICIAL_EXPAND)
+    control?.click()
+  }
+}
+
+/** Live mirror of {@link readSidebarTarget} — same observer pattern as the
+ * old workbench presence gate it replaces (plugins load after us; the right
+ * panel mounts with the frame). */
+function useSidebarTarget(): SidebarTarget {
+  const [target, setTarget] = useState<SidebarTarget>(readSidebarTarget)
+  useEffect(() => {
+    const check = (): void => setTarget(readSidebarTarget())
+    const observer = new MutationObserver(check)
+    observer.observe(document.body, { childList: true, subtree: true })
+    check()
+    return () => observer.disconnect()
+  }, [])
+  return target
+}
+
 /**
  * Session header, right lane: the session-info entry (S4 owns the actual
- * sheet — this fires a hook event for it to pick up) and the workbench
- * entry, which triggers dsh-better-sidebar's own toggle. There is no public
- * API for "open the panel" (BetterSidebarService.openTab only auto-expands
- * for a content open, not a bare type-only open), so this clicks the
- * plugin's real toggle button through a stable, non-hashed anchor: its root
- * mount marker `[data-dsh-better-sidebar]` plus the `_toggleButton` class
- * suffix (verified live: 2026-08-17). Safe no-op when the plugin, or any
- * other workbench-style plugin sharing that convention, is not installed.
+ * sheet — this fires a hook event for it to pick up) and the sidebar entry.
+ * The sidebar button routes per {@link SidebarTarget}: better-sidebar's own
+ * toggle (no public "open the panel" API — BetterSidebarService.openTab only
+ * auto-expands for a content open, not a bare type-only open, so it clicks
+ * the plugin's real toggle through its root marker `[data-dsh-better-
+ * sidebar]` plus the `_toggleButton` class suffix, verified live 2026-08-17),
+ * the official right sidebar's controls, or nothing when neither exists.
  */
 export function MobileHeaderUtilities({ t }: MobileHeaderUtilitiesProps) {
   // Better-sidebar phone close button (S3.1 follow-up, 2026-08-17): the
@@ -338,22 +408,13 @@ export function MobileHeaderUtilities({ t }: MobileHeaderUtilitiesProps) {
     }
   }, [t])
 
-  // Presence gate (2026-08-17 user question): without dsh-better-sidebar
-  // installed the workbench button was a dead control — rendered, clickable,
-  // did nothing. Same live-probe pattern as the home chips: observe until the
-  // plugin's root marker exists, hide the button while it doesn't. The close
-  // pill never had this problem (its CSS :has() gate needs the panel node).
-  const [workbenchPresent, setWorkbenchPresent] = useState(
-    () => document.querySelector('[data-dsh-better-sidebar]') !== null,
-  )
-  useEffect(() => {
-    const check = () =>
-      setWorkbenchPresent(document.querySelector('[data-dsh-better-sidebar]') !== null)
-    const observer = new MutationObserver(check)
-    observer.observe(document.body, { childList: true, subtree: true })
-    check()
-    return () => observer.disconnect()
-  }, [])
+  // Sidebar routing (2026-09-11): better-sidebar installed → its toggle (the
+  // original design); else the official right sidebar (DSH 0.1.5+); else the
+  // button stays hidden — it used to be a dead control without the plugin
+  // (2026-08-17 user question), and the same must hold for a host with no
+  // right sidebar either. The close pill above keeps its own better-sidebar
+  // CSS :has() gate, unchanged.
+  const sidebar = useSidebarTarget()
 
   return (
     <>
@@ -366,14 +427,13 @@ export function MobileHeaderUtilities({ t }: MobileHeaderUtilitiesProps) {
       >
         <IconInfoOutline16 size={20} />
       </button>
-      {workbenchPresent && <button
+      {sidebar !== null && <button
         type="button"
         data-mobile-nav="header-workbench"
-        aria-label={t('workbench')}
-        title={t('workbench')}
-        onClick={() => {
-          document.querySelector<HTMLButtonElement>('[data-dsh-better-sidebar] button[class$="_toggleButton"]')?.click()
-        }}
+        data-sidebar-target={sidebar}
+        aria-label={t(sidebar === 'better' ? 'workbench' : 'sidebar')}
+        title={t(sidebar === 'better' ? 'workbench' : 'sidebar')}
+        onClick={() => { toggleSidebarTarget(sidebar) }}
       >
         {/* No IconPanelRightOutline16 in primitives (grepped lib/types/
             icons/index.d.ts, 2026-08-17) — mirrored via CSS (styles/

package/src/client/MobileSessionInfo.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
 import {
   IconArchiveOutline20,
@@ -6,6 +6,7 @@ import {
   IconCloseOutline16,
   IconDownloadOutline16,
   IconEditOutline16,
+  IconShareOutline16,
 } from '@deepseek-ai/dsh-client-ui-primitives'
 import { workspaceTitleOf } from './compat/store.ts'
 import { agentPresetOf } from './compat/types.ts'
@@ -13,9 +14,24 @@ import type { RenameResult, SessionId } from './compat/types.ts'
 import { NS } from './locales.ts'
 import { GO_HOME_EVENT, SESSION_INFO_EVENT } from './nav-store.ts'
 import { hasLayer, popLayer, pushLayer } from './history-nav.ts'
+import { fetchShareExport, ShareFetchError } from './share/fetch-share.ts'
+import type { ShareExportData, ShareRange } from './share/fetch-share.ts'
+import { deliverShareImage, deliverShareImages } from './share/share-flow.ts'
+import { stitchSliceBlobs, supportsPngStitch } from './share/png-stitch.ts'
+import { rasterizeShareCard, ShareRasterizeError } from './share/rasterize.ts'
+import { ShareCard } from './share/share-card.tsx'
+import type { ShareCardCopy } from './share/share-card.tsx'
+import { ShareRangeSheet } from './share/share-sheet.tsx'
+import type { SharePreset } from './share/share-sheet.tsx'
 
 /** Layer id for the info sheet, so Android back closes it before leaving the session. */
 const INFO_LAYER = 'session-info'
+/**
+ * Layer id for the share-range sheet. Pushed ON TOP of the info layer's own
+ * entry, so one back gesture closes exactly the picker — never both layers
+ * at once (the one-direction rule in history-nav.ts).
+ */
+const SHARE_LAYER = 'session-info-share'
 import { useViewTabs } from './MobileSessionHeader.tsx'
 
 // Type-only: pulls the 'sessionStats' / 'tokenUsage' SessionProjectionMap
@@ -121,10 +137,19 @@ export function MobileSessionInfo({
   const [open, setOpen] = useState(false)
   const [busy, setBusy] = useState(false)
   const [error, setError] = useState<string | null>(null)
+  // Degraded-outcome notice (review 07+08): the multi-file delivery SUCCEEDED,
+  // so "操作失败：…" would lie — this row says what the user actually got,
+  // without the error template. Rendered in its own row (below), never through
+  // setError.
+  const [notice, setNotice] = useState<string | null>(null)
+  const [shareOpen, setShareOpen] = useState(false)
+  const [shareData, setShareData] = useState<ShareExportData | null>(null)
+  const shareCardHostRef = useRef<HTMLDivElement>(null)
 
   useEffect(() => {
     const onOpen = (): void => {
       setError(null)
+      setNotice(null)
       setOpen(true)
       // Stack a history entry on top of the session's: Android back now
       // closes this sheet first and only then leaves the session.
@@ -141,6 +166,108 @@ export function MobileSessionInfo({
   const stats = useProjection('sessionStats')
   const usage = useProjection('tokenUsage')
 
+  /* ---- share-image flow (ticket 05) --------------------------------------
+   * The range sheet renders INSIDE this info layer's DOM — a DIRECT child of
+   * the layer, a sibling of the info card, never inside the card itself (a
+   * card-internal mount clipped the mask to the card's box, anchored the
+   * sheet's bottom to the card's scrollable area, and let outside taps fall
+   * through to the info mask, closing both layers at once and stranding
+   * SHARE_LAYER as a dead history entry; review 2026-09-10): info.css.ts's
+   * ≥768px display:none covers it (this feature adds no page CSS), and the
+   * info layer's own z:70 header promotion carries it. Its history entry
+   * sits above INFO_LAYER's, so back closes the picker alone. These helpers
+   * live before the `if (!open) return null` below because the pipeline
+   * effect may still be settling when the sheet unmounts. */
+
+  // Rewind rather than flip the flag — same one-direction rule as `close`.
+  const closeShare = (): void => {
+    if (hasLayer(SHARE_LAYER)) popLayer(SHARE_LAYER)
+    else setShareOpen(false)
+  }
+
+  // Errors land on the info sheet's existing error row (ticket 05); the
+  // share sheet closes first so the row is not hidden behind its mask.
+  const shareErrorMessage = (err: unknown): string => {
+    if (err instanceof ShareFetchError) {
+      switch (err.code) {
+        case 'route-missing': return t('shareErrRouteMissing')
+        case 'session-not-found': return t('shareErrSessionNotFound')
+        case 'bad-request': return t('shareErrBadRequest')
+        case 'network': return t('shareErrNetwork')
+        case 'server': return t('shareErrServer')
+        case 'bad-body': return t('shareErrBody')
+      }
+    }
+    if (err instanceof ShareRasterizeError) {
+      if (err.code === 'probe-failed') return t('shareErrProbe')
+      if (err.code === 'slice-over-budget') return t('shareErrSliceBudget')
+      return t('shareErrRender')
+    }
+    return err instanceof Error ? err.message : String(err)
+  }
+
+  const shareFailed = (err: unknown): void => {
+    setBusy(false)
+    setShareData(null)
+    closeShare()
+    setError(shareErrorMessage(err))
+  }
+
+  // Pipeline stage two. Stage one (onShareConfirm below) fetches and commits
+  // the data, which renders the hidden ShareCard; this effect then runs
+  // AFTER that commit, when the card element exists. The state → render →
+  // effect gap is the React-idiomatic bridge over "DOM ready" without
+  // react-dom (not in the client externals whitelist). Ticket 07: when the
+  // browser can stitch (CompressionStream), the slices are planned with the
+  // unified global width/ratio and concatenated into ONE PNG before delivery;
+  // a runtime stitch failure falls back to the legacy per-slice multi-file
+  // delivery, and either degraded form lands on the notice row below (never
+  // the error row — the delivery itself succeeded, review 07+08).
+  useEffect(() => {
+    if (shareData === null) return
+    const card = shareCardHostRef.current?.querySelector<HTMLElement>('[data-share-card]') ?? null
+    if (card === null) {
+      shareFailed(new Error(t('shareErrRender')))
+      return
+    }
+    const stitch = supportsPngStitch()
+    rasterizeShareCard(card, {
+      pixelRatioCap: Math.min(window.devicePixelRatio || 1, 2),
+      truncatedNote: (droppedTurns) => t('shareTruncatedNote', { count: droppedTurns }),
+      unified: stitch,
+    })
+      .then(async (result): Promise<string | null> => {
+        const title = row?.displayTitle ?? ''
+        if (stitch && result.stitchWidth !== undefined) {
+          try {
+            const png = await stitchSliceBlobs(result.slices, result.stitchWidth)
+            await deliverShareImage(png, title)
+            return null
+          } catch (err) {
+            // Runtime stitch failure (a slice decoded at the wrong size, a
+            // compressor error, …) — the rasterized slices are finished PNGs
+            // either way, so deliver them multi-file instead of failing the
+            // whole export. The original error stays on the console for
+            // diagnosis; the notice row tells the user what they got (no
+            // "操作失败" prefix — the delivery succeeded, review 07+08).
+            console.error('[dsh-zen-remote] share-image: stitch failed — delivering the painted slices as multiple images instead', err)
+            await deliverShareImages(result.slices, title)
+            return t('shareStitchFailed')
+          }
+        }
+        await deliverShareImages(result.slices, title)
+        return t('shareStitchUnsupported')
+      })
+      .then((degraded) => {
+        setBusy(false)
+        setShareData(null)
+        closeShare()
+        setNotice(degraded)
+      })
+      .catch(shareFailed)
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- shareData is the trigger; helpers only touch setters and module functions.
+  }, [shareData])
+
   if (!open) return null
 
   // Rewind rather than flip the flag — see the one-direction rule in
@@ -196,10 +323,51 @@ export function MobileSessionInfo({
     void downloadSessionLog(sessionId)
   }
 
+  const onShare = (): void => {
+    setError(null)
+    setNotice(null)
+    setShareData(null)
+    setShareOpen(true)
+    pushLayer({ id: SHARE_LAYER, close: () => setShareOpen(false) })
+  }
+
+  // Pipeline stage one: fetch the selected range. Stage two (rasterize +
+  // deliver) lives in the shareData effect above — the hidden card must be
+  // committed to the DOM before the rasterizer can clone it.
+  const onShareConfirm = (choice: SharePreset): void => {
+    const range: ShareRange = choice === 'all' ? { kind: 'all' } : { kind: 'last', turns: choice }
+    setBusy(true)
+    setError(null)
+    // Session id straight off the useSessions row (its branded
+    // session-<uuid> form — a bare uuid 404s, PLAN §2), slot prop as backup.
+    fetchShareExport(row?.id ?? sessionId, range)
+      .then((data) => {
+        if (data.turns.length === 0) throw new Error(t('shareErrEmpty'))
+        setShareData(data)
+      })
+      .catch(shareFailed)
+  }
+
   const cacheHit = usage === undefined ? null : cacheHitPercent(usage)
   const tokensEmpty = usage === undefined || (billedInputTokens(usage) === 0 && usage.outputTokens === 0)
   const cwd = row?.cwd === undefined || row.cwd === '' ? undefined : workspaceTitleOf(row.cwd)
   const preset = agentPresetOf(row)
+  // Known-empty sessions (stats observed, zero turns) disable the share
+  // button outright; unknown-stats sessions stay enabled and let the fetch's
+  // empty-turns guard speak. Known 口径 gap, accepted for v1: the projection
+  // counts a turn only once one of its steps has CLOSED (the fold increments
+  // on step/end — dsh-session-stats projection.js), so a session whose only
+  // content is a still-streaming turn, or user messages with no assistant
+  // step yet, also reads turns === 0 and is over-disabled here. Wrong
+  // direction but fail-safe: the button is merely greyed (no misleading
+  // error), and every session that passes through still meets the fetch-side
+  // empty-turns guard (shareErrEmpty below), which is exact.
+  const shareEmpty = stats !== undefined && stats.turns === 0
+  const shareCardCopy: ShareCardCopy = {
+    turnsLabel: (count: number) => t('shareCardTurns', { count }),
+    generatedBy: t('shareCardGeneratedBy'),
+    image: t('shareCardImage'),
+  }
 
   const cells: Array<{ label: string; value: string; sub: string | undefined }> = [
     { label: t('infoStatTurns'), value: stats === undefined ? NA : String(stats.turns), sub: undefined },
@@ -304,6 +472,28 @@ export function MobileSessionInfo({
         </div>
 
         {error !== null && <div data-mobile-nav="info-error">{t('infoActionError', { message: error })}</div>}
+        {/* Degraded-outcome notice (review 07+08): same container metrics as
+            the error row, but informational colors and no prefix template —
+            the export itself succeeded, only the single-long-image form did
+            not. Inline-styled (this feature adds no page CSS); role="status"
+            so assistive tech announces it as a polite status, not an alert. */}
+        {notice !== null && (
+          <div
+            data-mobile-nav="info-notice"
+            role="status"
+            style={{
+              marginBottom: 8,
+              padding: '8px 10px',
+              borderRadius: 10,
+              background: 'var(--dsw-alias-interactive-bg-hover, rgba(0, 0, 0, .06))',
+              color: 'var(--dsw-alias-label-secondary, rgba(0, 0, 0, .6))',
+              fontSize: 12,
+              lineHeight: 1.4,
+            }}
+          >
+            {notice}
+          </div>
+        )}
 
         <div data-mobile-nav="info-actions">
           <button type="button" data-mobile-nav="info-action" disabled={busy} onClick={onExport}>
@@ -328,8 +518,51 @@ export function MobileSessionInfo({
             <IconArchiveOutline20 size={20} />
             <span>{t('infoArchive')}</span>
           </button>
+          <button
+            type="button"
+            data-mobile-nav="info-action"
+            disabled={busy || shareEmpty}
+            onClick={onShare}
+          >
+            <IconShareOutline16 size={16} />
+            <span>{t('shareAction')}</span>
+          </button>
         </div>
+
+        {/* Offscreen render host for the share card (ticket 05). The
+            rasterizer clones this tree into its own shadow-root sandbox, so
+            the card never has to be visible — only attached. position:fixed
+            offscreen keeps it laid out but unpainted, and the info layer's
+            ≥768px display:none keeps the desktop clean. */}
+        {shareData !== null && (
+          <div
+            ref={shareCardHostRef}
+            aria-hidden="true"
+            style={{ position: 'fixed', left: '-9999px', top: 0, pointerEvents: 'none' }}
+          >
+            <ShareCard
+              title={row?.displayTitle ?? t('sessionInfo')}
+              {...(preset !== undefined ? { subtitle: preset } : {})}
+              {...(shareData.createdAt !== undefined ? { createdAt: shareData.createdAt } : {})}
+              turns={shareData.turns}
+              copy={shareCardCopy}
+            />
+          </div>
+        )}
       </div>
+
+      {/* Share-range picker (ticket 05): a DIRECT child of the info layer —
+          sibling of the card, never inside it. With the fixed layer as the
+          containing block, the picker's own absolute inset:0 overlay is a
+          fullscreen mask that sits above the info mask and the card: a tap
+          outside the card reaches IT (popLayer(SHARE_LAYER)) and closes only
+          the picker, never both layers at once; the sheet bottom anchors to
+          the viewport's safe area (not the card's box, no double count) and
+          stays put when the card scrolls. Its own history entry means a back
+          gesture, likewise, closes it alone. */}
+      {shareOpen && (
+        <ShareRangeSheet busy={busy} onConfirm={onShareConfirm} onClose={closeShare} t={t} />
+      )}
     </div>
   )
 }

package/src/client/effects/keyboard-avoid.ts

@@ -210,11 +210,18 @@ export function installKeyboardAvoid(ctx: ClientContext): void {
       pad = safetyPad(navigator.userAgent, tuning.safetyPadPx)
     })
 
-    const composerTextarea = (node: unknown): boolean =>
-      node instanceof HTMLElement && node.tagName === 'TEXTAREA' && node.closest(COMPOSER) !== null
+    /** The composer's editing host: the `data-composer-input` contenteditable
+     * DSH 0.1.5 binds Lexical to, or the textarea of older hosts (the
+     * attribute sat on that textarea too). Same recognition as S9's guard —
+     * while this checked TEXTAREA only, the whole focus machinery below was
+     * blind to the 0.1.5 contenteditable and the dumb-keyboard estimate
+     * never ran. */
+    const composerField = (node: unknown): boolean =>
+      node instanceof HTMLElement && node.closest(COMPOSER) !== null
+        && (node.hasAttribute('data-composer-input') || node.tagName === 'TEXTAREA')
 
     const sync = (): void => {
-      const focused = composerTextarea(document.activeElement)
+      const focused = composerField(document.activeElement)
       if (!focused) baseline = viewport.height
       const geometric = keyboardLift({
         innerHeight: window.innerHeight,
@@ -256,7 +263,7 @@ export function installKeyboardAvoid(ctx: ClientContext): void {
         sync()
       }
       const el = document.activeElement
-      if (composerTextarea(el) && el instanceof HTMLElement) el.blur()
+      if (composerField(el) && el instanceof HTMLElement) el.blur()
     }
     /** True when a touch outside the composer means "the reader moved on". */
     const outside = (target: EventTarget | null): boolean =>
@@ -276,7 +283,7 @@ export function installKeyboardAvoid(ctx: ClientContext): void {
       if (outside(event.target)) retract()
     }
     const onFocusIn = (event: FocusEvent): void => {
-      if (!composerTextarea(event.target)) return
+      if (!composerField(event.target)) return
       // Focus not born from a touch (hardware keyboard, programmatic) raises
       // no on-screen keyboard — never estimate for it.
       if (Date.now() - lastTouch > 1000) return
@@ -315,7 +322,7 @@ export function installKeyboardAvoid(ctx: ClientContext): void {
         // Keyboard is up (touch focus on a phone) yet the viewport never
         // reacted: the browser cannot see it. Estimate until blur, and
         // remember the verdict so the next focus skips the wait.
-        if (!composerTextarea(document.activeElement)) return
+        if (!composerField(document.activeElement)) return
         localStorage.setItem(DUMB_KEY, '1')
         estimate = estimatedLift(window.innerHeight, tuning)
         sync()
@@ -323,7 +330,7 @@ export function installKeyboardAvoid(ctx: ClientContext): void {
       probeTimer = window.setTimeout(step, PROBE_INTERVAL_MS)
     }
     const onFocusOut = (event: FocusEvent): void => {
-      if (!composerTextarea(event.target)) return
+      if (!composerField(event.target)) return
       stopProbe()
       if (estimate === 0) return
       estimate = 0