Skip to content

[Draft] feat(component-library): add MtMarkdown - #1398

Closed
Arnold Stoba (arnoldstoba) wants to merge 4 commits into
mainfrom
feat/mt-markdown
Closed

Arnold Stoba (arnoldstoba) wants to merge 4 commits into
mainfrom
feat/mt-markdown

Conversation

@arnoldstoba

@arnoldstoba Arnold Stoba (arnoldstoba) commented Oct 5, 2026 •

Copy link
Copy Markdown
Contributor

What?

Adds the experimental MtMarkdown, which renders Markdown such as an AI answer, also while it is still streaming. It is a configured wrapper around Comark's <Markdown> with Meteor's typography.

  • Supports GitHub Flavored Markdown: tables, task lists, strikethrough and bare links.
  • Raw HTML shows as text, links only use http, https, mailto and tel, and images with a full address only load from allowedImagePrefixes.
  • Code blocks have a copy button.

Why?

AI answers arrive as Markdown, token by token:

<mt-markdown :content="answer" :streaming="status === 'streaming'" />

An answer such as Two products are **low on stock**: would show raw ** while it streams. Converting it to HTML for v-html would run untrusted model output as HTML, and a model's answer can be influenced by the data it reads.

How?

  • Comark (NuxtLabs) parses and renders the Markdown. Nuxt UI uses it for AI chat, and Vercel's streamdown team recommends it for Vue. While streaming, it completes unfinished syntax at the end, such as **bold.
  • The configuration:
    • turns off raw HTML, Comark's component syntax and heading ids;
    • limits link schemes and image addresses with Comark's security plugin;
    • replaces pre with Meteor's code block, which adds the copy button;
    • wraps tables, so wide tables scroll;
    • opens external links in a new tab;
    • maps every element itself and replaces any Comark setup of the app, so global components such as Nuxt UI's ProseP don't change the content.
  • Comark is contained to MtMarkdown: its code is in a chunk that only MtMarkdown and the root index.js import, and importing other components leaves it out. A new size-limit entry tracks MtMarkdown on its own.
  • New dependency: @comark/vue (MIT). The full bundle budget grows by about 54 kB.

Testing?

Specs for our configuration (tables, task lists, raw HTML, unsafe links, images, copying, streaming) and SSR with hydration. Unit tests, types, build, size-limit, the docs build and the Nuxt example build pass.

Anything Else?

  • Comark is still pre-1.0 (0.7).
  • Its security plugin logs a console warning for every address it removes, including a link whose address is still streaming.
  • feat(component-library): add the AI chat components #1399 builds on this: mt-reasoning renders its text with MtMarkdown, and mt-tool reuses the code block. Its mt-tool needs to pass code to the code block as slot content after rebasing.

@vercel

vercel Bot commented Oct 5, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
meteor-docs Ready Ready Preview Oct 7, 2026 12:08pm UTC
meteor-storybook Ready Ready Preview Oct 7, 2026 12:08pm UTC

Request Review

@arnoldstoba Arnold Stoba (arnoldstoba) changed the title feat(component-library): add MtMarkdown and the mt-prose class feat(component-library): add MtMarkdown Oct 6, 2026

This branch was successfully deployed

2 active deployments
Preview – meteor-docs — eb759252 Deployed Oct 7, 2026 by vercel[bot]
Preview – meteor-storybook — eb759252 Deployed Oct 7, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant