feat(web): auto-follow streaming output and add scroll-to-bottom button

- ChatWindow: follow the streaming bubble on every chunk (scrollIntoView block:end),
  driven by followStreamRef (true by default, only genuine scroll gestures flip it)
- Remove the agentRunning spacer that pushed content above the viewport at the bottom
- Move the scroll-to-bottom button into the input row (ChatInput scrollToBottomButton slot),
  always visible, dimmed at the bottom; click jumps to the live stream or the end
- useAgentSession: drop window pointerdown as scroll-intent marker (send-click was
  misread as a scroll-away, disabling follow before the stream started); expose
  atBottom/followStreamRef/scrollToBottom
- i18n: add chat.scrollToBottom (en/zh-CN)
This commit is contained in:
luckyyzh
2026-08-05 04:46:58 +08:00
parent 19ae25040d
commit cb9ec7a869
6 changed files with 128 additions and 17 deletions
+7 -1
View File
@@ -62,6 +62,9 @@ interface Props {
behavior: "steer" | "followUp",
images?: AttachedImage[],
) => void;
// Optional trailing control rendered inside the input row (right side,
// before the send/steer buttons) — used for the scroll-to-bottom button.
scrollToBottomButton?: React.ReactNode;
isStreaming: boolean;
model?: { provider: string; modelId: string } | null;
isAutoModelSelection?: boolean;
@@ -412,6 +415,7 @@ export const ChatInput = forwardRef<ChatInputHandle, Props>(function ChatInput(
onSoundToggle,
onAudioUnlock,
onPromptWithStreamingBehavior,
scrollToBottomButton,
draftKey,
cwd,
}: Props,
@@ -2210,7 +2214,9 @@ export const ChatInput = forwardRef<ChatInputHandle, Props>(function ChatInput(
maxHeight: 200,
overflow: "auto",
}}
/>
/>
{scrollToBottomButton}
{isStreaming ? (
<div