flatmarkdown-ast2html 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Hidekazu Kubota
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,198 @@
+# flatmarkdown-ast2html
+
+Renders a [flatmarkdown](https://github.com/sosuisen/flatmarkdown) JSON AST to HTML in TypeScript.
+
+The `flatmarkdown` Rust crate exposes `markdown_to_ast()` which converts Markdown into a JSON AST. This library takes that AST and produces HTML — no Rust toolchain needed at render time.
+
+## Install
+
+```bash
+bun add flatmarkdown-ast2html
+# or
+npm install flatmarkdown-ast2html
+```
+
+## Quick Start
+
+```ts
+import { renderToHtml } from 'flatmarkdown-ast2html';
+
+// From a parsed AST object
+const ast = {
+  type: 'document',
+  children: [
+    {
+      type: 'paragraph',
+      children: [
+        { type: 'text', value: 'Hello ' },
+        { type: 'strong', children: [{ type: 'text', value: 'world' }] },
+      ],
+    },
+  ],
+};
+
+const html = renderToHtml(ast);
+// => '<p>Hello <strong>world</strong></p>\n'
+
+// From a JSON string (e.g. directly from flatmarkdown CLI/WASM output)
+const json = '{"type":"document","children":[{"type":"paragraph","children":[{"type":"text","value":"Hi"}]}]}';
+const html2 = renderToHtml(json);
+// => '<p>Hi</p>\n'
+```
+
+## API
+
+### `renderToHtml(ast, options?)`
+
+```ts
+function renderToHtml(ast: AstNode | string, options?: RenderOptions): string;
+```
+
+| Parameter | Type | Description |
+|-----------|------|-------------|
+| `ast` | `AstNode \| string` | Parsed AST object or JSON string |
+| `options` | `RenderOptions` | Optional rendering configuration |
+
+Returns an HTML string.
+
+### `RenderOptions`
+
+```ts
+interface RenderOptions {
+  wikilink?: WikiLinkOptions;
+}
+```
+
+### `WikiLinkOptions`
+
+Customize how `[[wikilinks]]` are rendered. This makes the output compatible with any routing library or framework.
+
+```ts
+interface WikiLinkOptions {
+  tagName?: string;                // default: 'a'
+  urlAttr?: string;                // default: 'href'
+  urlPrefix?: string;              // default: ''
+  attrs?: Record<string, string>;  // default: { 'data-wikilink': 'true' }
+}
+```
+
+| Field | Default | Description |
+|-------|---------|-------------|
+| `tagName` | `'a'` | HTML/component tag name. Use `'Link'` for React Router, `'A'` for SolidJS, etc. |
+| `urlAttr` | `'href'` | Attribute name for the URL. Use `'to'` for React Router, `'routerLink'` for Angular. |
+| `urlPrefix` | `''` | String prepended to the wikilink URL value. |
+| `attrs` | `{ 'data-wikilink': 'true' }` | Extra attributes on the tag. Replaces defaults when provided. |
+
+#### Examples
+
+**Default** — `[[page-name|label]]` renders as:
+
+```html
+<a href="page-name" data-wikilink="true">label</a>
+```
+
+**React Router**:
+
+```ts
+renderToHtml(ast, {
+  wikilink: {
+    tagName: 'Link',
+    urlAttr: 'to',
+    urlPrefix: '/wiki/',
+    attrs: { className: 'wikilink', 'data-wikilink': 'true' },
+  },
+});
+```
+
+```html
+<Link to="/wiki/page-name" className="wikilink" data-wikilink="true">label</Link>
+```
+
+**URL prefix only**:
+
+```ts
+renderToHtml(ast, {
+  wikilink: { urlPrefix: '/docs/' },
+});
+```
+
+```html
+<a href="/docs/page-name" data-wikilink="true">label</a>
+```
+
+## HTML Output Reference
+
+### Block Nodes
+
+| AST `type` | HTML |
+|------------|------|
+| `document` | Children concatenated (no wrapper) |
+| `paragraph` | `<p>…</p>` (omitted in tight lists) |
+| `heading` | `<h1>`–`<h6>` based on `level` |
+| `code_block` | `<pre><code class="language-{info}">…</code></pre>` |
+| `block_quote` | `<blockquote>…</blockquote>` |
+| `multiline_block_quote` | `<blockquote>…</blockquote>` |
+| `list` (bullet) | `<ul>…</ul>` |
+| `list` (ordered) | `<ol start="{start}">…</ol>` |
+| `item` | `<li>…</li>` |
+| `task_item` | `<li><input type="checkbox" checked="" disabled="" />…</li>` |
+| `table` | `<table>…</table>` |
+| `table_row` | `<tr>…</tr>` |
+| `table_cell` | `<td>…</td>` or `<th>…</th>` (header row), with `align` attr |
+| `thematic_break` | `<hr />` |
+| `html_block` | Raw passthrough |
+| `footnote_definition` | `<div class="footnote" id="fn-{name}">…</div>` |
+| `description_list` | `<dl>…</dl>` |
+| `description_term` | `<dt>…</dt>` |
+| `description_details` | `<dd>…</dd>` |
+| `alert` | `<div class="alert alert-{type}">…</div>` |
+| `front_matter` | Skipped (not rendered) |
+
+### Inline Nodes
+
+| AST `type` | HTML |
+|------------|------|
+| `text` | HTML-escaped text |
+| `softbreak` | `\n` |
+| `linebreak` | `<br />` |
+| `emph` | `<em>…</em>` |
+| `strong` | `<strong>…</strong>` |
+| `strikethrough` | `<del>…</del>` |
+| `underline` | `<u>…</u>` |
+| `highlight` | `<mark>…</mark>` |
+| `superscript` | `<sup>…</sup>` |
+| `subscript` | `<sub>…</sub>` |
+| `spoilered_text` | `<span class="spoiler">…</span>` |
+| `code` | `<code>…</code>` |
+| `link` | `<a href="{url}" title="{title}">…</a>` |
+| `image` | `<img src="{url}" alt="…" title="{title}" />` |
+| `wikilink` | `<a href="{url}" data-wikilink="true">…</a>` (configurable) |
+| `footnote_reference` | `<sup><a href="#fn-{name}">[{n}]</a></sup>` |
+| `shortcode` | Emoji character directly |
+| `math` (inline) | `<code class="math math-inline">…</code>` |
+| `math` (display) | `<pre><code class="math math-display">…</code></pre>` |
+| `html_inline` | Raw passthrough |
+| `escaped` | Skipped |
+| `escaped_tag` | HTML-escaped value |
+
+## Supported AST Node Types
+
+46 node types total, matching the `flatmarkdown` Rust crate output.
+
+**Block (23):** `document`, `paragraph`, `heading`, `code_block`, `block_quote`, `multiline_block_quote`, `list`, `item`, `task_item`, `table`, `table_row`, `table_cell`, `thematic_break`, `html_block`, `footnote_definition`, `description_list`, `description_item`, `description_term`, `description_details`, `alert`, `front_matter`, `heex_block`, `subtext`
+
+**Inline (23):** `text`, `softbreak`, `linebreak`, `emph`, `strong`, `strikethrough`, `underline`, `highlight`, `superscript`, `subscript`, `spoilered_text`, `code`, `link`, `image`, `footnote_reference`, `shortcode`, `math`, `html_inline`, `heex_inline`, `raw`, `escaped`, `escaped_tag`, `wikilink`
+
+All node types are exported as individual TypeScript interfaces, plus the `AstNode` discriminated union.
+
+## Build
+
+```bash
+bun install
+bun run build   # outputs dist/ with ESM, CJS, and .d.ts
+bun test        # runs vitest
+```
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,241 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  renderToHtml: () => renderToHtml
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/renderer.ts
+function defaultContext(options = {}) {
+  return {
+    options,
+    inHeaderRow: false,
+    tableAlignments: [],
+    cellIndex: 0,
+    tightList: false
+  };
+}
+function escapeHtml(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function renderChildren(node, ctx) {
+  if (!node.children) return "";
+  return node.children.map((child) => renderNode(child, ctx)).join("");
+}
+function extractText(node) {
+  if (node.type === "text") return node.value;
+  if ("children" in node && node.children) {
+    return node.children.map(extractText).join("");
+  }
+  return "";
+}
+function renderNode(node, ctx) {
+  switch (node.type) {
+    // ── Block Nodes ──
+    case "document":
+      return renderChildren(node, ctx);
+    case "paragraph": {
+      const inner = renderChildren(node, ctx);
+      if (ctx.tightList) return `${inner}
+`;
+      return `<p>${inner}</p>
+`;
+    }
+    case "heading": {
+      const tag = `h${node.level}`;
+      return `<${tag}>${renderChildren(node, ctx)}</${tag}>
+`;
+    }
+    case "code_block": {
+      const info = node.info;
+      const cls = info ? ` class="language-${escapeHtml(info)}"` : "";
+      return `<pre><code${cls}>${escapeHtml(node.literal)}</code></pre>
+`;
+    }
+    case "block_quote":
+      return `<blockquote>
+${renderChildren(node, ctx)}</blockquote>
+`;
+    case "multiline_block_quote":
+      return `<blockquote>
+${renderChildren(node, ctx)}</blockquote>
+`;
+    case "list": {
+      if (node.list_type === "ordered") {
+        const startAttr = node.start != null && node.start !== 1 ? ` start="${node.start}"` : "";
+        return `<ol${startAttr}>
+${renderChildren(node, ctx)}</ol>
+`;
+      }
+      return `<ul>
+${renderChildren(node, ctx)}</ul>
+`;
+    }
+    case "item": {
+      const childCtx = { ...ctx, tightList: node.tight };
+      return `<li>${renderChildren(node, childCtx)}</li>
+`;
+    }
+    case "task_item": {
+      const checked = node.symbol != null ? ' checked=""' : "";
+      const childCtx = { ...ctx, tightList: true };
+      return `<li><input type="checkbox"${checked} disabled="" />${renderChildren(node, childCtx)}</li>
+`;
+    }
+    case "table": {
+      const childCtx = { ...ctx, tableAlignments: node.alignments };
+      return `<table>
+${renderChildren(node, childCtx)}</table>
+`;
+    }
+    case "table_row": {
+      const cells = (node.children || []).map((cell, i) => {
+        const cellCtx = {
+          ...ctx,
+          inHeaderRow: node.header,
+          cellIndex: i
+        };
+        return renderNode(cell, cellCtx);
+      });
+      return `<tr>
+${cells.join("")}</tr>
+`;
+    }
+    case "table_cell": {
+      const tag = ctx.inHeaderRow ? "th" : "td";
+      const alignment = ctx.tableAlignments[ctx.cellIndex];
+      const alignAttr = alignment && alignment !== "none" ? ` align="${alignment}"` : "";
+      return `<${tag}${alignAttr}>${renderChildren(node, ctx)}</${tag}>
+`;
+    }
+    case "thematic_break":
+      return "<hr />\n";
+    case "html_block":
+      return node.literal;
+    case "footnote_definition":
+      return `<div class="footnote" id="fn-${escapeHtml(node.name)}">
+${renderChildren(node, ctx)}</div>
+`;
+    case "description_list":
+      return `<dl>
+${renderChildren(node, ctx)}</dl>
+`;
+    case "description_item":
+      return renderChildren(node, ctx);
+    case "description_term":
+      return `<dt>${renderChildren(node, ctx)}</dt>
+`;
+    case "description_details":
+      return `<dd>${renderChildren(node, ctx)}</dd>
+`;
+    case "alert":
+      return `<div class="alert alert-${escapeHtml(node.alert_type)}">
+${renderChildren(node, ctx)}</div>
+`;
+    case "front_matter":
+      return "";
+    case "heex_block":
+      return renderChildren(node, ctx);
+    case "subtext":
+      return renderChildren(node, ctx);
+    // ── Inline Nodes ──
+    case "text":
+      return escapeHtml(node.value);
+    case "softbreak":
+      return "\n";
+    case "linebreak":
+      return "<br />\n";
+    case "emph":
+      return `<em>${renderChildren(node, ctx)}</em>`;
+    case "strong":
+      return `<strong>${renderChildren(node, ctx)}</strong>`;
+    case "strikethrough":
+      return `<del>${renderChildren(node, ctx)}</del>`;
+    case "underline":
+      return `<u>${renderChildren(node, ctx)}</u>`;
+    case "highlight":
+      return `<mark>${renderChildren(node, ctx)}</mark>`;
+    case "superscript":
+      return `<sup>${renderChildren(node, ctx)}</sup>`;
+    case "subscript":
+      return `<sub>${renderChildren(node, ctx)}</sub>`;
+    case "spoilered_text":
+      return `<span class="spoiler">${renderChildren(node, ctx)}</span>`;
+    case "code":
+      return `<code>${escapeHtml(node.literal)}</code>`;
+    case "link": {
+      const titleAttr = node.title ? ` title="${escapeHtml(node.title)}"` : "";
+      return `<a href="${escapeHtml(node.url)}"${titleAttr}>${renderChildren(node, ctx)}</a>`;
+    }
+    case "image": {
+      const alt = extractText(node);
+      const titleAttr = node.title ? ` title="${escapeHtml(node.title)}"` : "";
+      return `<img src="${escapeHtml(node.url)}" alt="${escapeHtml(alt)}"${titleAttr} />`;
+    }
+    case "wikilink": {
+      const opts = ctx.options.wikilink;
+      const tagName = opts?.tagName ?? "a";
+      const urlAttr = opts?.urlAttr ?? "href";
+      const urlPrefix = opts?.urlPrefix ?? "";
+      const extraAttrs = opts?.attrs ?? { "data-wikilink": "true" };
+      const url = `${urlPrefix}${node.url}`;
+      let attrStr = `${urlAttr}="${escapeHtml(url)}"`;
+      for (const [key, val] of Object.entries(extraAttrs)) {
+        attrStr += ` ${key}="${escapeHtml(val)}"`;
+      }
+      return `<${tagName} ${attrStr}>${renderChildren(node, ctx)}</${tagName}>`;
+    }
+    case "footnote_reference":
+      return `<sup><a href="#fn-${escapeHtml(node.name)}">[${node.ix + 1}]</a></sup>`;
+    case "shortcode":
+      return node.emoji;
+    case "math": {
+      if (node.display_math) {
+        return `<pre><code class="math math-display">${escapeHtml(node.literal)}</code></pre>
+`;
+      }
+      return `<code class="math math-inline">${escapeHtml(node.literal)}</code>`;
+    }
+    case "html_inline":
+      return node.value;
+    case "heex_inline":
+      return node.value;
+    case "raw":
+      return node.value;
+    case "escaped":
+      return "";
+    case "escaped_tag":
+      return escapeHtml(node.value);
+    default: {
+      const _exhaustive = node;
+      return "";
+    }
+  }
+}
+function renderToHtml(ast, options) {
+  const node = typeof ast === "string" ? JSON.parse(ast) : ast;
+  return renderNode(node, defaultContext(options));
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  renderToHtml
+});

package/dist/index.d.cts

@@ -0,0 +1,235 @@
+interface DocumentNode {
+    type: 'document';
+    children?: AstNode[];
+}
+interface ParagraphNode {
+    type: 'paragraph';
+    children?: AstNode[];
+}
+interface HeadingNode {
+    type: 'heading';
+    level: number;
+    setext: boolean;
+    children?: AstNode[];
+}
+interface CodeBlockNode {
+    type: 'code_block';
+    fenced: boolean;
+    info: string;
+    literal: string;
+}
+interface BlockQuoteNode {
+    type: 'block_quote';
+    children?: AstNode[];
+}
+interface MultilineBlockQuoteNode {
+    type: 'multiline_block_quote';
+    children?: AstNode[];
+}
+interface ListNode {
+    type: 'list';
+    list_type: string;
+    start: number | null;
+    tight: boolean;
+    delimiter: string;
+    children?: AstNode[];
+}
+interface ItemNode {
+    type: 'item';
+    list_type: string;
+    start: number;
+    tight: boolean;
+    children?: AstNode[];
+}
+interface TaskItemNode {
+    type: 'task_item';
+    symbol: string | null;
+    children?: AstNode[];
+}
+interface TableNode {
+    type: 'table';
+    alignments: string[];
+    num_columns: number;
+    num_rows: number;
+    children?: AstNode[];
+}
+interface TableRowNode {
+    type: 'table_row';
+    header: boolean;
+    children?: AstNode[];
+}
+interface TableCellNode {
+    type: 'table_cell';
+    children?: AstNode[];
+}
+interface ThematicBreakNode {
+    type: 'thematic_break';
+}
+interface HtmlBlockNode {
+    type: 'html_block';
+    block_type: number;
+    literal: string;
+}
+interface FootnoteDefinitionNode {
+    type: 'footnote_definition';
+    name: string;
+    children?: AstNode[];
+}
+interface DescriptionListNode {
+    type: 'description_list';
+    children?: AstNode[];
+}
+interface DescriptionItemNode {
+    type: 'description_item';
+    children?: AstNode[];
+}
+interface DescriptionTermNode {
+    type: 'description_term';
+    children?: AstNode[];
+}
+interface DescriptionDetailsNode {
+    type: 'description_details';
+    children?: AstNode[];
+}
+interface AlertNode {
+    type: 'alert';
+    alert_type: string;
+    title: string | null;
+    children?: AstNode[];
+}
+interface FrontMatterNode {
+    type: 'front_matter';
+    value: string;
+}
+interface HeexBlockNode {
+    type: 'heex_block';
+    children?: AstNode[];
+}
+interface SubtextNode {
+    type: 'subtext';
+    children?: AstNode[];
+}
+interface TextNode {
+    type: 'text';
+    value: string;
+}
+interface SoftbreakNode {
+    type: 'softbreak';
+}
+interface LinebreakNode {
+    type: 'linebreak';
+}
+interface EmphNode {
+    type: 'emph';
+    children?: AstNode[];
+}
+interface StrongNode {
+    type: 'strong';
+    children?: AstNode[];
+}
+interface StrikethroughNode {
+    type: 'strikethrough';
+    children?: AstNode[];
+}
+interface UnderlineNode {
+    type: 'underline';
+    children?: AstNode[];
+}
+interface HighlightNode {
+    type: 'highlight';
+    children?: AstNode[];
+}
+interface SuperscriptNode {
+    type: 'superscript';
+    children?: AstNode[];
+}
+interface SubscriptNode {
+    type: 'subscript';
+    children?: AstNode[];
+}
+interface SpoileredTextNode {
+    type: 'spoilered_text';
+    children?: AstNode[];
+}
+interface CodeNode {
+    type: 'code';
+    literal: string;
+}
+interface LinkNode {
+    type: 'link';
+    url: string;
+    title: string;
+    children?: AstNode[];
+}
+interface ImageNode {
+    type: 'image';
+    url: string;
+    title: string;
+    children?: AstNode[];
+}
+interface FootnoteReferenceNode {
+    type: 'footnote_reference';
+    name: string;
+    ref_num: number;
+    ix: number;
+}
+interface ShortcodeNode {
+    type: 'shortcode';
+    code: string;
+    emoji: string;
+}
+interface MathNode {
+    type: 'math';
+    dollar_math: boolean;
+    display_math: boolean;
+    literal: string;
+}
+interface HtmlInlineNode {
+    type: 'html_inline';
+    value: string;
+}
+interface HeexInlineNode {
+    type: 'heex_inline';
+    value: string;
+}
+interface RawNode {
+    type: 'raw';
+    value: string;
+}
+interface EscapedNode {
+    type: 'escaped';
+}
+interface EscapedTagNode {
+    type: 'escaped_tag';
+    value: string;
+}
+interface WikilinkNode {
+    type: 'wikilink';
+    url: string;
+    children?: AstNode[];
+}
+type AstNode = DocumentNode | ParagraphNode | HeadingNode | CodeBlockNode | BlockQuoteNode | MultilineBlockQuoteNode | ListNode | ItemNode | TaskItemNode | TableNode | TableRowNode | TableCellNode | ThematicBreakNode | HtmlBlockNode | FootnoteDefinitionNode | DescriptionListNode | DescriptionItemNode | DescriptionTermNode | DescriptionDetailsNode | AlertNode | FrontMatterNode | HeexBlockNode | SubtextNode | TextNode | SoftbreakNode | LinebreakNode | EmphNode | StrongNode | StrikethroughNode | UnderlineNode | HighlightNode | SuperscriptNode | SubscriptNode | SpoileredTextNode | CodeNode | LinkNode | ImageNode | FootnoteReferenceNode | ShortcodeNode | MathNode | HtmlInlineNode | HeexInlineNode | RawNode | EscapedNode | EscapedTagNode | WikilinkNode;
+interface WikiLinkOptions {
+    /** Tag name. Default: 'a'. Use 'Link' for React Router, etc. */
+    tagName?: string;
+    /** URL attribute name. Default: 'href'. Use 'to' for React Router, etc. */
+    urlAttr?: string;
+    /** Prefix prepended to the wikilink url. Default: '' */
+    urlPrefix?: string;
+    /** Extra attributes added to the tag. Default: { 'data-wikilink': 'true' } */
+    attrs?: Record<string, string>;
+}
+interface RenderOptions {
+    wikilink?: WikiLinkOptions;
+}
+
+/**
+ * Render a flatmarkdown AST to HTML.
+ *
+ * @param ast - Either a parsed AstNode object or a JSON string of the AST
+ * @param options - Rendering options (e.g. wikilink customization)
+ * @returns HTML string
+ */
+declare function renderToHtml(ast: AstNode | string, options?: RenderOptions): string;
+
+export { type AlertNode, type AstNode, type BlockQuoteNode, type CodeBlockNode, type CodeNode, type DescriptionDetailsNode, type DescriptionItemNode, type DescriptionListNode, type DescriptionTermNode, type DocumentNode, type EmphNode, type EscapedNode, type EscapedTagNode, type FootnoteDefinitionNode, type FootnoteReferenceNode, type FrontMatterNode, type HeadingNode, type HeexBlockNode, type HeexInlineNode, type HighlightNode, type HtmlBlockNode, type HtmlInlineNode, type ImageNode, type ItemNode, type LinebreakNode, type LinkNode, type ListNode, type MathNode, type MultilineBlockQuoteNode, type ParagraphNode, type RawNode, type RenderOptions, type ShortcodeNode, type SoftbreakNode, type SpoileredTextNode, type StrikethroughNode, type StrongNode, type SubscriptNode, type SubtextNode, type SuperscriptNode, type TableCellNode, type TableNode, type TableRowNode, type TaskItemNode, type TextNode, type ThematicBreakNode, type UnderlineNode, type WikiLinkOptions, type WikilinkNode, renderToHtml };

package/dist/index.d.ts

@@ -0,0 +1,235 @@
+interface DocumentNode {
+    type: 'document';
+    children?: AstNode[];
+}
+interface ParagraphNode {
+    type: 'paragraph';
+    children?: AstNode[];
+}
+interface HeadingNode {
+    type: 'heading';
+    level: number;
+    setext: boolean;
+    children?: AstNode[];
+}
+interface CodeBlockNode {
+    type: 'code_block';
+    fenced: boolean;
+    info: string;
+    literal: string;
+}
+interface BlockQuoteNode {
+    type: 'block_quote';
+    children?: AstNode[];
+}
+interface MultilineBlockQuoteNode {
+    type: 'multiline_block_quote';
+    children?: AstNode[];
+}
+interface ListNode {
+    type: 'list';
+    list_type: string;
+    start: number | null;
+    tight: boolean;
+    delimiter: string;
+    children?: AstNode[];
+}
+interface ItemNode {
+    type: 'item';
+    list_type: string;
+    start: number;
+    tight: boolean;
+    children?: AstNode[];
+}
+interface TaskItemNode {
+    type: 'task_item';
+    symbol: string | null;
+    children?: AstNode[];
+}
+interface TableNode {
+    type: 'table';
+    alignments: string[];
+    num_columns: number;
+    num_rows: number;
+    children?: AstNode[];
+}
+interface TableRowNode {
+    type: 'table_row';
+    header: boolean;
+    children?: AstNode[];
+}
+interface TableCellNode {
+    type: 'table_cell';
+    children?: AstNode[];
+}
+interface ThematicBreakNode {
+    type: 'thematic_break';
+}
+interface HtmlBlockNode {
+    type: 'html_block';
+    block_type: number;
+    literal: string;
+}
+interface FootnoteDefinitionNode {
+    type: 'footnote_definition';
+    name: string;
+    children?: AstNode[];
+}
+interface DescriptionListNode {
+    type: 'description_list';
+    children?: AstNode[];
+}
+interface DescriptionItemNode {
+    type: 'description_item';
+    children?: AstNode[];
+}
+interface DescriptionTermNode {
+    type: 'description_term';
+    children?: AstNode[];
+}
+interface DescriptionDetailsNode {
+    type: 'description_details';
+    children?: AstNode[];
+}
+interface AlertNode {
+    type: 'alert';
+    alert_type: string;
+    title: string | null;
+    children?: AstNode[];
+}
+interface FrontMatterNode {
+    type: 'front_matter';
+    value: string;
+}
+interface HeexBlockNode {
+    type: 'heex_block';
+    children?: AstNode[];
+}
+interface SubtextNode {
+    type: 'subtext';
+    children?: AstNode[];
+}
+interface TextNode {
+    type: 'text';
+    value: string;
+}
+interface SoftbreakNode {
+    type: 'softbreak';
+}
+interface LinebreakNode {
+    type: 'linebreak';
+}
+interface EmphNode {
+    type: 'emph';
+    children?: AstNode[];
+}
+interface StrongNode {
+    type: 'strong';
+    children?: AstNode[];
+}
+interface StrikethroughNode {
+    type: 'strikethrough';
+    children?: AstNode[];
+}
+interface UnderlineNode {
+    type: 'underline';
+    children?: AstNode[];
+}
+interface HighlightNode {
+    type: 'highlight';
+    children?: AstNode[];
+}
+interface SuperscriptNode {
+    type: 'superscript';
+    children?: AstNode[];
+}
+interface SubscriptNode {
+    type: 'subscript';
+    children?: AstNode[];
+}
+interface SpoileredTextNode {
+    type: 'spoilered_text';
+    children?: AstNode[];
+}
+interface CodeNode {
+    type: 'code';
+    literal: string;
+}
+interface LinkNode {
+    type: 'link';
+    url: string;
+    title: string;
+    children?: AstNode[];
+}
+interface ImageNode {
+    type: 'image';
+    url: string;
+    title: string;
+    children?: AstNode[];
+}
+interface FootnoteReferenceNode {
+    type: 'footnote_reference';
+    name: string;
+    ref_num: number;
+    ix: number;
+}
+interface ShortcodeNode {
+    type: 'shortcode';
+    code: string;
+    emoji: string;
+}
+interface MathNode {
+    type: 'math';
+    dollar_math: boolean;
+    display_math: boolean;
+    literal: string;
+}
+interface HtmlInlineNode {
+    type: 'html_inline';
+    value: string;
+}
+interface HeexInlineNode {
+    type: 'heex_inline';
+    value: string;
+}
+interface RawNode {
+    type: 'raw';
+    value: string;
+}
+interface EscapedNode {
+    type: 'escaped';
+}
+interface EscapedTagNode {
+    type: 'escaped_tag';
+    value: string;
+}
+interface WikilinkNode {
+    type: 'wikilink';
+    url: string;
+    children?: AstNode[];
+}
+type AstNode = DocumentNode | ParagraphNode | HeadingNode | CodeBlockNode | BlockQuoteNode | MultilineBlockQuoteNode | ListNode | ItemNode | TaskItemNode | TableNode | TableRowNode | TableCellNode | ThematicBreakNode | HtmlBlockNode | FootnoteDefinitionNode | DescriptionListNode | DescriptionItemNode | DescriptionTermNode | DescriptionDetailsNode | AlertNode | FrontMatterNode | HeexBlockNode | SubtextNode | TextNode | SoftbreakNode | LinebreakNode | EmphNode | StrongNode | StrikethroughNode | UnderlineNode | HighlightNode | SuperscriptNode | SubscriptNode | SpoileredTextNode | CodeNode | LinkNode | ImageNode | FootnoteReferenceNode | ShortcodeNode | MathNode | HtmlInlineNode | HeexInlineNode | RawNode | EscapedNode | EscapedTagNode | WikilinkNode;
+interface WikiLinkOptions {
+    /** Tag name. Default: 'a'. Use 'Link' for React Router, etc. */
+    tagName?: string;
+    /** URL attribute name. Default: 'href'. Use 'to' for React Router, etc. */
+    urlAttr?: string;
+    /** Prefix prepended to the wikilink url. Default: '' */
+    urlPrefix?: string;
+    /** Extra attributes added to the tag. Default: { 'data-wikilink': 'true' } */
+    attrs?: Record<string, string>;
+}
+interface RenderOptions {
+    wikilink?: WikiLinkOptions;
+}
+
+/**
+ * Render a flatmarkdown AST to HTML.
+ *
+ * @param ast - Either a parsed AstNode object or a JSON string of the AST
+ * @param options - Rendering options (e.g. wikilink customization)
+ * @returns HTML string
+ */
+declare function renderToHtml(ast: AstNode | string, options?: RenderOptions): string;
+
+export { type AlertNode, type AstNode, type BlockQuoteNode, type CodeBlockNode, type CodeNode, type DescriptionDetailsNode, type DescriptionItemNode, type DescriptionListNode, type DescriptionTermNode, type DocumentNode, type EmphNode, type EscapedNode, type EscapedTagNode, type FootnoteDefinitionNode, type FootnoteReferenceNode, type FrontMatterNode, type HeadingNode, type HeexBlockNode, type HeexInlineNode, type HighlightNode, type HtmlBlockNode, type HtmlInlineNode, type ImageNode, type ItemNode, type LinebreakNode, type LinkNode, type ListNode, type MathNode, type MultilineBlockQuoteNode, type ParagraphNode, type RawNode, type RenderOptions, type ShortcodeNode, type SoftbreakNode, type SpoileredTextNode, type StrikethroughNode, type StrongNode, type SubscriptNode, type SubtextNode, type SuperscriptNode, type TableCellNode, type TableNode, type TableRowNode, type TaskItemNode, type TextNode, type ThematicBreakNode, type UnderlineNode, type WikiLinkOptions, type WikilinkNode, renderToHtml };

package/dist/index.js

@@ -0,0 +1,214 @@
+// src/renderer.ts
+function defaultContext(options = {}) {
+  return {
+    options,
+    inHeaderRow: false,
+    tableAlignments: [],
+    cellIndex: 0,
+    tightList: false
+  };
+}
+function escapeHtml(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function renderChildren(node, ctx) {
+  if (!node.children) return "";
+  return node.children.map((child) => renderNode(child, ctx)).join("");
+}
+function extractText(node) {
+  if (node.type === "text") return node.value;
+  if ("children" in node && node.children) {
+    return node.children.map(extractText).join("");
+  }
+  return "";
+}
+function renderNode(node, ctx) {
+  switch (node.type) {
+    // ── Block Nodes ──
+    case "document":
+      return renderChildren(node, ctx);
+    case "paragraph": {
+      const inner = renderChildren(node, ctx);
+      if (ctx.tightList) return `${inner}
+`;
+      return `<p>${inner}</p>
+`;
+    }
+    case "heading": {
+      const tag = `h${node.level}`;
+      return `<${tag}>${renderChildren(node, ctx)}</${tag}>
+`;
+    }
+    case "code_block": {
+      const info = node.info;
+      const cls = info ? ` class="language-${escapeHtml(info)}"` : "";
+      return `<pre><code${cls}>${escapeHtml(node.literal)}</code></pre>
+`;
+    }
+    case "block_quote":
+      return `<blockquote>
+${renderChildren(node, ctx)}</blockquote>
+`;
+    case "multiline_block_quote":
+      return `<blockquote>
+${renderChildren(node, ctx)}</blockquote>
+`;
+    case "list": {
+      if (node.list_type === "ordered") {
+        const startAttr = node.start != null && node.start !== 1 ? ` start="${node.start}"` : "";
+        return `<ol${startAttr}>
+${renderChildren(node, ctx)}</ol>
+`;
+      }
+      return `<ul>
+${renderChildren(node, ctx)}</ul>
+`;
+    }
+    case "item": {
+      const childCtx = { ...ctx, tightList: node.tight };
+      return `<li>${renderChildren(node, childCtx)}</li>
+`;
+    }
+    case "task_item": {
+      const checked = node.symbol != null ? ' checked=""' : "";
+      const childCtx = { ...ctx, tightList: true };
+      return `<li><input type="checkbox"${checked} disabled="" />${renderChildren(node, childCtx)}</li>
+`;
+    }
+    case "table": {
+      const childCtx = { ...ctx, tableAlignments: node.alignments };
+      return `<table>
+${renderChildren(node, childCtx)}</table>
+`;
+    }
+    case "table_row": {
+      const cells = (node.children || []).map((cell, i) => {
+        const cellCtx = {
+          ...ctx,
+          inHeaderRow: node.header,
+          cellIndex: i
+        };
+        return renderNode(cell, cellCtx);
+      });
+      return `<tr>
+${cells.join("")}</tr>
+`;
+    }
+    case "table_cell": {
+      const tag = ctx.inHeaderRow ? "th" : "td";
+      const alignment = ctx.tableAlignments[ctx.cellIndex];
+      const alignAttr = alignment && alignment !== "none" ? ` align="${alignment}"` : "";
+      return `<${tag}${alignAttr}>${renderChildren(node, ctx)}</${tag}>
+`;
+    }
+    case "thematic_break":
+      return "<hr />\n";
+    case "html_block":
+      return node.literal;
+    case "footnote_definition":
+      return `<div class="footnote" id="fn-${escapeHtml(node.name)}">
+${renderChildren(node, ctx)}</div>
+`;
+    case "description_list":
+      return `<dl>
+${renderChildren(node, ctx)}</dl>
+`;
+    case "description_item":
+      return renderChildren(node, ctx);
+    case "description_term":
+      return `<dt>${renderChildren(node, ctx)}</dt>
+`;
+    case "description_details":
+      return `<dd>${renderChildren(node, ctx)}</dd>
+`;
+    case "alert":
+      return `<div class="alert alert-${escapeHtml(node.alert_type)}">
+${renderChildren(node, ctx)}</div>
+`;
+    case "front_matter":
+      return "";
+    case "heex_block":
+      return renderChildren(node, ctx);
+    case "subtext":
+      return renderChildren(node, ctx);
+    // ── Inline Nodes ──
+    case "text":
+      return escapeHtml(node.value);
+    case "softbreak":
+      return "\n";
+    case "linebreak":
+      return "<br />\n";
+    case "emph":
+      return `<em>${renderChildren(node, ctx)}</em>`;
+    case "strong":
+      return `<strong>${renderChildren(node, ctx)}</strong>`;
+    case "strikethrough":
+      return `<del>${renderChildren(node, ctx)}</del>`;
+    case "underline":
+      return `<u>${renderChildren(node, ctx)}</u>`;
+    case "highlight":
+      return `<mark>${renderChildren(node, ctx)}</mark>`;
+    case "superscript":
+      return `<sup>${renderChildren(node, ctx)}</sup>`;
+    case "subscript":
+      return `<sub>${renderChildren(node, ctx)}</sub>`;
+    case "spoilered_text":
+      return `<span class="spoiler">${renderChildren(node, ctx)}</span>`;
+    case "code":
+      return `<code>${escapeHtml(node.literal)}</code>`;
+    case "link": {
+      const titleAttr = node.title ? ` title="${escapeHtml(node.title)}"` : "";
+      return `<a href="${escapeHtml(node.url)}"${titleAttr}>${renderChildren(node, ctx)}</a>`;
+    }
+    case "image": {
+      const alt = extractText(node);
+      const titleAttr = node.title ? ` title="${escapeHtml(node.title)}"` : "";
+      return `<img src="${escapeHtml(node.url)}" alt="${escapeHtml(alt)}"${titleAttr} />`;
+    }
+    case "wikilink": {
+      const opts = ctx.options.wikilink;
+      const tagName = opts?.tagName ?? "a";
+      const urlAttr = opts?.urlAttr ?? "href";
+      const urlPrefix = opts?.urlPrefix ?? "";
+      const extraAttrs = opts?.attrs ?? { "data-wikilink": "true" };
+      const url = `${urlPrefix}${node.url}`;
+      let attrStr = `${urlAttr}="${escapeHtml(url)}"`;
+      for (const [key, val] of Object.entries(extraAttrs)) {
+        attrStr += ` ${key}="${escapeHtml(val)}"`;
+      }
+      return `<${tagName} ${attrStr}>${renderChildren(node, ctx)}</${tagName}>`;
+    }
+    case "footnote_reference":
+      return `<sup><a href="#fn-${escapeHtml(node.name)}">[${node.ix + 1}]</a></sup>`;
+    case "shortcode":
+      return node.emoji;
+    case "math": {
+      if (node.display_math) {
+        return `<pre><code class="math math-display">${escapeHtml(node.literal)}</code></pre>
+`;
+      }
+      return `<code class="math math-inline">${escapeHtml(node.literal)}</code>`;
+    }
+    case "html_inline":
+      return node.value;
+    case "heex_inline":
+      return node.value;
+    case "raw":
+      return node.value;
+    case "escaped":
+      return "";
+    case "escaped_tag":
+      return escapeHtml(node.value);
+    default: {
+      const _exhaustive = node;
+      return "";
+    }
+  }
+}
+function renderToHtml(ast, options) {
+  const node = typeof ast === "string" ? JSON.parse(ast) : ast;
+  return renderNode(node, defaultContext(options));
+}
+export {
+  renderToHtml
+};

package/package.json

@@ -0,0 +1,46 @@
+{
+    "name": "flatmarkdown-ast2html",
+    "version": "0.1.0",
+    "description": "A library to convert FlatMarkdown AST to HTML.",
+    "type": "module",
+    "main": "./dist/index.cjs",
+    "module": "./dist/index.js",
+    "types": "./dist/index.d.ts",
+    "files": [
+        "dist"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/petajournal/flatmarkdown-ast2html.git"
+    },
+    "bugs": {
+        "url": "https://github.com/petajournal/flatmarkdown-ast2html/issues"
+    },
+    "homepage": "https://github.com/petajournal/flatmarkdown-ast2html#readme",
+    "exports": {
+        ".": {
+            "types": "./dist/index.d.ts",
+            "import": "./dist/index.js",
+            "require": "./dist/index.cjs"
+        }
+    },
+    "scripts": {
+        "build": "tsup",
+        "test": "vitest run",
+        "prepublishOnly": "npm run build"
+    },
+    "keywords": [
+        "flatmarkdown",
+        "ast",
+        "html",
+        "markdown",
+        "parser"
+    ],
+    "author": "Hidekazu Kubota",
+    "license": "MIT",
+    "devDependencies": {
+        "tsup": "^8.0.0",
+        "vitest": "^3.0.0",
+        "typescript": "^5.0.0"
+    }
+}