Typeset

Typeset gives markdown output from react-markdown or Streamdown consistent headings, lists, code blocks, quotes and tables. It copes with streaming answers that grow block by block.

Install

bashnpx shadcn@4.18.0 add @siteplane/typeset

Import it from @/siteplane/components/typeset. The project needs Siteplane UI's one-time setup first: installation.

When to pick it

• vs Native Table: Typeset renders markdown tables with Native Table already; use Native Table directly only for hand-built tables.
• vs Bubble: Put Typeset inside a ghost Bubble for an assistant answer.

Rules

• Pass typesetComponents to your renderer's components prop and place the output inside Typeset.
• Choose density="chat" for answers in a thread and density="document" for longer standalone reading.
• With Streamdown, give its wrapper className="contents space-y-0" and pass streaming to TypesetCodeBlock while a fence is still open.
• Add remark-gfm to react-markdown if answers contain tables.
• Use Typeset only for written prose, not for interface labels in forms or cards.

Reference

• Typeset docs, with every prop, part and example (Markdown)
• Siteplane UI 1.8.1, Chat & AI. Read the installed source under src/siteplane before relying on an API.