@paroicms/markdown-to-tiptap-json 0.2.0

package/README.md

@@ -0,0 +1,112 @@
+# @paroicms/markdown-to-tiptap-json
+
+A lightweight JavaScript/TypeScript library for converting Markdown to Tiptap JSON format **without loading the Tiptap editor**. This package uses `markdown-it` for parsing, making it efficient and suitable for server-side operations where you need to convert Markdown to Tiptap JSON without the overhead of loading the full editor.
+
+## Installation
+
+```bash
+npm install @paroicms/markdown-to-tiptap-json
+```
+
+## Usage
+
+```typescript
+import { convertMarkdownToTiptap } from "@paroicms/markdown-to-tiptap-json";
+
+const markdown = `# Hello World
+
+This is a paragraph with **bold** and *italic* text.
+
+- List item 1
+- List item 2
+- List item 3`;
+
+const { result, issues } = convertMarkdownToTiptap(markdown);
+
+console.log(JSON.stringify(result, null, 2));
+// {
+//   "type": "doc",
+//   "content": [
+//     {
+//       "type": "heading",
+//       "attrs": { "level": 1 },
+//       "content": [{ "type": "text", "text": "Hello World" }]
+//     },
+//     {
+//       "type": "paragraph",
+//       "content": [
+//         { "type": "text", "text": "This is a paragraph with " },
+//         { "type": "text", "text": "bold", "marks": [{ "type": "bold" }] },
+//         { "type": "text", "text": " and " },
+//         { "type": "text", "text": "italic", "marks": [{ "type": "italic" }] },
+//         { "type": "text", "text": " text." }
+//       ]
+//     },
+//     {
+//       "type": "bulletList",
+//       "content": [
+//         { "type": "listItem", "content": [...] },
+//         { "type": "listItem", "content": [...] },
+//         { "type": "listItem", "content": [...] }
+//       ]
+//     }
+//   ]
+// }
+
+// Check for any issues during conversion
+if (issues) {
+  console.warn("Conversion issues:", issues);
+}
+```
+
+## API
+
+### `convertMarkdownToTiptap(markdown: string): ConversionResult`
+
+Converts a Markdown string to Tiptap JSON format.
+
+**Parameters:**
+
+- `markdown`: The Markdown string to convert
+
+**Returns:** `ConversionResult` object containing:
+
+- `result`: The Tiptap JSON document (type `TiptapJsonValue`)
+- `issues` (optional): Array of warning messages for skipped or problematic content
+
+## Supported Markdown Features
+
+### Block Elements
+
+- **Headings**: `# H1` through `###### H6`
+- **Paragraphs**: Regular text blocks
+- **Blockquotes**: `> Quote text`
+- **Code blocks**: Fenced (` ``` `) and indented
+- **Horizontal rules**: `---`, `***`, or `___`
+- **Lists**: Bullet (`-`, `*`, `+`) and ordered (`1.`, `2.`, etc.)
+- **Nested lists**: Multi-level list structures
+- **Tables**: GitHub-flavored markdown tables
+
+### Inline Elements
+
+- **Bold**: `**bold**` or `__bold__`
+- **Italic**: `*italic*` or `_italic_`
+- **Strikethrough**: `~~strikethrough~~`
+- **Inline code**: `` `code` ``
+- **Links**: `[text](url)`
+- **Images**: `![alt](url)`
+- **Hard breaks**: Two spaces at end of line
+
+### Special Handling
+
+- **HTML blocks and inline HTML**: Skipped with warnings in `issues` array
+- **Empty documents**: Returns empty doc with no issues
+- **Malformed markdown**: Returns minimal valid doc with error in `issues`
+
+## License
+
+MIT
+
+## Related Packages
+
+This package can be used as a standalone library. It's also part of the ParoiCMS ecosystem. For more information, visit the [ParoiCMS repository](https://gitlab.com/paroi/opensource/paroicms).

package/dist/converter.d.ts

@@ -0,0 +1,6 @@
+import type { TiptapJsonValue } from "./types.js";
+export interface ConversionResult {
+    result: TiptapJsonValue;
+    issues?: string[];
+}
+export declare function convertMarkdownToTiptap(markdown: string): ConversionResult;

package/dist/converter.js

@@ -0,0 +1,291 @@
+import MarkdownIt from "markdown-it";
+export function convertMarkdownToTiptap(markdown) {
+    if (markdown === "") {
+        return { result: { type: "doc", content: [] } };
+    }
+    const md = new MarkdownIt({ html: true });
+    const issues = [];
+    try {
+        const tokens = md.parse(markdown, {});
+        const content = processTokens(tokens, issues);
+        return {
+            result: { type: "doc", content },
+            issues: issues.length > 0 ? issues : undefined,
+        };
+    }
+    catch (error) {
+        issues.push(`Failed to parse markdown: ${error instanceof Error ? error.message : String(error)}`);
+        return {
+            result: { type: "doc", content: [{ type: "paragraph" }] },
+            issues,
+        };
+    }
+}
+function processTokens(tokens, issues) {
+    const nodes = [];
+    let i = 0;
+    while (i < tokens.length) {
+        const token = tokens[i];
+        if (token.type === "heading_open") {
+            const level = Number.parseInt(token.tag.slice(1), 10);
+            const inlineToken = tokens[i + 1];
+            const content = inlineToken ? processInlineTokens(inlineToken.children ?? [], issues) : [];
+            nodes.push({ type: "heading", attrs: { level }, content });
+            i += 3; // Skip heading_open, inline, heading_close
+        }
+        else if (token.type === "paragraph_open") {
+            const inlineToken = tokens[i + 1];
+            const content = inlineToken ? processInlineTokens(inlineToken.children ?? [], issues) : [];
+            nodes.push({ type: "paragraph", content });
+            i += 3; // Skip paragraph_open, inline, paragraph_close
+        }
+        else if (token.type === "blockquote_open") {
+            const { node, consumed } = processBlockquote(tokens, i, issues);
+            nodes.push(node);
+            i += consumed;
+        }
+        else if (token.type === "bullet_list_open") {
+            const { node, consumed } = processList(tokens, i, "bulletList", issues);
+            nodes.push(node);
+            i += consumed;
+        }
+        else if (token.type === "ordered_list_open") {
+            const { node, consumed } = processList(tokens, i, "orderedList", issues);
+            nodes.push(node);
+            i += consumed;
+        }
+        else if (token.type === "hr") {
+            nodes.push({ type: "horizontalRule" });
+            ++i;
+        }
+        else if (token.type === "code_block" || token.type === "fence") {
+            const language = token.info || undefined;
+            const attrs = language ? { language } : undefined;
+            nodes.push({
+                type: "codeBlock",
+                attrs,
+                content: [{ type: "text", text: token.content }],
+            });
+            ++i;
+        }
+        else if (token.type === "table_open") {
+            const { node, consumed } = processTable(tokens, i, issues);
+            nodes.push(node);
+            i += consumed;
+        }
+        else if (token.type === "html_block") {
+            const preview = token.content.substring(0, 50);
+            issues.push(`Skipped HTML block: ${preview}${token.content.length > 50 ? "..." : ""}`);
+            ++i;
+        }
+        else {
+            ++i;
+        }
+    }
+    return nodes;
+}
+function processInlineTokens(tokens, issues) {
+    const nodes = [];
+    const marksStack = [];
+    for (let i = 0; i < tokens.length; ++i) {
+        const token = tokens[i];
+        if (token.type === "text") {
+            // Skip empty text tokens (they occur with nested formatting)
+            if (token.content === "")
+                continue;
+            nodes.push({
+                type: "text",
+                text: token.content,
+                marks: marksStack.length > 0 ? [...marksStack] : undefined,
+            });
+        }
+        else if (token.type === "code_inline") {
+            nodes.push({
+                type: "text",
+                text: token.content,
+                marks: [...marksStack, { type: "code" }],
+            });
+        }
+        else if (token.type === "hardbreak") {
+            nodes.push({ type: "hardBreak" });
+        }
+        else if (token.type === "strong_open") {
+            marksStack.push({ type: "bold" });
+        }
+        else if (token.type === "strong_close") {
+            removeMarkFromStack(marksStack, "bold");
+        }
+        else if (token.type === "em_open") {
+            marksStack.push({ type: "italic" });
+        }
+        else if (token.type === "em_close") {
+            removeMarkFromStack(marksStack, "italic");
+        }
+        else if (token.type === "s_open") {
+            marksStack.push({ type: "strike" });
+        }
+        else if (token.type === "s_close") {
+            removeMarkFromStack(marksStack, "strike");
+        }
+        else if (token.type === "link_open") {
+            const href = token.attrGet("href");
+            if (href) {
+                marksStack.push({ type: "link", attrs: { href } });
+            }
+        }
+        else if (token.type === "link_close") {
+            removeMarkFromStack(marksStack, "link");
+        }
+        else if (token.type === "image") {
+            const src = token.attrGet("src");
+            const alt = token.content || undefined;
+            if (src) {
+                const attrs = { src };
+                if (alt) {
+                    attrs.alt = alt;
+                }
+                nodes.push({ type: "image", attrs });
+            }
+        }
+        else if (token.type === "html_inline") {
+            const preview = token.content.substring(0, 50);
+            issues.push(`Skipped HTML inline: ${preview}${token.content.length > 50 ? "..." : ""}`);
+        }
+    }
+    return nodes;
+}
+function processBlockquote(tokens, startIndex, issues) {
+    let i = startIndex + 1; // Skip blockquote_open
+    const content = [];
+    while (i < tokens.length && tokens[i].type !== "blockquote_close") {
+        if (tokens[i].type === "paragraph_open") {
+            const inlineToken = tokens[i + 1];
+            const paragraphContent = inlineToken
+                ? processInlineTokens(inlineToken.children ?? [], issues)
+                : [];
+            content.push({ type: "paragraph", content: paragraphContent });
+            i += 3; // Skip paragraph_open, inline, paragraph_close
+        }
+        else {
+            ++i;
+        }
+    }
+    return {
+        node: { type: "blockquote", content },
+        consumed: i - startIndex + 1,
+    };
+}
+function processList(tokens, startIndex, listType, issues) {
+    let i = startIndex + 1; // Skip list_open
+    const content = [];
+    while (i < tokens.length &&
+        tokens[i].type !== "bullet_list_close" &&
+        tokens[i].type !== "ordered_list_close") {
+        if (tokens[i].type === "list_item_open") {
+            const { node, consumed } = processListItem(tokens, i, issues);
+            content.push(node);
+            i += consumed;
+        }
+        else {
+            ++i;
+        }
+    }
+    return {
+        node: { type: listType, content },
+        consumed: i - startIndex + 1,
+    };
+}
+function processListItem(tokens, startIndex, issues) {
+    let i = startIndex + 1; // Skip list_item_open
+    const content = [];
+    while (i < tokens.length && tokens[i].type !== "list_item_close") {
+        const token = tokens[i];
+        if (token.type === "paragraph_open") {
+            const inlineToken = tokens[i + 1];
+            const paragraphContent = inlineToken
+                ? processInlineTokens(inlineToken.children ?? [], issues)
+                : [];
+            content.push({ type: "paragraph", content: paragraphContent });
+            i += 3; // Skip paragraph_open, inline, paragraph_close
+        }
+        else if (token.type === "bullet_list_open") {
+            const { node, consumed } = processList(tokens, i, "bulletList", issues);
+            content.push(node);
+            i += consumed;
+        }
+        else if (token.type === "ordered_list_open") {
+            const { node, consumed } = processList(tokens, i, "orderedList", issues);
+            content.push(node);
+            i += consumed;
+        }
+        else {
+            ++i;
+        }
+    }
+    return {
+        node: { type: "listItem", content },
+        consumed: i - startIndex + 1,
+    };
+}
+function processTable(tokens, startIndex, issues) {
+    let i = startIndex + 1; // Skip table_open
+    const content = [];
+    while (i < tokens.length && tokens[i].type !== "table_close") {
+        if (tokens[i].type === "thead_open" || tokens[i].type === "tbody_open") {
+            const isHeader = tokens[i].type === "thead_open";
+            ++i; // Skip thead_open or tbody_open
+            while (i < tokens.length &&
+                tokens[i].type !== "thead_close" &&
+                tokens[i].type !== "tbody_close") {
+                if (tokens[i].type === "tr_open") {
+                    const { node, consumed } = processTableRow(tokens, i, isHeader, issues);
+                    content.push(node);
+                    i += consumed;
+                }
+                else {
+                    ++i;
+                }
+            }
+            ++i; // Skip thead_close or tbody_close
+        }
+        else {
+            ++i;
+        }
+    }
+    return {
+        node: { type: "table", content },
+        consumed: i - startIndex + 1,
+    };
+}
+function processTableRow(tokens, startIndex, isHeader, issues) {
+    let i = startIndex + 1; // Skip tr_open
+    const content = [];
+    while (i < tokens.length && tokens[i].type !== "tr_close") {
+        if (tokens[i].type === "th_open" || tokens[i].type === "td_open") {
+            const cellType = isHeader || tokens[i].type === "th_open" ? "tableHeader" : "tableCell";
+            const inlineToken = tokens[i + 1];
+            const cellContent = inlineToken
+                ? processInlineTokens(inlineToken.children ?? [], issues)
+                : [];
+            // Table cells must contain at least one paragraph
+            content.push({
+                type: cellType,
+                content: [{ type: "paragraph", content: cellContent }],
+            });
+            i += 3; // Skip th_open/td_open, inline, th_close/td_close
+        }
+        else {
+            ++i;
+        }
+    }
+    return {
+        node: { type: "tableRow", content },
+        consumed: i - startIndex + 1,
+    };
+}
+function removeMarkFromStack(marksStack, markType) {
+    const index = marksStack.findIndex((mark) => mark.type === markType);
+    if (index !== -1) {
+        marksStack.splice(index, 1);
+    }
+}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { convertMarkdownToTiptap } from "./converter.js";
+export type { ConversionResult } from "./converter.js";
+export type { TiptapJsonMark, TiptapJsonNode, TiptapJsonValue } from "./types.js";

package/dist/index.js

@@ -0,0 +1 @@
+export { convertMarkdownToTiptap } from "./converter.js";

package/dist/types.d.ts

@@ -0,0 +1,15 @@
+export interface TiptapJsonValue {
+    type: "doc";
+    content?: TiptapJsonNode[];
+}
+export interface TiptapJsonNode {
+    type: string;
+    attrs?: Record<string, any>;
+    content?: TiptapJsonNode[];
+    marks?: TiptapJsonMark[];
+    text?: string;
+}
+export interface TiptapJsonMark {
+    type: string;
+    attrs?: Record<string, any>;
+}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@paroicms/markdown-to-tiptap-json",
+  "version": "0.2.0",
+  "description": "Convert Markdown to Tiptap JSON",
+  "keywords": [
+    "markdown",
+    "tiptap",
+    "json",
+    "converter"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://gitlab.com/paroi/opensource/paroicms.git",
+    "directory": "packages/markdown-to-tiptap-json"
+  },
+  "author": "Paroi Team",
+  "license": "MIT",
+  "type": "module",
+  "main": "dist/index.js",
+  "typings": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "clear": "rimraf dist/*",
+    "dev": "tsc --watch --preserveWatchOutput",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {
+    "markdown-it": "~14.1.0"
+  },
+  "devDependencies": {
+    "@types/markdown-it": "~14.1.2",
+    "rimraf": "~6.0.1",
+    "typescript": "~5.9.3",
+    "vitest": "~3.2.4"
+  },
+  "files": [
+    "dist"
+  ]
+}