Files
storkit/.living_spec/specs
Dave 57826dc5ee Story 22: Implement smart auto-scroll that respects user scrolling
User Story:
As a user, I want to be able to scroll up to review previous messages
while the AI is streaming or adding new content, without being
constantly dragged back to the bottom.

Implementation:
- Replaced position-based threshold detection with user-intent tracking
- Detects when user scrolls UP and disables auto-scroll completely
- Auto-scroll only re-enables when user manually returns to bottom (<5px)
- Uses refs to track scroll position and direction for smooth operation
- Works seamlessly during rapid token streaming and tool execution

Technical Details:
- lastScrollTopRef: Tracks previous scroll position to detect direction
- userScrolledUpRef: Flag set when upward scrolling is detected
- Direct scrollTop manipulation for instant, non-fighting scroll behavior
- Threshold of 5px from absolute bottom to re-enable auto-scroll

Spec Updates:
- Added comprehensive Smart Auto-Scroll section to UI_UX.md
- Documented the problem, solution, requirements, and implementation
- Includes code examples and edge case handling

Acceptance Criteria Met:
 Auto-scroll disabled when scrolling up
 Auto-scroll resumes when returning to bottom
 Works normally when already at bottom
 Smooth detection without flickering
 Works during streaming and tool execution

Files Changed:
- src/components/Chat.tsx: Implemented user-intent tracking
- .living_spec/specs/functional/UI_UX.md: Added Smart Auto-Scroll spec
- .living_spec/stories/22_smart_autoscroll.md: Marked complete
2025-12-27 19:21:34 +00:00
..
2025-12-24 16:29:33 +00:00
2025-12-24 16:29:33 +00:00

Project Specs

This folder contains the "Living Specification" for the project. It serves as the source of truth for all AI sessions.

Structure

  • 00_CONTEXT.md: The high-level overview, goals, domain definition, and glossary. Start here.
  • tech/: Implementation details, including the Tech Stack, Architecture, and Constraints.
    • STACK.md: The technical "Constitution" (Languages, Libraries, Patterns).
  • functional/: Domain logic and behavior descriptions, platform-agnostic.
    • 01_CORE.md: Core functional specifications.

Usage for LLMs

  1. Always read 00_CONTEXT.md and tech/STACK.md at the beginning of a session.
  2. Before writing code, ensure the spec in this folder reflects the desired reality.
  3. If a Story changes behavior, update the spec first, get approval, then write code.