dsh-smooth-stream 0.3.2 → 0.3.4

package/src/client/TypewriterToolNodeView.tsx

@@ -1,5 +1,7 @@
-import { createElement, useRef, type ComponentType } from 'react'
+import { createElement, useCallback, useEffect, useLayoutEffect, useRef, useState, type ComponentType } from 'react'
 import { FollowHost } from './FollowHost.tsx'
+import { useProgressiveDomText } from './useProgressiveDomText.ts'
+import { hasRecentConversationFollow } from './teleprompterGlide.ts'
 
 /** Props forwarded through a follow wrap; extra kit seats pass through. */
 export type FollowWrapProps = {
@@ -7,10 +9,29 @@ export type FollowWrapProps = {
   renderSlot?: unknown
 } & Record<string, unknown>
 
+function openAgentLocation(node: unknown): boolean {
+  if (node === null || typeof node !== 'object' || !('location' in node)) return false
+  const location = (node as { location: unknown }).location
+  if (location === null || typeof location !== 'object' || !('kind' in location)) return false
+  const kind = (location as { kind: unknown }).kind
+  if (!('turn' in location)) return false
+  const turn = (location as { turn: unknown }).turn
+  if (turn === null || typeof turn !== 'object' || !('status' in turn)) return false
+  if (kind === 'turn') return (turn as { status: unknown }).status === 'open'
+  if (kind !== 'step' || !('step' in location)) return false
+  const step = (location as { step: unknown }).step
+  return step !== null
+    && typeof step === 'object'
+    && 'status' in step
+    && (step as { status: unknown }).status === 'open'
+}
+
 /**
- * True while a Chat node is still growing: an assistant/workflow `status:
- * 'running'` payload, a Tool root that has not settled (`kind` absent), or a
- * model-retry whose current attempt is still `scheduled`.
+ * True while a Chat node has an explicitly unfinished lifecycle: an
+ * assistant/workflow `status: 'running'` payload, a Tool root that has not
+ * settled (`kind` absent), or a model-retry whose current attempt is still
+ * `scheduled`. Open-but-otherwise-unknown rows are covered by
+ * `isFollowableChatNode` below.
  * @param node - The Chat node's view `node` prop.
  * @returns whether this row should own conversation follow.
  */
@@ -19,6 +40,21 @@ export function isGrowingChatNode(node: unknown): boolean {
   const data = (node as { data: unknown }).data
   if (data === null || typeof data !== 'object') return false
   if ('status' in data && (data as { status: unknown }).status === 'running') return true
+  if (
+    'kind' in data
+    && (data as { kind: unknown }).kind === 'command'
+    && 'outcome' in data
+    && (data as { outcome: unknown }).outcome === null
+  ) return true
+  if ('command' in data) {
+    const command = (data as { command: unknown }).command
+    if (
+      command !== null
+      && typeof command === 'object'
+      && 'outcome' in command
+      && (command as { outcome: unknown }).outcome === null
+    ) return true
+  }
   if ('root' in data) {
     const root = (data as { root: unknown }).root
     if (root !== null && typeof root === 'object' && !('kind' in root)) return true
@@ -36,17 +72,156 @@ export function isGrowingChatNode(node: unknown): boolean {
 }
 
 /**
- * Wrap a prior Chat node renderer so a growing row shares conversation
- * follow. Presentation stays with the wrapped component; kit seats
- * (`renderSlot`, locale, inject) pass through unchanged.
+ * True for any Agent-owned Chat row in the currently open turn/step. This is
+ * the extensibility boundary: a newly registered Context, Command, Tool, or
+ * workflow renderer is followed without adding another kind-specific branch.
+ */
+export function isFollowableChatNode(node: unknown): boolean {
+  return isGrowingChatNode(node) || openAgentLocation(node)
+}
+
+/**
+ * True when a newly mounted Agent-owned row belongs to the current open
+ * Turn/Step, or is itself an unresolved growing lifecycle.
+ * @param node - The Chat node's view `node` prop.
+ * @returns whether its initial height should enter through conversation follow.
+ */
+export function shouldAnimateChatNodeEntrance(node: unknown): boolean {
+  return isFollowableChatNode(node)
+}
+
+/** Runtime-only fallback for unknown or terminal rows at the active flow tip. */
+function liveAgentTailMode(root: HTMLElement): 'turn' | 'handoff' | null {
+  const port = root.closest<HTMLElement>('[data-conversation-scroll]')
+  if (port === null) return null
+  const row = root.closest<HTMLElement>('[data-chat-flow-key]')
+  if (row !== null) {
+    let sibling = row.nextElementSibling
+    while (sibling !== null) {
+      if (sibling instanceof HTMLElement && sibling.hasAttribute('data-chat-flow-key')) return null
+      sibling = sibling.nextElementSibling
+    }
+  }
+  const flow = root.closest<HTMLElement>('[data-chat-flow]')
+  const hasTurnStatus = flow !== null && [...flow.children].some(child =>
+    child instanceof HTMLElement
+    && child.getAttribute('role') === 'status'
+    && !child.hasAttribute('data-chat-flow-key'))
+  if (hasTurnStatus) return 'turn'
+  return hasRecentConversationFollow(port) ? 'handoff' : null
+}
+
+/**
+ * Wrap a prior Agent Chat renderer so its entrance and later growth share
+ * conversation follow. Presentation stays with the wrapped component; kit
+ * seats (`renderSlot`, locale, inject) pass through unchanged.
  * @param Inner - The already-registered row component.
  * @returns A follow-hosted row.
  */
 export function wrapFollowNodeView(Inner: ComponentType<FollowWrapProps>) {
   return function TypewriterFollowNodeView(props: FollowWrapProps) {
     const speedCpsRef = useRef(35)
+    const hostRef = useRef<HTMLDivElement>(null)
+    const growing = isGrowingChatNode(props.node)
+    const structurallyFollowable = isFollowableChatNode(props.node)
+    const structuralRef = useRef(structurallyFollowable)
+    const [runtimeFollowable, setRuntimeFollowable] = useState(false)
+    const runtimePersistentRef = useRef(false)
+    const runtimeHandledRef = useRef(false)
+    const followable = structurallyFollowable || runtimeFollowable
+    const revealInitialRef = useRef(true)
+    const [entering, setEntering] = useState(() => shouldAnimateChatNodeEntrance(props.node))
+    const [growthPulse, setGrowthPulse] = useState(false)
+    const followableRef = useRef(false)
+    const growingRef = useRef(growing)
+    const entranceActiveRef = useRef(entering || growthPulse)
+    const growthExtentRef = useRef<number | null>(null)
+    const mountedRef = useRef(true)
+    const pulseTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+    structuralRef.current = structurallyFollowable
+    followableRef.current = followable
+    growingRef.current = growing
+    entranceActiveRef.current = entering || growthPulse
+    const finishRuntimeReveal = useCallback(() => {
+      if (structuralRef.current || runtimePersistentRef.current) return
+      runtimeHandledRef.current = true
+      setRuntimeFollowable(false)
+    }, [])
+    useProgressiveDomText(
+      hostRef,
+      followable,
+      revealInitialRef.current,
+      speedCpsRef,
+      runtimeFollowable ? finishRuntimeReveal : undefined,
+    )
+    useLayoutEffect(() => {
+      if (structurallyFollowable) return
+      const root = hostRef.current
+      if (root === null) return
+      const mode = liveAgentTailMode(root)
+      if (runtimeFollowable) {
+        if (runtimePersistentRef.current && mode !== 'turn') {
+          runtimePersistentRef.current = false
+          runtimeHandledRef.current = true
+          setRuntimeFollowable(false)
+        }
+        return
+      }
+      if (runtimeHandledRef.current || mode === null) return
+      runtimePersistentRef.current = mode === 'turn'
+      setRuntimeFollowable(true)
+      setEntering(true)
+    }, [runtimeFollowable, structurallyFollowable])
+    const finishEntrance = useCallback(() => {
+      growthExtentRef.current = null
+      if (pulseTimerRef.current !== null) {
+        clearTimeout(pulseTimerRef.current)
+        pulseTimerRef.current = null
+      }
+      setEntering(false)
+      setGrowthPulse(false)
+    }, [])
+    const onGrowth = useCallback((deltaPx: number) => {
+      // A row with an explicit streaming lifecycle keeps its original owner
+      // through completion. For every other Agent row, a pure layout increase
+      // is enough evidence to glide it; renderer kind and payload shape are
+      // intentionally irrelevant.
+      if (
+        !mountedRef.current
+        || !followableRef.current
+        || growingRef.current
+        || entranceActiveRef.current
+      ) return
+      growthExtentRef.current = deltaPx
+      setGrowthPulse(true)
+      if (pulseTimerRef.current !== null) clearTimeout(pulseTimerRef.current)
+      pulseTimerRef.current = setTimeout(() => {
+        pulseTimerRef.current = null
+        setGrowthPulse(false)
+      }, 1200)
+    }, [])
+    useEffect(() => {
+      mountedRef.current = true
+      return () => {
+        mountedRef.current = false
+        if (pulseTimerRef.current !== null) clearTimeout(pulseTimerRef.current)
+      }
+    }, [])
     return (
-      <FollowHost active={isGrowingChatNode(props.node)} speedCpsRef={speedCpsRef}>
+      <FollowHost
+        active={growing}
+        entrance={entering || growthPulse}
+        onEntranceSettled={finishEntrance}
+        onGrowth={followable ? onGrowth : undefined}
+        entranceExtentRef={growthExtentRef}
+        speedCpsRef={speedCpsRef}
+        // Generic Agent rows reveal and spring their measured growth, but do
+        // not continuously reserve space for a future Markdown line wrap.
+        // Keeping that assistant-only prediction here creates an idle gap
+        // above TurnStatus and a visible return when a short Tool row settles.
+        predictive={false}
+        hostRef={hostRef}
+      >
         {createElement(Inner, props)}
       </FollowHost>
     )

package/src/client/index.ts

@@ -28,9 +28,22 @@ type AssistantProps = ChatNodeViewProps<'assistant-step'>
 const STREAM_MODES: readonly string[] = ['typewriter', 'teleprompter']
 const STREAM_PRESETS: readonly string[] = ['realtime', 'balanced', 'silky']
 
-/** Human-authored rows stay on the built-in renderer; `assistant-step` is replaced. */
+/**
+ * The assistant renderer owns its own character queue and conversation
+ * follower, so wrapping it again would create two scroll owners. Human input
+ * stays immediate; every Agent-owned output renderer goes through the same
+ * generic follow boundary. This is deliberately keyed by the owner that
+ * provides the renderer, not by individual tool names, so new Context,
+ * Command, and Tool rows are covered automatically.
+ */
 const SKIP_WRAP = new Set(['assistant-step', 'user', 'steering', 'command-input'])
 
+/** React function/class or an exotic component such as memo/forwardRef/lazy. */
+function isWrappableComponent(value: unknown): value is ComponentType<FollowWrapProps> {
+  return typeof value === 'function'
+    || (value !== null && typeof value === 'object' && '$$typeof' in value)
+}
+
 /**
  * Read the Host-bridged boot config. The inline script is produced by this
  * plugin's Host half from a schema-validated value, so only the structural
@@ -60,16 +73,19 @@ function readBootConfig(): StreamConfig {
 }
 
 /**
- * Wrap every keyed Chat row except `assistant-step` in place. A second
+ * Wrap every Agent-owned keyed Chat row except the assistant renderer in
+ * place. A second
  * register with the same `children` table throws because the child slot is
  * already declared, and only the winning entry receives `renderSlot`;
  * swapping `entry.component` keeps the original children, locale, and inject
  * seats. `assistant-step` is replaced below so text and Think use the
- * typewriter reveal.
+ * typewriter reveal. The wrapper owns only the shared layout-growth/follow
+ * lifecycle; the Harness keeps each renderer's controls, disclosures, and
+ * cards intact.
  * @param ctx - Browser context carrying the slot registry.
  * @returns Restorer that puts the original components back.
  */
-function wrapGrowingChatRows(ctx: ClientContext): () => void {
+function wrapAgentChatRows(ctx: ClientContext): () => void {
   const restores: Array<() => void> = []
   const wrapped = new WeakSet<object>()
 
@@ -78,7 +94,7 @@ function wrapGrowingChatRows(ctx: ClientContext): () => void {
       const key = entry.options.key
       if (key === undefined || SKIP_WRAP.has(key)) continue
       const current = entry.component
-      if (typeof current !== 'function' || wrapped.has(current)) continue
+      if (!isWrappableComponent(current) || wrapped.has(current)) continue
       const inner = current as ComponentType<FollowWrapProps>
       const next = wrapFollowNodeView(inner)
       wrapped.add(next)
@@ -145,8 +161,9 @@ class PreferenceCell {
 /**
  * Register the typewriter renderer after the conversation package declares the
  * keyed Chat node seat. A lower priority shadows the built-in assistant row;
- * every other growing row is wrapped in place so Tool cards, retries, and
- * workflow runs share conversation follow. The Host-bridged configuration
+ * every other keyed renderer is wrapped in place so Context, commands, Tool
+ * cards, retries, and workflow runs share one extensible follow boundary. The
+ * Host-bridged configuration
  * selects the render direction, smoothing preset, and glide speed; the
  * plugin-owned settings RPC supplies the live auto-expand preference when the
  * settings surface is composed.
@@ -199,7 +216,7 @@ export function apply(ctx: ClientContext): void {
     })
   }
   ctx.slots.inject('conversation.chat.node', () => {
-    const unwrap = wrapGrowingChatRows(ctx)
+    const unwrap = wrapAgentChatRows(ctx)
     const unshadow = ctx.slots.register({
       name: 'conversation.chat.node',
       key: 'assistant-step',