Markdown

AgentMarkdown wraps @comark/vue and applies the vh-typeset vh-typeset-chat defaults. The stylesheet uses block-start spacing, which remains stable while streaming content appends new nodes.

<script setup lang="ts">
const answer = `## Verification

- **10 tests** passed
- The production page returned \`200\`

The error row now reserves its full height.`;
</script>

<template>
  <AgentMarkdown :value="answer" />
</template>

<AgentMarkdown :value="part.text" :streaming="part.state === 'streaming'" />

Custom components

Pass Comark components and parser options directly:

<AgentMarkdown :value="answer" :components="{ Callout: MyCallout }" :options="{ gfm: true }" />

Styling

Override the package defaults globally or add a class per instance. The base rules deliberately avoid styling application chrome; they cover prose rhythm, headings, lists, links, inline code, code blocks, and blockquotes.

.support-answer {
  --vh-typeset-flow: 1em;
  --vh-typeset-leading: 1.7;
}