comark 0.0.1 → 0.1.0

package/dist/plugins/math.js

@@ -0,0 +1,263 @@
+import katex from 'katex';
+/**
+ * Render LaTeX math expression to HTML using KaTeX
+ *
+ * @param code LaTeX math expression
+ * @param displayMode Whether to render in display mode
+ * @param config KaTeX configuration
+ * @returns HTML string
+ *
+ * @example
+ * ```ts
+ * const html = renderMath('E = mc^2', false)
+ * const display = renderMath('x^2', true)
+ * ```
+ */
+export function renderMath(code, displayMode, config = {}) {
+    try {
+        const options = {
+            displayMode,
+            throwOnError: config.throwOnError ?? false,
+            ...config.options,
+        };
+        return katex.renderToString(code, options);
+    }
+    catch (error) {
+        console.error('Math rendering error:', error);
+        if (config.throwOnError) {
+            throw error;
+        }
+        return `<span class="math-error">${error instanceof Error ? error.message : 'Failed to render math'}</span>`;
+    }
+}
+/**
+ * Check if code is valid LaTeX math syntax
+ *
+ * @param code LaTeX math expression
+ * @returns true if valid, false otherwise
+ *
+ * @example
+ * ```ts
+ * validateMath('E = mc^2') // true
+ * validateMath('\\invalid') // false
+ * ```
+ */
+export function validateMath(code) {
+    try {
+        katex.renderToString(code, { throwOnError: true });
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+/**
+ * markdown-it plugin for inline display math ($$...$$)
+ * This handles $$...$$ within a paragraph (same line)
+ */
+function mathInlineDisplayRule(state, silent, _config) {
+    const start = state.pos;
+    const max = state.posMax;
+    // Check if we start with $$
+    if (start + 1 >= max)
+        return false;
+    if (state.src.charCodeAt(start) !== 0x24 /* $ */)
+        return false;
+    if (state.src.charCodeAt(start + 1) !== 0x24 /* $ */)
+        return false;
+    // Find closing $$
+    let pos = start + 2;
+    while (pos + 1 < max) {
+        // Stop at newline
+        if (state.src.charCodeAt(pos) === 0x0A /* \n */) {
+            return false;
+        }
+        // Check for $$
+        if (state.src.charCodeAt(pos) === 0x24 && state.src.charCodeAt(pos + 1) === 0x24) {
+            // Found closing $$
+            const content = state.src.slice(start + 2, pos);
+            if (!silent) {
+                const token = state.push('math_inline', 'math', 0);
+                token.content = content;
+                token.markup = '$$';
+                token.meta = { display: true }; // Mark as display mode
+            }
+            state.pos = pos + 2;
+            return true;
+        }
+        pos++;
+    }
+    return false;
+}
+/**
+ * markdown-it plugin for inline math ($...$)
+ */
+function mathInlineRule(state, silent, _config) {
+    const start = state.pos;
+    const max = state.posMax;
+    // Check if we start with $
+    if (state.src.charCodeAt(start) !== 0x24 /* $ */) {
+        return false;
+    }
+    // Don't match $$ (that's display math)
+    if (start + 1 < max && state.src.charCodeAt(start + 1) === 0x24) {
+        return false;
+    }
+    // Find closing $
+    let pos = start + 1;
+    let foundClose = false;
+    while (pos < max) {
+        const char = state.src.charCodeAt(pos);
+        // Stop at newline - $ must close on same line
+        if (char === 0x0A /* \n */) {
+            return false;
+        }
+        if (char === 0x24 /* $ */) {
+            // Found potential closing $
+            // Make sure it's not escaped, we have content (at least 1 char),
+            // it's not preceded by another $ (which would make it $$),
+            // and it's not followed by another $ (which would make it $$)
+            const hasContent = pos > start + 1;
+            const notEscaped = pos === start + 1 || state.src.charCodeAt(pos - 1) !== 0x5C; /* \ */
+            const notPrecededByDollar = pos === start + 1 || state.src.charCodeAt(pos - 1) !== 0x24;
+            const notFollowedByDollar = pos + 1 >= max || state.src.charCodeAt(pos + 1) !== 0x24;
+            if (hasContent && notEscaped && notPrecededByDollar && notFollowedByDollar) {
+                foundClose = true;
+                break;
+            }
+        }
+        pos++;
+    }
+    if (!foundClose) {
+        return false;
+    }
+    // Extract math content
+    const content = state.src.slice(start + 1, pos);
+    // Don't match if content looks like a price or number (starts with digits and contains "or" or ends at end of sentence)
+    if (/^\d/.test(content)) {
+        return false;
+    }
+    if (!silent) {
+        const token = state.push('math_inline', 'math', 0);
+        token.content = content;
+        token.markup = '$';
+    }
+    state.pos = pos + 1;
+    return true;
+}
+/**
+ * markdown-it plugin for display math ($$...$$)
+ */
+function mathBlockRule(state, startLine, endLine, silent) {
+    const start = state.bMarks[startLine] + state.tShift[startLine];
+    const max = state.eMarks[startLine];
+    // Check if line starts with $$
+    if (start + 2 > max)
+        return false;
+    if (state.src.charCodeAt(start) !== 0x24 /* $ */)
+        return false;
+    if (state.src.charCodeAt(start + 1) !== 0x24 /* $ */)
+        return false;
+    const marker = state.src.slice(start, start + 2);
+    const pos = start + 2;
+    // Check if it's inline $$ (closing on same line)
+    const firstLine = state.src.slice(pos, max);
+    const closePos = firstLine.indexOf('$$');
+    if (closePos !== -1) {
+        // Inline display math on single line
+        if (silent)
+            return true;
+        const content = firstLine.slice(0, closePos);
+        const token = state.push('math_block', 'div', 0);
+        token.content = content;
+        token.markup = marker;
+        token.block = true;
+        token.map = [startLine, startLine + 1];
+        state.line = startLine + 1;
+        return true;
+    }
+    // Multi-line display math
+    let nextLine = startLine;
+    let autoClose = false;
+    // Search for closing $$
+    while (nextLine < endLine) {
+        nextLine++;
+        if (nextLine >= endLine)
+            break;
+        const lineStart = state.bMarks[nextLine] + state.tShift[nextLine];
+        const lineMax = state.eMarks[nextLine];
+        if (lineStart < lineMax && state.sCount[nextLine] < state.blkIndent) {
+            // Non-empty line with less indent - might close the block
+            break;
+        }
+        const lineText = state.src.slice(lineStart, lineMax);
+        if (lineText.trim() === '$$') {
+            autoClose = true;
+            break;
+        }
+        // Check if line contains $$
+        if (lineText.includes('$$')) {
+            autoClose = true;
+            break;
+        }
+    }
+    if (!autoClose) {
+        return false;
+    }
+    if (silent)
+        return true;
+    // Extract content between $$ markers
+    const contentLines = [];
+    for (let i = startLine + 1; i < nextLine; i++) {
+        const lineStart = state.bMarks[i] + state.tShift[i];
+        const lineMax = state.eMarks[i];
+        contentLines.push(state.src.slice(lineStart, lineMax));
+    }
+    const content = contentLines.join('\n');
+    const token = state.push('math_block', 'div', 0);
+    token.content = content;
+    token.markup = marker;
+    token.block = true;
+    token.map = [startLine, nextLine + 1];
+    state.line = nextLine + 1;
+    return true;
+}
+/**
+ * Create markdown-it plugin for math support
+ */
+function markdownItMath(md, config = {}) {
+    // Add inline display math rule ($$...$$) - must come before inline math ($...$)
+    md.inline.ruler.before('escape', 'math_inline_display', (state, silent) => mathInlineDisplayRule(state, silent, config));
+    // Add inline math rule ($...$)
+    md.inline.ruler.before('escape', 'math_inline', (state, silent) => mathInlineRule(state, silent, config));
+    // Add block math rule ($$...$$)
+    md.block.ruler.before('fence', 'math_block', mathBlockRule, {
+        alt: ['paragraph', 'reference', 'blockquote', 'list'],
+    });
+}
+/**
+ * Create math plugin for comark
+ *
+ * This plugin processes markdown-it tokens and converts math expressions
+ * with $ and $$ delimiters to HTML using KaTeX.
+ *
+ * @param config Math rendering configuration
+ *
+ * @example
+ * ```ts
+ * import { parse } from 'comark'
+ * import math from 'comark/plugins/math'
+ *
+ * const result = await parse('Inline $x^2$ and display $$E = mc^2$$', {
+ *   plugins: [math({ throwOnError: false })]
+ * })
+ * ```
+ */
+export default function math(config) {
+    return {
+        name: 'math',
+        markdownItPlugins: [
+            ((md) => markdownItMath(md, config ?? {})),
+        ],
+    };
+}

package/dist/plugins/mermaid.d.ts

@@ -0,0 +1,38 @@
+import type { ComarkPlugin } from 'comark';
+export type ThemeNames = 'zinc-light' | 'zinc-dark' | 'tokyo-night' | 'tokyo-night-storm' | 'tokyo-night-light' | 'catppuccin-mocha' | 'catppuccin-latte' | 'nord' | 'nord-light' | 'dracula' | 'github-light' | 'github-dark' | 'solarized-light' | 'solarized-dark' | 'one-dark';
+export interface MermaidConfig {
+    /**
+     * Theme for mermaid diagrams
+     * @default undefined
+     */
+    theme?: ThemeNames;
+    /**
+     * Theme for mermaid diagrams in dark mode
+     * @default undefined
+     */
+    themeDark?: ThemeNames;
+}
+export declare function searchProps(content: string, index?: number): {
+    props: [string, string][];
+    index: number;
+} | undefined;
+/**
+ * Create mermaid plugin for comark
+ *
+ * This plugin processes markdown-it tokens and identifies mermaid code blocks
+ * for rendering by Vue/React components.
+ *
+ * @param config Mermaid rendering configuration
+ *
+ * @example
+ * ```ts
+ * import { parse } from 'comark'
+ * import { createMermaidPlugin } from 'comark/plugins/mermaid'
+ *
+ * const mermaid = createMermaidPlugin({ theme: 'dark' })
+ * const result = await parse('```mermaid\ngraph TD; A-->B;\n```', {
+ *   plugins: [mermaid()]
+ * })
+ * ```
+ */
+export default function comarkMermaid(config?: MermaidConfig): ComarkPlugin;

package/dist/plugins/mermaid.js

@@ -0,0 +1,185 @@
+/**
+ * markdown-it plugin for mermaid diagrams
+ * This handles ```mermaid code blocks
+ */
+function markdownItMermaid(md, config) {
+    md.core.ruler.after('block', 'replace-pre', (state) => {
+        for (const token of state.tokens) {
+            if (token.type === 'fence' && token.info?.startsWith('mermaid')) {
+                let info = token.info.substring(7).trim();
+                let props = [];
+                // extract props from info
+                const curlyBraceIndex = info.indexOf('{');
+                if (curlyBraceIndex !== -1) {
+                    const result = searchProps(info.substring(curlyBraceIndex));
+                    if (result) {
+                        props = result.props;
+                        info = info.substring(result.index);
+                    }
+                }
+                // set type, tag, props and content
+                token.type = 'mermaid';
+                token.tag = 'mermaid';
+                for (const prop of props) {
+                    token.attrJoin(prop[0], prop[1]);
+                }
+                if (config?.theme) {
+                    token.attrSet('theme', config.theme);
+                }
+                if (config?.themeDark) {
+                    token.attrSet('theme-dark', config.themeDark);
+                }
+                token.info = info;
+                token.attrSet('content', token.content);
+            }
+        }
+    });
+}
+export function searchProps(content, index = 0) {
+    const bracketPairs = {
+        '[': ']',
+        '{': '}',
+        '(': ')',
+    };
+    const quotePairs = {
+        '\'': '\'',
+        '"': '"',
+        '`': '`',
+    };
+    if (content[index] !== '{')
+        throw new Error(`Invalid props, expected \`{\` but got '${content[index]}'`);
+    const props = [];
+    // Vue's mustache {{ }} syntax
+    if (content[index + 1] === '{')
+        return undefined;
+    index += 1;
+    while (index < content.length) {
+        if (content[index] === '\\') {
+            index += 2;
+        }
+        else if (content[index] === '}') {
+            index += 1;
+            break;
+        }
+        else if (content[index] === ' ') {
+            index += 1;
+        }
+        else if (content[index] === '.') {
+            index += 1;
+            props.push([
+                'class',
+                searchUntil(' #.}'),
+            ]);
+        }
+        else if (content[index] === '#') {
+            index += 1;
+            props.push([
+                'id',
+                searchUntil(' #.}'),
+            ]);
+        }
+        else {
+            const start = index;
+            while (index < content.length) {
+                index += 1;
+                if (' }='.includes(content[index]))
+                    break;
+            }
+            const char = content[index];
+            if (start !== index) {
+                const key = content.slice(start, index).trim();
+                if (char === '=') {
+                    index += 1;
+                    props.push([
+                        key,
+                        searchValue(),
+                    ]);
+                }
+                else {
+                    props.push([
+                        key,
+                        'true',
+                    ]);
+                }
+            }
+        }
+    }
+    function searchUntil(str) {
+        const start = index;
+        while (index < content.length) {
+            index += 1;
+            if (content[index] === '\\')
+                index += 2;
+            if (str.includes(content[index]))
+                break;
+        }
+        return content.slice(start, index);
+    }
+    function searchValue() {
+        const start = index;
+        if (content[index] in bracketPairs) {
+            searchBracket(bracketPairs[content[index]]);
+            index += 1;
+            return content.slice(start, index);
+        }
+        else if (content[index] in quotePairs) {
+            searchString(quotePairs[content[index]]);
+            index += 1;
+            return content.slice(start, index);
+        }
+        else {
+            // unquoted value
+            return searchUntil(' }');
+        }
+    }
+    function searchBracket(end) {
+        while (index < content.length) {
+            index++;
+            if (content[index] in quotePairs)
+                searchString(quotePairs[content[index]]);
+            else if (content[index] in bracketPairs)
+                searchBracket(bracketPairs[content[index]]);
+            else if (content[index] === end)
+                return;
+        }
+    }
+    function searchString(end) {
+        return searchUntil(end);
+    }
+    // Escale quotes
+    props.forEach((v) => {
+        if (v[1].match(/^(['"`]).*\1$/))
+            v[1] = v[1].slice(1, -1);
+    });
+    return {
+        props,
+        index,
+    };
+}
+/**
+ * Create mermaid plugin for comark
+ *
+ * This plugin processes markdown-it tokens and identifies mermaid code blocks
+ * for rendering by Vue/React components.
+ *
+ * @param config Mermaid rendering configuration
+ *
+ * @example
+ * ```ts
+ * import { parse } from 'comark'
+ * import { createMermaidPlugin } from 'comark/plugins/mermaid'
+ *
+ * const mermaid = createMermaidPlugin({ theme: 'dark' })
+ * const result = await parse('```mermaid\ngraph TD; A-->B;\n```', {
+ *   plugins: [mermaid()]
+ * })
+ * ```
+ */
+export default function comarkMermaid(config) {
+    return {
+        name: 'mermaid',
+        markdownItPlugins: [
+            ((md) => markdownItMermaid(md, config)),
+        ],
+    };
+}

package/dist/plugins/security.d.ts

@@ -0,0 +1,11 @@
+import type { ComarkPlugin } from 'comark';
+import type { PropsValidationOptions } from '../internal/props-validation';
+interface SecurityOptions extends PropsValidationOptions {
+    /**
+     * Tags to remove entirely from the output tree.
+     * @default []
+     */
+    blockedTags?: string[];
+}
+export default function security(options: SecurityOptions): ComarkPlugin;
+export {};

package/dist/plugins/security.js

@@ -0,0 +1,32 @@
+import { visit } from 'comark/utils';
+import { validateProps } from '../internal/props-validation';
+export default function security(options) {
+    const { blockedTags = [], allowedLinkPrefixes, allowedImagePrefixes, allowedProtocols, defaultOrigin, allowDataImages, } = options;
+    const dropSet = new Set(blockedTags.map(t => t.toLowerCase()));
+    const propsOptions = {
+        allowedLinkPrefixes,
+        allowedImagePrefixes,
+        allowedProtocols,
+        defaultOrigin,
+        allowDataImages,
+    };
+    return {
+        name: 'security',
+        post(state) {
+            visit(state.tree, node => typeof node !== 'string' && node[0] !== null, (node) => {
+                const element = node;
+                // return false to remove the node from the tree
+                if (dropSet.has(element[0].toLowerCase())) {
+                    return false;
+                }
+                const keys = Object.keys(element[1]);
+                /**
+                 * If the element has any props, validate them
+                 */
+                if (keys.length) {
+                    element[1] = validateProps(element[0], element[1], propsOptions);
+                }
+            });
+        },
+    };
+}

package/dist/plugins/summary.d.ts

@@ -0,0 +1,2 @@
+import type { ComarkPlugin } from '../types';
+export default function summary(delimiter?: string): ComarkPlugin;

package/dist/plugins/summary.js

@@ -0,0 +1,22 @@
+import { applyAutoUnwrap } from '../internal/parse/auto-unwrap';
+import { marmdownItTokensToComarkTree } from '../internal/parse/token-processor';
+export default function summary(delimiter = '<!-- more -->') {
+    return {
+        name: 'summary',
+        post(state) {
+            let summary;
+            const delimiterIndex = state.tokens.findIndex((token) => token.type === 'html_block' && token.content?.includes(delimiter));
+            if (delimiterIndex !== -1) {
+                const summaryTokens = state.tokens.slice(0, delimiterIndex);
+                summary = marmdownItTokensToComarkTree(summaryTokens);
+                // Apply auto-unwrap to summary as well
+                if (state.options.autoUnwrap) {
+                    summary = summary?.map((child) => applyAutoUnwrap(child));
+                }
+                if (summary) {
+                    state.tree.meta.summary = summary;
+                }
+            }
+        },
+    };
+}

package/dist/plugins/task-list.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Custom task list plugin for markdown-it that works with @comark/markdown-it
+ *
+ * This plugin runs before inline parsing to prevent Comark from interpreting
+ * task list markers [X] and [ ] as Comark inline span syntax.
+ */
+import type { ComarkPlugin } from 'comark';
+export default function comarkTaskList(): ComarkPlugin;

package/dist/plugins/task-list.js

@@ -0,0 +1,117 @@
+/**
+ * Custom task list plugin for markdown-it that works with @comark/markdown-it
+ *
+ * This plugin runs before inline parsing to prevent Comark from interpreting
+ * task list markers [X] and [ ] as Comark inline span syntax.
+ */
+function attrSet(token, name, value) {
+    const index = token.attrIndex(name);
+    const attr = [name, value];
+    if (index < 0) {
+        if (!token.attrs) {
+            token.attrs = [];
+        }
+        token.attrs.push(attr);
+    }
+    else {
+        token.attrs[index] = attr;
+    }
+}
+function findParentListItem(tokens, index) {
+    // Look backwards for list_item_open
+    for (let i = index - 1; i >= 0; i--) {
+        if (tokens[i].type === 'list_item_open') {
+            return i;
+        }
+        if (tokens[i].type === 'list_item_close') {
+            // We've gone past the current list item
+            return -1;
+        }
+    }
+    return -1;
+}
+function findParentList(tokens, listItemIndex) {
+    const targetLevel = tokens[listItemIndex].level - 1;
+    // Look backwards for the list (ul/ol) that contains this list item
+    for (let i = listItemIndex - 1; i >= 0; i--) {
+        if (tokens[i].level === targetLevel
+            && (tokens[i].type === 'bullet_list_open' || tokens[i].type === 'ordered_list_open')) {
+            return i;
+        }
+    }
+    return -1;
+}
+function markdownItTaskList(md, options) {
+    const disableCheckboxes = !(options?.enabled ?? false);
+    // Run BEFORE inline parsing to prevent Comark from processing task list markers
+    md.core.ruler.before('inline', 'task-lists-mdc', (state) => {
+        const tokens = state.tokens;
+        for (let i = 0; i < tokens.length; i++) {
+            const token = tokens[i];
+            // Look for list items that might contain task lists
+            if (token.type === 'inline' && token.content) {
+                const parentIdx = findParentListItem(tokens, i);
+                if (parentIdx >= 0) {
+                    // Check if content starts with task list marker
+                    const match = token.content.match(/^(\[[ x]\])\s+/i);
+                    if (match) {
+                        const isChecked = match[1].toLowerCase() === '[x]';
+                        // Mark the list item with task-list-item class
+                        attrSet(tokens[parentIdx], 'class', 'task-list-item');
+                        // Mark the parent list with contains-task-list class
+                        const listIdx = findParentList(tokens, parentIdx);
+                        if (listIdx >= 0) {
+                            attrSet(tokens[listIdx], 'class', 'contains-task-list');
+                        }
+                        // Replace the task marker with a placeholder that won't be processed by Comark
+                        // We use a special format that we can detect later
+                        // Keep one space after the placeholder to match expected output
+                        const checkboxPlaceholder = `{{TASK_CHECKBOX_${isChecked ? 'CHECKED' : 'UNCHECKED'}}} `;
+                        token.content = token.content.replace(/^\[[ x]\]\s+/i, checkboxPlaceholder);
+                    }
+                }
+            }
+        }
+    });
+    // Run AFTER inline parsing to replace placeholders with actual checkbox HTML
+    // @ts-expect-error - after is not a valid method on the ruler types
+    md.core.ruler.after('inline', 'task-lists-mdc-post', (state) => {
+        const tokens = state.tokens;
+        for (let i = 0; i < tokens.length; i++) {
+            const token = tokens[i];
+            if (token.type === 'inline' && token.children) {
+                for (let j = 0; j < token.children.length; j++) {
+                    const child = token.children[j];
+                    if (child.type === 'text' && child.content) {
+                        // Check for our checkbox placeholder
+                        const checkedMatch = child.content.match(/^\{\{TASK_CHECKBOX_CHECKED\}\}/);
+                        const uncheckedMatch = child.content.match(/^\{\{TASK_CHECKBOX_UNCHECKED\}\}/);
+                        if (checkedMatch || uncheckedMatch) {
+                            const isChecked = !!checkedMatch;
+                            // Create checkbox token
+                            const checkbox = new state.Token('mdc_inline_component', 'input', 0);
+                            checkbox.attrs = [['class', 'task-list-item-checkbox'], ['type', 'checkbox']];
+                            if (disableCheckboxes) {
+                                checkbox.attrs.push([':disabled', 'true']);
+                            }
+                            if (isChecked) {
+                                checkbox.attrs.push([':checked', 'true']);
+                            }
+                            // Remove placeholder from text
+                            child.content = child.content.replace(/^\{\{TASK_CHECKBOX_(CHECKED|UNCHECKED)\}\}/, '');
+                            // Insert checkbox before the text
+                            token.children.splice(j, 0, checkbox);
+                            j++; // Skip the newly inserted checkbox
+                        }
+                    }
+                }
+            }
+        }
+    });
+}
+export default function comarkTaskList() {
+    return {
+        name: 'task-list',
+        markdownItPlugins: [markdownItTaskList],
+    };
+}