Skip to content
Clicky UI

Markdown

Renders markdown with Streamdown, which is purpose-built for streaming LLM output (it gracefully handles incomplete markdown mid-stream). Fenced code blocks render via the library CodeBlock, and lists and tables are styled here rather than by Streamdown. Falls back to preformatted text until Streamdown loads or when it is not installed.

Source

Import

Section titled “Import”
import { Markdown } from "@flanksource/clicky-ui/data";

Demos

Section titled “Demos”
All Syntax · Open in Storybook
Lists · Open in Storybook
Task Lists · Open in Storybook

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Props

Section titled “Props”
Prop Type Default Description
callouts boolean false Render `<CalloutBox …>` authored inline in the markdown as a {@link Callout}. Off by default. It admits exactly one extra tag with exactly the callout's own attributes — no other markup in `text` becomes live — so it is safe to turn on wherever callouts are wanted.
className string — Classes applied to the rendered markdown wrapper.
resolveUrl (…) => … — Resolve sanitized document links and images relative to a host-owned source location.
sourceBlocks boolean false Stamp each top-level block with `data-source-start` / `data-source-end`, the 1-based line range of `text` it renders, so a host can anchor annotations to source lines. The document renders as one static block (no streaming), which keeps the line numbers absolute; Streamdown's default sanitising stays in place. Cannot be combined with `callouts`.
text* string — Markdown source text.