docs(web): the composer bar is one session-maybe slot, not a swapped pair

fix(web): keep one composer bar DOM across the no-workspace transition The composer.bar slot moves from session to session-maybe scope: with no current session the entry still mounts, the machine faces (keyboard, stop, command) arrive undefined, and the bar renders its normal DOM inert via the disabled owner prop. DisabledInputBar and its parallel tree are gone, so the textarea node survives the cold-start workspace pick instead of flashing through a remount. A blank session whose workspace was deleted takes the same inert path through owner props. test(web): add the composer DOM-continuity acceptance probe Drives a real dsh web server with headless chromium through the cold-start -> pick-workspace -> type flow and asserts the composer textarea is the same DOM node throughout (a marker property must survive). Rerun prerequisites are in the header comment. docs(web): session-maybe identity is adoption, not hold-forever fix(web): session-maybe entries adopt the first session, then remount like strict entries A session-maybe entry used to keep one React instance across every transition, so component-local state leaked between sessions once the composer bar moved to that scope (PermissionSelect's optimistic pick, the IME composition guard). Identity is now adoption: an incarnation born session-less holds through the arrival of the first session (the blank shell's DOM survives the workspace pick), and afterwards behaves exactly like a strict session entry — a switch or a drop to no-session remounts, clearing local state by construction. The child key is an incarnation counter kept in the stable outlet wrapper via render-phase setState. chore: knip knows the root acceptance probe's playwright dependency scripts/hero-composer-dom-continuity.mjs resolves playwright through apps/web's devDependency tree (createRequire), which knip cannot follow; ignore it at the root workspace.
2026-07-29 21:06:27 +08:00
parent ecd07abdc0
commit 6ea1238714
20 changed files with 346 additions and 115 deletions
--- a/packages/client/ui-conversation/README.i18n.yaml
+++ b/packages/client/ui-conversation/README.i18n.yaml
@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-conversation/README.md
-README.md: 3973c14f2b8fe746549bb74af85a7a60a7d66aea
-README.zh.md: a6bb15c4cdd53d05bf28147b97d9d64d1c59da2b
+README.md: 06fd6b963639390164582e70476b6a80f189bc61
+README.zh.md: 41047d563f5541aaddc87bc7b448f678538ef91a
--- a/packages/client/ui-conversation/README.md
+++ b/packages/client/ui-conversation/README.md
@@ -20,7 +20,7 @@ The todo surfaces are two registrations over that shape, both plain registrant p

 Per-session UI state for selection and the active view lives in the declared chat store (`stores.ts` `createChatStore`); the InputHub owns the composer state machine and mirrors its draft into that store for persistence. Apply passes one store handle to the strict session subtree, chat view, and details registrations, so each session shares one instance and the framework owns its lifecycle. Components are pure: the framework standard kit supplies `useSession`/`sessionId`, global `useSessions`/`useWorkspaces`, and the input machine's `useInput`/`inputActions`; store faces and inject factories supply the remaining state and callbacks.

-The composer bar declares session-scoped single seats for `'conversation.input.plan'` (right of the local access-mode control) and `'conversation.input.model'` (immediately before the pending indicator and send/stop button), plus list slots for overlay, dock, left, and right input extensions. Feature packages own each control and its state; ui-conversation supplies placement, the `locked` owner prop, and the standard slot shares. While the `plan` projection's effective target is plan mode, InputBar swaps its textarea placeholder to the plan-task wording, localized through the `command.hint` locale namespace this package registers and shared verbatim with the claimed `/plan` command hint (a host-folded value read through the standard-kit `useProjection`; owner-supplied placeholders win). A pending composer takeover remains mounted when another conversation view is active so the blocked agent can still receive its answer; without a pending interaction, the active-session composer belongs to Chat. The resident no-session shell uses `DisabledInputBar` and therefore dispatches no session-scoped control seats.
+The composer bar declares session-scoped single seats for `'conversation.input.plan'` (right of the local access-mode control) and `'conversation.input.model'` (immediately before the pending indicator and send/stop button), plus list slots for overlay, dock, left, and right input extensions. Feature packages own each control and its state; ui-conversation supplies placement, the `locked` owner prop, and the standard slot shares. While the `plan` projection's effective target is plan mode, InputBar swaps its textarea placeholder to the plan-task wording, localized through the `command.hint` locale namespace this package registers and shared verbatim with the claimed `/plan` command hint (a host-folded value read through the standard-kit `useProjection`; owner-supplied placeholders win). A pending composer takeover remains mounted when another conversation view is active so the blocked agent can still receive its answer; without a pending interaction, the active-session composer belongs to Chat. The composer-bar slot itself is `session-maybe`: with no current session the same bar renders inert (machine faces absent, `disabled` owner prop) instead of swapping in a parallel disabled tree, so the textarea DOM survives the workspace pick; the strict-session control seats simply stay empty until a session exists.

 `src/client/` is organized for the future package split: `contract/` is the sole inter-domain shared face (`slots.ts` slot declarations + composed slot props including the tool-row contract, `views.ts` shared primitives, `tool-call-model.ts`); the `skeleton/`, `chat/`, and `toolviews/` (sample registrants) domain directories import contract files and never each other; `apply.ts` is the only assembly point allowed to import all three domains. The `/client` export surface is the contract only — `apply`/`inject`, the two service classes, and the `contract/` type families; implementation components (skeleton, chat rows) and the store factory stay internal and reach the page exclusively through apply's slot registrations (tests take them via the `./src/*` subpath).

--- a/packages/client/ui-conversation/README.zh.md
+++ b/packages/client/ui-conversation/README.zh.md
@@ -20,7 +20,7 @@ todo 两个面就是在该形状上的两个注册项，都是普通注册方插

 逐 Session UI 状态中的选择与活跃视图位于已声明的聊天 store（`stores.ts` `createChatStore`）中；InputHub 拥有输入区状态机，并将草稿镜像到该 store 以便持久化。apply 将同一个 store handle 传给严格限定于会话的子树、聊天视图和详情注册，因此每个会话内共享一个实例，框架拥有其生命周期。组件保持纯粹：框架标准工具包提供 `useSession`／`sessionId`、全局 `useSessions`／`useWorkspaces`，以及输入状态机的 `useInput`／`inputActions`；store 表层与 inject factory 提供其余状态和回调。

-输入栏为 `'conversation.input.plan'`（位于本地 access 模式控件右侧）和 `'conversation.input.model'`（渲染在 pending 指示器与发送／停止按钮之前）声明会话作用域的单实例 seat，并为 overlay、dock、left 和 right 输入扩展声明列表 slot。各功能包拥有相应控件及其状态；ui-conversation 提供放置位置、`locked` owner prop 和标准 slot share。当 `plan` 投影的有效目标为 plan mode 时，InputBar 将文本框 placeholder 切换为 plan 任务措辞，经本包注册的 `command.hint` locale 命名空间本地化，并与已认领 `/plan` 命令的提示逐字共用同一份文案（经标准套件 `useProjection` 读取的 host 折叠值；owner 提供的 placeholder 优先）。另一个会话视图活跃时，待处理的 composer 接管仍保持挂载，使被阻塞的 agent（智能体）仍能收到回答；没有待处理交互时，活跃会话的 composer 归 Chat 所有。常驻无会话壳使用 `DisabledInputBar`，因此不会分发任何会话作用域的控件 seat。
+输入栏为 `'conversation.input.plan'`（位于本地 access 模式控件右侧）和 `'conversation.input.model'`（渲染在 pending 指示器与发送／停止按钮之前）声明会话作用域的单实例 seat，并为 overlay、dock、left 和 right 输入扩展声明列表 slot。各功能包拥有相应控件及其状态；ui-conversation 提供放置位置、`locked` owner prop 和标准 slot share。当 `plan` 投影的有效目标为 plan mode 时，InputBar 将文本框 placeholder 切换为 plan 任务措辞，经本包注册的 `command.hint` locale 命名空间本地化，并与已认领 `/plan` 命令的提示逐字共用同一份文案（经标准套件 `useProjection` 读取的 host 折叠值；owner 提供的 placeholder 优先）。另一个会话视图活跃时，待处理的 composer 接管仍保持挂载，使被阻塞的 agent（智能体）仍能收到回答；没有待处理交互时，活跃会话的 composer 归 Chat 所有。composer bar 坑位本身为 `session-maybe`：没有当前会话时，同一个 bar 以惰性态渲染（machine face 缺席、`disabled` owner prop），而不是换入一棵平行的 disabled 树，因此 textarea DOM 在选定 workspace 的切换中得以存活；严格会话作用域的控件 seat 在会话存在之前保持为空。

 `src/client/` 按未来的包拆分组织：`contract/` 是唯一的跨领域共享表层（`slots.ts` slot 声明 + 组合后的 slot props，包括工具行契约、`views.ts` 共享原语、`tool-call-model.ts`）；`skeleton/`、`chat/` 和 `toolviews/`（示例注册方）领域目录只导入 contract 文件，彼此绝不导入；`apply.ts` 是唯一允许导入全部三个领域的组装点。`/client` 导出表层只包含契约：`apply`／`inject`、两个服务类和 `contract/` 类型家族；实现组件（骨架、聊天行）与 store factory 保持内部状态，只能通过 apply 的 slot 注册到达页面（测试通过 `./src/*` 子路径获取它们）。

--- a/packages/client/ui-conversation/src/client/apply.ts
+++ b/packages/client/ui-conversation/src/client/apply.ts
@@ -10,6 +10,7 @@ import type {
  ApprovalWait, ChatViewInjected, ComposerBarInjected, ComposerChainProps, ConversationInjected,
  ConversationSessionInjected, DetailsInjected,
 } from './contract/slots.ts'
+import type { InputNotice } from './input/contract.ts'
 import { resolveToolPath } from './contract/tool-call-model.ts'
 import { createChatStore } from './stores.ts'
 import { ConversationService } from './service.ts'
@@ -31,6 +32,19 @@ import { DetailsPanel } from './skeleton/DetailsPanel.tsx'
 /** Services required by the conversation plugin. */
 export const inject = ['slots', 'layout', 'sessions', 'workspaces', 'locale']

