Skip to content
Components

StreamingText

Progressive streaming answer with settle-gated chrome.

Oak is the fastest-growing finish this quarter - orders are up 23% and returns are down 8 points. Warm mid-tone woods are trending in the same range.

Follow-ups

Usage

import { StreamingText, StreamingTextProps, StreamingTextSource, StreamingTextToken } from "@instruments/materia-ui/components/streaming-text";

Best practices

  • Drive tokens from real stream deltas - don't fake a word clock in product code. Showcase demos may animate.

Props

PropTypeDefaultDescription
classNamestring
tokens(required)StreamingTextToken[]

Tokens revealed so far (controlled).

streamingboolean

Whether the stream is still open.

sourcesStreamingTextSource[]

Sources for the stacked avatars + disclosure.

sourceCountnumber

Source count label (may exceed sources.length).

followUpsstring[]

Follow-up prompts revealed after settle.

onFollowUp(text: string) => void

Called when a follow-up is chosen.

actionsReactNode

Action controls (copy, retry, rating) rendered once the answer settles.

followUpsLabelstring

Heading above the follow-up prompts. Defaults to "Follow-ups".

sourcesLabelstring

Noun after the source count. Defaults to "sources".

Also exports

  • interfaceStreamingTextProps
  • interfaceStreamingTextSource
  • interfaceStreamingTextToken

Composition

Builds on

Flex, Grid, Text