API | Smoothstream

All three adapters share the same presentation options. React passes Markdown as children, Vue as markdown, and the DOM adapter as the first argument to update().

Shared options

Option	Type	Default	Description
`receiving`	`boolean`	`false`	Whether this snapshot may still grow. See Streaming a response.
`mode`	`"streaming"` \| `"static"`	`"streaming"`	Pace a live answer, or render completed Markdown immediately.
`reveal`	`"character"` \| `"word"`	`"character"`	How flowing text enters. See Reveal and timing.
`interval`	`number`	`3`	Base cadence between presentation units, in milliseconds.
`duration`	`number`	`1000`	Entrance duration in milliseconds for text and related motion.
`reducedMotion`	`"system"` \| `"always"` \| `"never"`	`"system"`	Reduced-motion policy. Independent of `mode`.
`unstyled`	`boolean`	`false`	Drop the default prose theme. Functional reveal CSS stays.
`codeHighlighter`	`CodeHighlighter`	—	Optional highlighter from `@smoothstream/code`.

Adapter surfaces

React

Import { Smoothstream } from @smoothstream/react.

Prop	Type	Description
`children`	`string`	Accumulated Markdown. Must be a string (or an array of strings).
`className`	`string`	Class names on the Markdown root.

Changing interval, duration, mode, or reveal remounts playback. Changing the Markdown to a string that is not a prefix of the current source throws; remount with a new key.

Import { Smoothstream } from @smoothstream/vue.

Prop	Type	Default	Description
`markdown`	`string`	`""`	Accumulated Markdown.
`class`	`string`	—	Fallthrough attribute merged onto the Markdown root.

In templates, use kebab-case for multi-word props (:code-highlighter, :reduced-motion). Changing interval, duration, mode, or reveal rebuilds the session. A non-prefix markdown update throws; give the next answer a new key.

Import { createSmoothstream } from @smoothstream/dom.

const stream = createSmoothstream(container, options);stream.update(markdown, { receiving });stream.destroy();stream.element; // HTMLDivElement

Name	Description
`options.className`	Class names on the Markdown root. Constructor-only.
`update(markdown, { receiving? })`	Queue the latest append-only snapshot. `receiving` is the only option that updates after create.
`destroy()`	Tear down the root, listeners, pending work, and announcer.
`element`	The managed root inside the container you passed.

mode, reveal, interval, duration, reducedMotion, unstyled, className, and codeHighlighter are constructor-only. A non-prefix update() throws.

Exported TypeScript names: SmoothstreamProps (React, Vue), SmoothstreamOptions, SmoothstreamUpdateOptions, and SmoothstreamController (DOM), plus SmoothstreamMode, SmoothstreamReducedMotion, and SmoothstreamReveal.

`createCodeHighlighter`

Import { codeHighlighter, createCodeHighlighter } from @smoothstream/code. codeHighlighter is createCodeHighlighter() with defaults.

Option	Type	Default	Description
`theme`	bundled Shiki theme name	`"github-light"`	Single theme. Mutually exclusive with `themes`.
`themes`	`{ light, dark }`	—	Paired bundled themes. Mutually exclusive with `theme`.
`defaultColor`	`"light"` \| `"dark"` \| `"light-dark()"` \| `false`	`"light"`	Shiki’s multiple-theme color strategy. Only with `themes`.
`showLanguageLabels`	`boolean`	`true`	Language name above each fenced block.

Pass the returned highlighter as codeHighlighter to any adapter. See Syntax highlighting.