+// Static no-session sources for the composer-bar hooks compartment: module
+// constants so the render side's per-source hook cache (observableHook) keeps
+// one identity across every no-session render.
+const ABSENT_NOTICES = {
+  getSnapshot: (): InputNotice | null => null,
+  subscribe: () => () => {},
+}
+const EMPTY_LEXICON: ReadonlyMap<'/' | '@', readonly string[]> = new Map()
+const ABSENT_LEXICON = {
+  getSnapshot: () => EMPTY_LEXICON,
+  subscribe: () => () => {},
+}
+
 /** Resolve the session-scoped conversation face (scope-addressed send/cancel), failing loud. */
 function scopedConversation(sessions: ISessions, id: SessionId): IConversation {
  const scoped = sessions.scope(id)
@@ -121,7 +135,7 @@ export function apply(ctx: Context): void {
    children: {
      'conversation.session': { kind: 'single', scope: 'session' },
      'conversation.composer': { kind: 'chain', scope: 'session' },
-      'conversation.composer.bar': { kind: 'single', scope: 'session' },
+      'conversation.composer.bar': { kind: 'single', scope: 'session-maybe' },
      'conversation.input.overlay': { kind: 'list', scope: 'session' },
      'conversation.input.dock': { kind: 'list', scope: 'session' },
      'conversation.composer.dock': { kind: 'list', scope: 'session' },
@@ -166,6 +180,9 @@ export function apply(ctx: Context): void {
  // chain's fallback (decision 20). Public machine surface arrives via the
  // provide channel above; the keyboard command face and the stop/retry
  // verbs ride this inject (package-internal — hub and bar are one plugin).
+  // Session-maybe: with no current session the machine faces are absent and
+  // the hooks compartment binds static empty sources (module constants, so
+  // observableHook caching and hook order stay stable across transitions).
  slots.register({
    name: 'conversation.composer.bar',
    // The two named control seats in the bar's tool row (plan beside the
@@ -175,7 +192,16 @@ export function apply(ctx: Context): void {
      'conversation.input.plan': { kind: 'single', scope: 'session' },
      'conversation.input.model': { kind: 'single', scope: 'session' },
    },
-    inject: (sessionId: SessionId): ComposerBarInjected => {
+    inject: (sessionId: SessionId | undefined): ComposerBarInjected => {
+      if (sessionId === undefined) {
+        return {
+          keyboard: undefined,
+          stop: undefined,
+          command: undefined,
+          translateHint,
+          hooks: { notices: ABSENT_NOTICES, lexicon: ABSENT_LEXICON },
+        }
+      }
      const shell = inputHub.shell(sessionId)
      return {
        keyboard: shell,
--- a/packages/client/ui-conversation/src/client/contract/slots.ts
+++ b/packages/client/ui-conversation/src/client/contract/slots.ts
@@ -77,11 +77,15 @@ declare module '@deepseek-ai/dsh-client-ui-slots' {
     * The default composer body: a single slot rendered as the composer
     * chain's fallback (decision 20 — a real entry, not a chain rider, so a
     * takeover election hides rather than unmounts it and the textarea DOM
-     * survives). InputBar registers here from this package's apply; its
-     * machine state arrives through the standard provide channel (useInput +
-     * inputActions), the keyboard command face through its own inject.
+     * survives). Session-maybe: the bar stays mounted across the
+     * no-session/session transition — the no-workspace hero renders the SAME
+     * textarea DOM disabled instead of a parallel inert tree — with the
+     * machine hooks absent until a session is current. InputBar registers
+     * here from this package's apply; its machine state arrives through the
+     * standard provide channel (useInput + inputActions), the keyboard
+     * command face through its own inject.
     */
-    'conversation.composer.bar': { kind: 'single'; scope: 'session'; owner: ComposerBarOwnerProps }
+    'conversation.composer.bar': { kind: 'single'; scope: 'session-maybe'; owner: ComposerBarOwnerProps }
    /**
     * The Plan-mode status seat in the composer tool row (left group,
     * right of the access-mode control). Declared by the composer-bar
@@ -244,6 +248,12 @@ export interface ConversationSessionInjected {
 export interface ComposerBarOwnerProps {
  /** Hero = empty-state centered card; composer = resident bottom bar. */
  variant: 'hero' | 'composer'
+  /**
+   * Inert no-workspace state: the bar renders its normal DOM fully disabled
+   * (textarea, add, send) so the workspace pick transitions in place instead
+   * of swapping component trees.
+   */
+  disabled?: boolean
  placeholder?: string
  /** Optional content rendered above the textarea. */
  accessory?: ReactNode
@@ -261,19 +271,24 @@ export interface ComposerBarOwnerProps {

 /** Injected share of the composer-bar entry (package-internal faces). */
 export interface ComposerBarInjected {
-  /** The InputBar-exclusive keyboard/DOM command face (decision 20 private plane). */
-  keyboard: ComposerKeyboard
-  /** Cancel the in-flight turn. */
-  stop: () => void
+  /** The InputBar-exclusive keyboard/DOM command face (decision 20 private plane); absent with the session. */
+  keyboard: ComposerKeyboard | undefined
+  /** Cancel the in-flight turn; absent with the session. */
+  stop: (() => void) | undefined
  /**
   * Submit one slash-command line against this session's agent (the chrome
-   * controls' write path — the permission chip submits `/permission <preset>`).
+   * controls' write path — the permission chip submits `/permission <preset>`);
+   * absent with the session.
   * Resolves admission: false = rejected/unmatched/transport failure.
   */
-  command: (line: string) => Promise<boolean>
-  /** Locale-aware hint translator for claimed command placeholders. */
+  command: ((line: string) => Promise<boolean>) | undefined
+  /** Locale-aware hint translator for claimed command placeholders (session-independent — always present). */
  translateHint: (key: string) => string
-  /** Registrant hooks compartment: the renderer binds these to useNotices/useLexicon. */
+  /**
+   * Registrant hooks compartment: the renderer binds these to
+   * useNotices/useLexicon (static absent sources without a session — hook
+   * order stays constant).
+   */
  hooks: {
    /** Latest surfaced notice (null after none; seq keys re-render of repeats). */
    notices: ObservableSnapshot<InputNotice | null>
--- a/packages/client/ui-conversation/src/client/skeleton/ConversationRoot.tsx
+++ b/packages/client/ui-conversation/src/client/skeleton/ConversationRoot.tsx
@@ -1,13 +1,12 @@
-// Resident conversation skeleton. Hero chrome, composer positioning, and the
-// chain stay mounted across no-session/session transitions. Only the inert
-// input body swaps for the strict session InputBar.
+// Resident conversation skeleton. Hero chrome, composer positioning, the
+// chain, AND the composer bar (session-maybe slot) stay mounted across
+// no-session/session transitions — the bar renders inert via owner props.

 import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react'
 import clsx from 'clsx'
 import type { WorkspaceId } from '@deepseek-ai/dsh-client-runtime/client'
 import type { ConversationSlotProps, InputZone } from '../contract/slots.ts'
 import { HeroGlow, HeroShell, WorkspaceChip, workspaceLabel } from './EmptyHero.tsx'
-import { DisabledInputBar } from './DisabledInputBar.tsx'
 import css from './ConversationRoot.module.css'

 /** Full props composed from the slot contract. */
@@ -113,20 +112,23 @@ export function ConversationRoot({
  )

  // The placeholder chip ("Choose workspace") and the inert input travel
-  // together: a blank session whose workspace vanished (deleted from the
-  // sidebar) reverts to the same disabled bar as the initial no-session state.
-  const inputBar = sessionId === undefined || (hero && chipTitle === undefined)
-    ? <DisabledInputBar />
-    : renderSlot('conversation.composer.bar', {
-      variant: hero ? 'hero' : 'composer',
-      ...(hero ? { placeholder: 'Describe what you want to build' } : {}),
-      overlay: renderSlot('conversation.input.overlay', {}),
-      leftItems: zone === undefined ? null : renderSlot('conversation.input.left', zone),
-      rightItems: zone === undefined ? null : renderSlot('conversation.input.right', zone),
-      // Stats band under the card, inside the bar's width column so both
-      // share one constraint (composer.dock = stats-line family).
-      footer: !hero && zone !== undefined ? renderSlot('conversation.composer.dock', zone) : null,
-    })
+  // together: no workspace picked yet (cold start, no session at all), or a
+  // blank session whose workspace vanished (deleted from the sidebar). The
+  // bar is ONE session-maybe slot rendered unconditionally — inert is a prop,
+  // not a different tree, so the textarea DOM survives the transition.
+  const inert = sessionId === undefined || (hero && chipTitle === undefined)
+  const inputBar = renderSlot('conversation.composer.bar', {
+    variant: hero ? 'hero' : 'composer',
+    ...(inert
+      ? { disabled: true, placeholder: 'Choose a workspace to start' }
+      : hero ? { placeholder: 'Describe what you want to build' } : {}),
+    overlay: renderSlot('conversation.input.overlay', {}),
+    leftItems: zone === undefined ? null : renderSlot('conversation.input.left', zone),
+    rightItems: zone === undefined ? null : renderSlot('conversation.input.right', zone),
+    // Stats band under the card, inside the bar's width column so both
+    // share one constraint (composer.dock = stats-line family).
+    footer: !hero && zone !== undefined ? renderSlot('conversation.composer.dock', zone) : null,
+  })

  const composerBar = (
    <div className={clsx(css.composerStack, hero && css.composerHero)}>
--- a/packages/client/ui-conversation/src/client/skeleton/DisabledInputBar.tsx
+++ b/packages/client/ui-conversation/src/client/skeleton/DisabledInputBar.tsx
@@ -1,40 +0,0 @@
-/** Inert no-session input body; the resident Hero shell renders around it. */
-
-import clsx from 'clsx'
-import { IconPlusOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
-import css from './InputBar.module.css'
-
-/** Disabled visual twin of the session-bound InputBar. */
-export function DisabledInputBar() {
-  return (
-    <div className={clsx(css.root, css.hero)}>
-      <div className={css.card}>
-        <div className={css.grow}>
-          <textarea
-            className={css.input}
-            value=""
-            disabled
-            placeholder="Choose a workspace to start"
-            rows={2}
-            readOnly
-          />
-          <div aria-hidden className={css.mirror}>{'\n'}</div>
-        </div>
-        <div className={css.row}>
-          <div className={css.tools}>
-            <button type="button" className={css.add} aria-label="Add attachment" disabled>
-              <IconPlusOutline16 size={14} />
-            </button>
-          </div>
-          <div className={css.trailing}>
-            <button type="button" className={css.primary} aria-label="Send message" disabled>
-              <svg viewBox="0 0 16 16" width="16" height="16" aria-hidden>
-                <path d="M8.3125 0.980183C8.66767 1.0531 8.97902 1.20418 9.2627 1.43233C9.48724 1.61297 9.73029 1.85793 9.97949 2.10714L14.707 6.83468L13.293 8.24874L9 3.95577V15.0417H7V3.95577L2.70703 8.24874L1.29297 6.83468L6.02051 2.10714C6.26971 1.85793 6.51277 1.61297 6.7373 1.43233C6.97662 1.23986 7.28445 1.04402 7.6875 0.980183C7.8973 0.947006 8.1031 0.95516 8.3125 0.980183Z" fill="currentColor" />
-              </svg>
-            </button>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
--- a/packages/client/ui-conversation/src/client/skeleton/InputBar.tsx
+++ b/packages/client/ui-conversation/src/client/skeleton/InputBar.tsx
@@ -17,9 +17,13 @@ import type {} from '@deepseek-ai/dsh-plan-mode/client'
 import type {} from '@deepseek-ai/dsh-goal/client'
 import type { ComposerBarProps } from '../contract/slots.ts'
 import { deriveDecorations } from '../input/decorations.ts'
+import type { DraftDecorations } from '../input/decorations.ts'
 import { PermissionSelect } from './PermissionSelect.tsx'
 import css from './InputBar.module.css'

+/** Decoration product of the no-session state (no machine, empty draft). */
+const INERT_DECORATIONS: DraftDecorations = { token: null, chips: [], textRefs: [], hint: null }
+
 /** Prompt failure surface (derived from promptError). */
 export interface InputBarError {
  op: 'send' | 'stop'
@@ -29,15 +33,16 @@ export interface InputBarError {
 export type InputBarProps = ComposerBarProps

 export function InputBar({
-  useSession, useInput, inputActions, keyboard, stop, command, translateHint, renderSlot, useNotices, useLexicon, useProjection,
-  variant, placeholder, accessory, overlay, leftItems, rightItems, footer, onAdd, addLabel = 'Add attachment',
+  useSession, useInput, inputActions, keyboard, stop, command, translateHint, renderSlot, useNotices, useLexicon,
+  useProjection, sessionId, variant, disabled: inert = false, placeholder, accessory, overlay, leftItems, rightItems, footer,
+  onAdd, addLabel = 'Add attachment',
 }: InputBarProps) {
  const input = useInput(s => s)
  const notice = useNotices(s => s)
  const lexicon = useLexicon(s => s)
-  const promptError = useSession(s => s.promptError)
-  const running = useSession(s => s.running)
-  const disabled = useSession(s => s.removed)
+  const promptError = useSession(s => s.promptError) ?? null
+  const running = useSession(s => s.running) ?? false
+  const removed = useSession(s => s.removed) ?? false
  // Plan mode swaps the textarea placeholder (the projection is the folded
  // host value; owner-prop placeholders — hero, session-unavailable — win).
  const planActive = useProjection('plan', plan => plan !== undefined && (plan.pending ? !plan.active : plan.active))
@@ -49,7 +54,10 @@ export function InputBar({
  const error: InputBarError | null = promptError === null
    ? null
    : { op: promptError.op, message: `${promptError.error.message} (${promptError.error.code})` }
-  const draft = input.draft
+  // Session-maybe: the machine faces are absent together while no session is
+  // current; the bar renders the same DOM inert instead of a parallel tree.
+  const live = input !== undefined && keyboard !== undefined && inputActions !== undefined
+  const draft = input?.draft ?? ''
  const empty = draft.trim() === ''
  const inputRef = useRef<HTMLTextAreaElement | null>(null)
  // IME guard: composition Enter picks a candidate, it must not send. The ref outlives renders;
@@ -68,16 +76,18 @@ export function InputBar({
  // (undefined = capability absent → the chip renders nothing).
  const permissions = useProjection('permissions')

-  // Queue cut 1: running input stays free; locked = session disabled only.
-  // The transient machine locks (adjudicating pending / submitting) render
+  // Queue cut 1: running input stays free; locked = session removed, the
+  // inert no-workspace state, or the machine faces absent (no session). The
+  // transient machine locks (adjudicating pending / submitting) render
  // read-only — the draft stays visible and focused, keystrokes drop.
+  const disabled = removed || inert || !live
  const locked = disabled
-  const machineBusy = input.phase === 'adjudicating' || input.phase === 'submitting'
+  const machineBusy = input?.phase === 'adjudicating' || input?.phase === 'submitting'

  // Unlock (mount / session switch) returns focus to the box.
  useEffect(() => {
    if (!locked) inputRef.current?.focus()
-  }, [locked])
+  }, [locked, sessionId])

  // Active conversation scrollport: chain the wheel. While the textarea (capped
  // at 14 lines with overflow-y:auto) can still move in this direction, keep
@@ -101,6 +111,9 @@ export function InputBar({
  }, [])

  const onKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>): void => {
+    // Absent machine (no session): the textarea is disabled so events cannot
+    // fire; the guard narrows the faces for the paths below.
+    if (keyboard === undefined || inputActions === undefined) return
    // Shift+Enter is the native newline UNCONDITIONALLY — decided before the
    // IME guard so a composition-closing Shift+Enter still breaks the line.
    if (e.key === 'Enter' && e.shiftKey) return
@@ -162,6 +175,7 @@ export function InputBar({
  }

  const onChange = (e: ChangeEvent<HTMLTextAreaElement>): void => {
+    if (keyboard === undefined) return // absent machine: disabled textarea, no events
    if (machineBusy) return // submitting is the read-only span; adjudicating holds the pending lock
    const next = e.target.value
    keyboard.setDraft(next)
@@ -187,6 +201,7 @@ export function InputBar({
  /* oxlint-enable typescript/no-unnecessary-condition */

  const onCopyOrCut = (e: React.ClipboardEvent<HTMLTextAreaElement>, cut: boolean): void => {
+    if (input === undefined || keyboard === undefined) return // absent machine: disabled textarea, no events
    const el = e.currentTarget
    const { start, end } = selectionOf(el)
    if (start === end) return
@@ -211,6 +226,7 @@ export function InputBar({
  }

  const onPaste = (e: React.ClipboardEvent<HTMLTextAreaElement>): void => {
+    if (keyboard === undefined) return // absent machine: disabled textarea, no events
    if (machineBusy || locked) return
    const text = e.clipboardData.getData('text/plain')
    if (text === '') return
@@ -230,7 +246,7 @@ export function InputBar({
  const onSelect = (e: React.SyntheticEvent<HTMLTextAreaElement>): void => {
    // Any caret/selection gesture ends a live paste attempt (the machine
    // cannot observe DOM selection). Cheap no-op when none is live.
-    if (keyboard.snapshot.paste !== undefined) keyboard.invalidatePaste()
+    if (keyboard !== undefined && keyboard.snapshot.paste !== undefined) keyboard.invalidatePaste()
    void e
  }

@@ -242,6 +258,7 @@ export function InputBar({

  const primaryLabel = running ? 'Stop generating' : 'Send message'
  const onPrimary = (): void => {
+    if (inputActions === undefined || stop === undefined) return // absent machine: the button is disabled
    if (running) {
      stop()
      return
@@ -251,16 +268,17 @@ export function InputBar({
  }

  // The Access seat: the projection-fed permission chip (renders nothing
-  // while the permissions key is absent — permission-less host or Draft).
-  const accessSelect: ReactNode = (
-    <PermissionSelect value={permissions} locked={locked} command={command} />
-  )
+  // while the permissions key is absent — permission-less host or Draft —
+  // or while the command face is absent with the session).
+  const accessSelect: ReactNode = command === undefined
+    ? null
+    : <PermissionSelect value={permissions} locked={locked} command={command} />

  // Mirror-layer decorations: a visible backdrop with transparent text. The
  // claim token highlights through behind the textarea glyphs; each U+FFFC
  // placeholder renders as a chip (the textarea's own glyph is invisible, the
  // backdrop chip supplies the visual); the claim hint is ghost text.
-  const deco = deriveDecorations(input, lexicon)
+  const deco = input === undefined ? INERT_DECORATIONS : deriveDecorations(input, lexicon)
  const backdrop: ReactNode[] = []
  {
    // Segment boundaries: the token range end, every chip offset, and every
@@ -322,7 +340,7 @@ export function InputBar({
    pushPlain(draft.length)
    if (deco.hint !== null) {
      // Claim tokens are shaped `/name ` (trailing space); trim to the bare name.
-      const commandName = input.claim?.token.slice(1).trim() ?? ''
+      const commandName = input?.claim?.token.slice(1).trim() ?? ''
      const hintKey = commandName === 'goal' && hasGoal ? 'goal.active' : commandName
      const translated = translateHint(hintKey)
      const displayHint = translated !== hintKey ? translated : deco.hint
@@ -356,7 +374,7 @@ export function InputBar({
            value={draft}
            disabled={locked}
            readOnly={machineBusy}
-            data-phase={input.phase}
+            data-phase={input?.phase ?? 'inert'}
            placeholder={placeholder ?? (disabled
              ? 'Session unavailable'
              : planActive ? translateHint('placeholder.plan') : translateHint('placeholder.default'))}
--- a/packages/client/ui-conversation/tests/apply-inject.spec.tsx
+++ b/packages/client/ui-conversation/tests/apply-inject.spec.tsx
@@ -163,7 +163,7 @@ describe('conversation slot inject surface', () => {
    unbind()
    // Stop failure is swallowed (promptError owns the surface).
    b.sessionFake.cancel.mockResolvedValueOnce({ ok: false, error: { code: 'internal', message: 'x', details: {} } })
-    b.composerSurface(ROOT).stop()
+    b.composerSurface(ROOT).stop!()
    await new Promise(r => setTimeout(r, 0))
    expect(b.sessionFake.cancel).toHaveBeenCalledTimes(1)
    await b.runtime.dispose()
@@ -172,12 +172,19 @@ describe('conversation slot inject surface', () => {
  it('inject fails loud when the session resolves no binding or the scope lacks the service', async () => {
    const b = await bench()
    const entry = b.entryOf('conversation.composer.bar')
-    const injectFn = entry.inject as unknown as (sessionId: SessionId) => ComposerBarInjected
+    const injectFn = entry.inject as unknown as (sessionId: SessionId | undefined) => ComposerBarInjected
    // Unknown session: the keyboard face's binding resolution answers nothing.
-    expect(() => { injectFn('ghost' as SessionId).stop() }).toThrow(/resolved no binding/)
+    expect(() => { injectFn('ghost' as SessionId).stop!() }).toThrow(/resolved no binding/)
+    // No session (session-maybe absent side): machine faces absent, static
+    // hooks compartment still present so the render side's hook order holds.
+    const absent = injectFn(undefined)
+    expect(absent.keyboard).toBeUndefined()
+    expect(absent.stop).toBeUndefined()
+    expect(absent.hooks.notices.getSnapshot()).toBeNull()
+    expect(absent.hooks.lexicon.getSnapshot().size).toBe(0)
    // A scope whose service tree lost 'conversation' (the feature fiber
    // unloaded while a retained inject closure re-runs): fails loud too.
-    const stop = injectFn(ROOT).stop
+    const stop = injectFn(ROOT).stop!
    await b.feature.dispose()
    expect(() => { stop() }).toThrow(/unavailable through the session scope/)
    await b.runtime.dispose()
--- a/packages/client/web-react/src/scoped-slots.tsx
+++ b/packages/client/web-react/src/scoped-slots.tsx
@@ -2,7 +2,7 @@
 * React renderer for declarative slots. Per-entry bindings enforce child
 * authorization, and entry boundaries contain registrant failures.
 */
-import { Component, useSyncExternalStore, type FC, type ReactNode } from 'react'
+import { Component, useState, useSyncExternalStore, type FC, type ReactNode } from 'react'
 import {
  SlotOwnershipError, StaleAuthorizationError,
  type ChainRenderOpts, type HostObservable, type LocaleFace, type RenderOpts,
@@ -366,15 +366,69 @@ function SessionEntry({ entry, ownerProps, info }: {
  return <Comp {...kit} {...injected} {...ownerProps} />
 }

-function SessionMaybeEntry({ entry, ownerProps }: { entry: StoredEntry; ownerProps: object }) {
+function SessionMaybeEntryBody({ entry, ownerProps, info }: {
+  entry: StoredEntry
+  ownerProps: object
+  info: SessionMaybeProvideInfo
+}) {
  const host = useHost()
-  const info = useSessionMaybeProvideInfo()
  const Comp = entry.component as FC<InjectedProps>
  const { kit, actions } = standardKit(host, entry, 'session-maybe', info)
  const injected = cachedSessionMaybeInject(entry, info, actions)
  return <Comp {...kit} {...injected} {...ownerProps} />
 }

+/**
+ * Session-maybe identity: adoption — the ONLY behavior (there is no
+ * hold-identity-forever mode). An incarnation born session-less ADOPTS the
+ * first session that arrives: identity holds across that one transition
+ * (undefined → first id), so a blank shell's DOM survives the moment a
+ * session appears. From then on the entry behaves exactly like a strict
+ * session entry: switching to a DIFFERENT session remounts (component-local
+ * state must not leak between sessions), and dropping back to no-session
+ * remounts into a fresh blank incarnation, which will adopt again.
+ * Component-local per-session state therefore clears by construction; state
+ * that must SURVIVE a switch belongs in session-bound sources (machine,
+ * store, hooks) — the existing layering rule, now load-bearing.
+ */
+function SessionMaybeEntry({ entry, ownerProps }: { entry: StoredEntry; ownerProps: object }) {
+  const info = useSessionMaybeProvideInfo()
+  // The child key is an incarnation counter, NOT the session id: adoption
+  // must keep the key constant across undefined → first id. Bookkeeping
+  // lives in this stable (unkeyed) wrapper via the render-phase setState
+  // form (React's sanctioned derived-state pattern: setState during render
+  // of the same component re-renders once before children mount, and the
+  // guard conditions make it convergent — StrictMode-safe).
+  const [state, setState] = useState<MaybeIncarnation>(FIRST_INCARNATION)
+  let { adopted, epoch } = state
+  if (info.sessionId !== undefined && adopted === undefined) {
+    // Adoption: same epoch — no remount.
+    adopted = info.sessionId
+    setState({ adopted, epoch })
+  } else if (adopted !== undefined && info.sessionId !== undefined && info.sessionId !== adopted) {
+    // Post-adoption session switch: next incarnation, born already adopted.
+    adopted = info.sessionId
+    epoch += 1
+    setState({ adopted, epoch })
+  } else if (adopted !== undefined && info.sessionId === undefined) {
+    // Back to no-session: next incarnation, born blank (adopts anew later).
+    adopted = undefined
+    epoch += 1
+    setState({ adopted, epoch })
+  }
+  return <SessionMaybeEntryBody key={epoch} entry={entry} ownerProps={ownerProps} info={info} />
+}
+
+/** Adoption bookkeeping of one session-maybe outlet (see SessionMaybeEntry). */
+interface MaybeIncarnation {
+  /** Session this incarnation adopted; undefined while born blank and unadopted. */
+  readonly adopted: string | undefined
+  /** Incarnation counter — the child key; bumps exactly when an incarnation dies. */
+  readonly epoch: number
+}
+
+const FIRST_INCARNATION: MaybeIncarnation = { adopted: undefined, epoch: 0 }
+
 function RootEntry({ entry, ownerProps }: { entry: StoredEntry; ownerProps: object }) {
  const host = useHost()
  const Comp = entry.component as FC<InjectedProps>
--- a/packages/client/web-react/src/session-provider.tsx
+++ b/packages/client/web-react/src/session-provider.tsx
@@ -117,9 +117,10 @@ const projectionHookCache = new WeakMap<SessionMaybeProvideInfo, (
 ) => unknown>()

 /**
- * Root-level binding provider. It follows current selection without a key, so
- * session-maybe entries retain their React identity while the context value
- * moves between absent and definite session bundles.
+ * Root-level binding provider. It follows current selection without a key;
+ * per-entry identity is the outlet's adoption bookkeeping (SessionMaybeEntry):
+ * a blank-born incarnation adopts the first session without remounting, and
+ * every later transition (switch or loss) remounts like a strict entry.
 */
 export function SessionMaybeProvider({ children }: { children: ReactNode }) {
  const host = useHost()
--- a/packages/client/web-react/tests/scoped-slots.spec.tsx
+++ b/packages/client/web-react/tests/scoped-slots.spec.tsx
@@ -10,7 +10,7 @@
 */
 import { describe, expect, it, vi } from 'vitest'
 import { act, fireEvent, render } from '@testing-library/react'
-import { useEffect, type ReactNode } from 'react'
+import { useEffect, useState, type ReactNode } from 'react'
 import type { ActionsDecl, SlotEntryDef, SlotSpec, StoreHandle, StoredEntry } from '@deepseek-ai/dsh-client-ui-slots'
 import type { SessionMaybeProvideInfo } from '@deepseek-ai/dsh-client-ui-slots'
 import {
@@ -863,3 +863,70 @@ describe('inject: execution point, parameter derivation, cache granularity', ()
    expect(props['shared']).toBe('owner')   // owner overrides inject
  })
 })
+
+describe('session-maybe adoption identity', () => {
+  const SINGLE_MAYBE: DeclaredSpec = { kind: 'single', scope: 'session-maybe' }
+
+  /** Mount a maybe entry that records its mount count and local state. */
+  function mountMaybeCounter(h: Fake) {
+    let mounts = 0
+    const seen: { sessionId: string | undefined; mount: number }[] = []
+    h.declare('k.maybe', SINGLE_MAYBE)
+    h.add('k.maybe', {
+      component: ({ sessionId }: { sessionId?: string }) => {
+        // Local mount marker: useState initializer runs once per incarnation.
+        const [mount] = useState(() => ++mounts)
+        seen.push({ sessionId, mount })
+        return <b>{`${sessionId ?? 'blank'}#${mount}`}</b>
+      },
+    })
+    const { view } = mountRoot(h, { 'k.maybe': SINGLE_MAYBE }, renderSlot => renderSlot('k.maybe', {}))
+    return { view, seen }
+  }
+
+  it('adopts the first session: blank → first id keeps the incarnation (no remount)', () => {
+    const h = makeHost()
+    h.addSession('s1')
+    const { view } = mountMaybeCounter(h)
+    expect(view.container.textContent).toBe('blank#1')
+    act(() => { h.current.set('s1') })
+    // Same incarnation (#1): the blank shell adopted s1.
+    expect(view.container.textContent).toBe('s1#1')
+  })
+
+  it('remounts on a post-adoption session switch (local state must not leak across sessions)', () => {
+    const h = makeHost()
+    h.addSession('s1')
+    h.addSession('s2')
+    const { view } = mountMaybeCounter(h)
+    act(() => { h.current.set('s1') })
+    expect(view.container.textContent).toBe('s1#1')
+    act(() => { h.current.set('s2') })
+    // New incarnation (#2): strict-session behavior after adoption.
+    expect(view.container.textContent).toBe('s2#2')
+  })
+
+  it('remounts into a fresh blank incarnation on session loss, then adopts anew', () => {
+    const h = makeHost()
+    h.addSession('s1')
+    h.addSession('s2')
+    const { view } = mountMaybeCounter(h)
+    act(() => { h.current.set('s1') })
+    expect(view.container.textContent).toBe('s1#1')
+    act(() => { h.current.set(undefined) })
+    // The adopted incarnation dies with its session; blank state is fresh.
+    expect(view.container.textContent).toBe('blank#2')
+    act(() => { h.current.set('s2') })
+    // The fresh blank adopts again — still incarnation #2, no flash.
+    expect(view.container.textContent).toBe('s2#2')
+  })
+
+  it('keeps the incarnation across a no-op republish of the same session', () => {
+    const h = makeHost()
+    h.addSession('s1')
+    const { view } = mountMaybeCounter(h)
+    act(() => { h.current.set('s1') })
+    act(() => { h.current.set('s1') })
+    expect(view.container.textContent).toBe('s1#1')
+  })
+})