@konspire/renderer
v0.1.0
Published
Render a Cursor-plan Markdown document to standalone HTML with Mermaid + syntax highlighting.
Downloads
52
Readme
@konspire/renderer
Convert a Markdown document to a standalone, self-contained HTML page with syntax-highlighted code blocks (highlight.js) and rendered Mermaid diagrams.
The same renderer that powers every published plan on konspire.dev, exposed as a plain library so you can embed it in your own tools, CI scripts, or static-site pipelines.
Install
npm install @konspire/rendererUsage
import { convertMarkdownToHtml } from '@konspire/renderer';
const html = await convertMarkdownToHtml('# Hello\n\n```ts\nconst x = 1;\n```');
// → full HTML document, no external CSS / JS, ready to write to diskOptions
const html = await convertMarkdownToHtml(markdownString, {
title: 'My Plan', // <title> override; defaults to first H1
stripFrontmatter: true, // drop YAML frontmatter before rendering
});Konspire hydration mode
Optional: if the rendered HTML is going to live on konspire.dev and pick up
comments + live todo state from the API, opt into the hydration hooks:
const html = await convertMarkdownToHtml(markdownString, {
hydration: {
revSlug: 'acme-payments-shayne-add-stripe-webhooks_rev1',
logicalSlug: 'acme-payments-shayne-add-stripe-webhooks',
apiBase: 'https://api.konspire.dev/api/default/v1',
bootstrapSrc: 'https://konspire.dev/cdn-assets/bootstrap.js', // optional override
},
});Without hydration, the output is a fully self-contained, JS-free document.
What you get out of the box
- GitHub-Flavored Markdown via marked.
- Syntax highlighting via highlight.js. Stylesheet
is inlined into
<head>so the document stays one-file. - Mermaid diagrams rendered server-side from
```mermaidcode blocks. - XSS-safe: marked's sanitizer runs on user-content; hydration metadata is
JSON-encoded with the standard escape sequence (
</→<\/).
Links
- Konspire: https://konspire.dev
- Source: https://github.com/konspire-dev/konspire
License
MIT
