StreamdownTextPrimitive#

StreamdownTextPrimitive is the core rendering component in @assistant-ui/react-streamdown. It wraps the upstream Streamdown renderer with assistant-ui-specific concerns: message-part binding, smooth streaming, incomplete-markdown repair (remend), plugin composition, and an optional security layer.

Source file: packages/react-streamdown/src/primitives/StreamdownText.tsx
Type definitions: packages/react-streamdown/src/types.ts

Public API — StreamdownTextPrimitiveProps#

StreamdownTextPrimitiveProps is defined as a selective re-export of StreamdownProps with several props omitted and replaced by typed wrappers 1:

Props added (no equivalent in StreamdownProps): componentsByLanguage, preprocess, defer, smooth, containerProps, containerClassName, security 2.

All remaining StreamdownProps pass through via ...streamdownProps spread 3.

Runtime Behaviour#

Message binding & text pipeline#

The component calls useMessagePartText() to get the current message part, then optionally passes the text through a preprocess function 4. The text then flows through useSmooth (for typewriter animation) and optionally useDeferredValue when defer=true 5.

Incomplete-markdown repair (remend)#

When mode="streaming" (default) and no custom parseMarkdownIntoBlocksFn is provided, tailBoundedRemend is called to close dangling markdown syntax before passing text to Streamdown. This means parseIncompleteMarkdown is resolved to false internally once remend runs 6.

Plugin composition#

mergePlugins(userPlugins, {}) processes the plugins prop 7. Three-state semantics: false = disable, undefined = fall through to defaults, plugin instance = use explicitly. Mermaid is opt-in only — it is never auto-detected. The shikiTheme defaults to ["github-light", "github-dark"] when a code plugin is active 8.

Security — rehypePlugin Composition & Spreading Order#

When a security prop is provided, buildSecurityRehypePlugins constructs a fixed plugin pipeline 9:

1. rehype-raw — allows raw HTML passthrough
2. rehype-sanitize with an empty schema — strips all attributes/elements not in the schema
3. rehype-harden — enforces URL allow-lists for links and images, controlled by SecurityConfig

The resulting array is assigned to rehypePlugins and passed to <Streamdown> via optionalProps .

Critical spreading order: The <Streamdown> element receives props in this order 11:

mode, isAnimating, components
{...optionalProps} ← contains rehypePlugins from security
{...streamdownProps} ← user's remaining StreamdownProps

Because streamdownProps spreads after optionalProps, any rehypePlugins supplied directly by the caller via a pass-through StreamdownProps key would override the security-hardened pipeline. However, rehypePlugins is not in the omitted list of StreamdownTextPrimitiveProps — it remains available as a pass-through prop. Callers who set rehypePlugins directly will silently replace the security-built pipeline. The safe pattern is to use the security prop and leave rehypePlugins unset.

SecurityConfig fields#

12

Container Rendering#

The component renders a <div> wrapper with data-status={status.type} and applies containerProps and containerClassName. The inner <Streamdown> renders inside this wrapper 13. containerClassName and containerProps.className are merged; neither takes precedence — both are joined 14.

Key References#

• StreamdownText.tsx — full component implementation
• types.ts — StreamdownTextPrimitiveProps, SecurityConfig, PluginConfig, RemendConfig, ControlsConfig
• PR #3143 — feat(react-streamdown): init — initial package introduction
• PR #3690 — docs: comprehensive Streamdown guide — usage documentation