Shypd.aiThe largest open index of AI toolsuse-stick-to-bottom is a React Hook designed for AI chat applications that smoothly sticks to the bottom of messages. It ensures content remains visible while new messages are added, enhancing user experience.
Trending
Also listed in
About
use-stick-to-bottom is a lightweight, zero-dependency React Hook and Component specifically designed for AI chat applications. It automatically sticks to the bottom of a container and smoothly animates content to maintain its visual position as new messages are added. This tool does not rely on `overflow-anchor` CSS support, making it compatible with browsers like Safari. It uses the `ResizeObserver` API to detect content resizing, supporting both content growth and shrinking without losing stickiness. The hook also correctly handles scroll anchoring, preventing content jumps when elements above the viewport resize. Users can cancel stickiness by scrolling up, with clever logic distinguishing user scrolls from animation events. It features a custom smooth scrolling algorithm with velocity-based spring animations, ideal for streaming content with variable sizing common in AI chatbots.
Capabilities
Pricing & Plans
Open Source
Free
FAQs
Trending
