Response Stream

Text appears character by character instead of in network-sized chunks. When chunks arrive faster than the reveal, it speeds up to stay about a third of a second behind the model.

Installation

Copy the command below and run it in your terminal.

bunx @sivir-ui/svelte add response-stream

Usage

Live responses

Pass an async iterable of text chunks as textStream, or pass the cumulative string and set streaming until it is final. A pulsing dot grid shows until the first chunk arrives. Text that has already arrived keeps revealing after the stream ends, then onComplete fires. With reduced motion, text appears without the reveal.

import { ResponseStream } from '@sivir-ui/svelte/components/response-stream';

<ResponseStream textStream={modelResponse} />

Complete responses

For a complete string, set speed from 1 (slowest) to 100 (fastest) to control the reveal pace. The default is 20.

import { ResponseStream } from '@sivir-ui/svelte/components/response-stream';

<ResponseStream textStream="Draft saved." speed={70} />

Anatomy

ResponseStream - Reveals response text at a steady pace, with a dot indicator before the first chunk.