auwla-markdown 0.0.3 → 0.0.4

package/dist/index.js

@@ -1,2 +1,435 @@
-export { createMDConfig } from './engine';
-export { shikiHighlighter } from './adapters/shiki';
+import { createRequire } from "node:module";
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/engine.ts
+import { Marked } from "marked";
+import { markedHighlight } from "marked-highlight";
+
+// src/frontmatter.ts
+function extractFrontmatter(rawString) {
+  const match = rawString.match(/^=<Header(?:[^>]*)>\r?\n([\s\S]*?)\r?\n=<\/Header>\r?\n([\s\S]*)$/);
+  if (!match)
+    return { content: rawString, meta: {} };
+  const rawMeta = match[1];
+  const content = match[2];
+  const meta = {};
+  for (const line of rawMeta.split(`
+`)) {
+    const sep = line.indexOf(":");
+    if (sep === -1)
+      continue;
+    const key = line.slice(0, sep).trim();
+    const val = line.slice(sep + 1).trim();
+    if (val === "true") {
+      meta[key] = true;
+    } else if (val === "false") {
+      meta[key] = false;
+    } else if (!isNaN(Number(val)) && val !== "") {
+      meta[key] = Number(val);
+    } else {
+      meta[key] = val.replace(/^["']|["']$/g, "");
+    }
+  }
+  return { content, meta };
+}
+
+// src/headings.ts
+function extractHeadings(content) {
+  const headings = [];
+  const lines = content.split(`
+`);
+  let inCodeBlock = false;
+  for (const line of lines) {
+    const trimmed = line.trim();
+    if (trimmed.startsWith("```")) {
+      inCodeBlock = !inCodeBlock;
+      continue;
+    }
+    if (inCodeBlock)
+      continue;
+    const tagMatch = trimmed.match(/^=<h([1-6])(?:[^>]*?)>(.*?)=<\/h\1>$/);
+    if (tagMatch) {
+      const level = parseInt(tagMatch[1], 10);
+      const text = tagMatch[2].trim();
+      const id = text.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
+      headings.push({ level, text, id });
+      continue;
+    }
+    const match = line.match(/^(#{1,6})\s+(.+)$/);
+    if (match) {
+      const level = match[1].length;
+      const text = match[2].trim();
+      const id = text.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
+      headings.push({ level, text, id });
+    }
+  }
+  return headings;
+}
+
+// src/features.ts
+var inlineWrapperTags = new Set(["h1", "h2", "h3", "h4", "h5", "h6", "p", "span", "a", "li"]);
+var defaultComponents = {
+  Callout: async (props, rawContent, parse, parseInline, features) => {
+    const type = props.type || "note";
+    const title = props.title || type.toUpperCase();
+    const htmlContent = await parse(rawContent);
+    const isCollapsible = "collapsible" in props && props.collapsible !== "false";
+    const isCollapsed = props.collapsed === "true";
+    const customClass = props.class ? ` ${props.class}` : "";
+    const className = `callout callout-${type.toLowerCase()}${customClass}`;
+    const otherAttrs = Object.entries(props).filter(([k]) => !["value", "type", "title", "collapsible", "collapsed", "class"].includes(k)).map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = otherAttrs ? ` ${otherAttrs}` : "";
+    if (isCollapsible) {
+      const openAttr = isCollapsed ? "" : " open";
+      return `<details class="${className}"${openAttr}${attrString}><summary class="callout-title">${title}</summary><div class="callout-content">${htmlContent}</div></details>`;
+    }
+    return `<div class="${className}"${attrString}><div class="callout-title">${title}</div><div class="callout-content">${htmlContent}</div></div>`;
+  },
+  Tabs: async (props, rawContent, parse, parseInline, features) => {
+    const content = await parse(rawContent);
+    const regex = /<div class="tab-panel[^"]*"\s+data-title="([^"]*)"/g;
+    const titles = [];
+    let match;
+    while ((match = regex.exec(content)) !== null) {
+      titles.push(match[1]);
+    }
+    if (titles.length === 0)
+      return content;
+    const tabButtons = titles.map((title, idx) => {
+      const activeClass = idx === 0 ? "active" : "";
+      const clickHandler = `const c = this.closest('.tabs-container'); c.querySelectorAll('.tab-btn').forEach((b, i) => { b.classList.toggle('active', b === this); c.querySelectorAll('.tab-panel')[i].style.display = (b === this) ? 'block' : 'none'; })`;
+      return `<button class="tab-btn ${activeClass}" onclick="${clickHandler}">${title}</button>`;
+    }).join("");
+    let panelIndex = 0;
+    const adjustedContent = content.replace(/class="tab-panel([^"]*)"/g, (match2, customClasses) => {
+      const activeClass = panelIndex === 0 ? " active" : "";
+      const display = panelIndex === 0 ? "block" : "none";
+      panelIndex++;
+      return `class="tab-panel${customClasses}${activeClass}" style="display: ${display};"`;
+    });
+    const customClass = props.class ? ` ${props.class}` : "";
+    const className = `tabs-container${customClass}`;
+    const otherAttrs = Object.entries(props).filter(([k]) => !["value", "class"].includes(k)).map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = otherAttrs ? ` ${otherAttrs}` : "";
+    return `<div class="${className}"${attrString}><div class="tabs-header">${tabButtons}</div><div class="tabs-content">${adjustedContent}</div></div>`;
+  },
+  Tab: async (props, rawContent, parse, parseInline, features) => {
+    const title = props.title || "";
+    const content = await parse(rawContent);
+    const customClass = props.class ? ` ${props.class}` : "";
+    const className = `tab-panel${customClass}`;
+    const otherAttrs = Object.entries(props).filter(([k]) => !["value", "title", "class"].includes(k)).map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = otherAttrs ? ` ${otherAttrs}` : "";
+    return `<div class="${className}" data-title="${title}"${attrString}>${content}</div>`;
+  },
+  Table: async (props, rawContent, parse, parseInline, features) => {
+    const content = await parseInline(rawContent);
+    const defaultClass = "auwla-table";
+    const customClass = props.class ? ` ${props.class}` : "";
+    const mergedClass = `${defaultClass}${customClass}`;
+    const attrPairs = Object.entries(props).filter(([k]) => k !== "value" && k !== "class").map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = attrPairs ? ` ${attrPairs}` : "";
+    return `<table class="${mergedClass}"${attrString}>${content}</table>`;
+  },
+  Row: async (props, rawContent, parse, parseInline, features) => {
+    const content = await parseInline(rawContent);
+    const attrPairs = Object.entries(props).filter(([k]) => k !== "value").map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = attrPairs ? ` ${attrPairs}` : "";
+    return `<tr${attrString}>${content}</tr>`;
+  },
+  Column: async (props, rawContent, parse, parseInline, features) => {
+    const content = await parseInline(rawContent);
+    const attrPairs = Object.entries(props).filter(([k]) => k !== "value").map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = attrPairs ? ` ${attrPairs}` : "";
+    return `<th${attrString}>${content}</th>`;
+  },
+  Cell: async (props, rawContent, parse, parseInline, features) => {
+    const content = await parseInline(rawContent);
+    const attrPairs = Object.entries(props).filter(([k]) => k !== "value").map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString = attrPairs ? ` ${attrPairs}` : "";
+    return `<td${attrString}>${content}</td>`;
+  }
+};
+function parseAttributes(attrString) {
+  const attrs = {};
+  const trimmed = attrString.trim();
+  if (!trimmed)
+    return attrs;
+  if (trimmed.startsWith("=")) {
+    const match2 = trimmed.match(/^=\s*(?:"(.*?)"|'(.*?)'|([^\s>]+))/);
+    if (match2) {
+      attrs.value = match2[1] ?? match2[2] ?? match2[3] ?? "";
+      return attrs;
+    }
+  }
+  const regex = /(\w+)(?:\s*=\s*(?:"(.*?)"|'(.*?)'|([^\s>]+)))?/g;
+  let match;
+  while ((match = regex.exec(attrString)) !== null) {
+    const key = match[1];
+    const val = match[2] ?? match[3] ?? match[4] ?? "true";
+    attrs[key] = val;
+  }
+  return attrs;
+}
+async function renderComponent(tagName, props, rawContent, parseFn, parseInlineFn, features, customComponents) {
+  if (customComponents[tagName]) {
+    return await customComponents[tagName](props, rawContent, parseFn, parseInlineFn, features);
+  }
+  if (defaultComponents[tagName]) {
+    return await defaultComponents[tagName](props, rawContent, parseFn, parseInlineFn, features);
+  }
+  const isInline = inlineWrapperTags.has(tagName.toLowerCase());
+  const compiledContent = isInline ? await parseInlineFn(rawContent) : await parseFn(rawContent);
+  if (isInline && tagName.toLowerCase().startsWith("h") && tagName.length === 2 && !isNaN(Number(tagName.slice(1)))) {
+    const depth = tagName.toLowerCase().slice(1);
+    const plainText = compiledContent.replace(/<[^>]*>/g, "");
+    const id = props.id || plainText.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
+    const idAttr = `id="${id}"`;
+    const classAttr = props.class ? `class="${props.class}"` : "";
+    const otherAttrs = Object.entries(props).filter(([k]) => k !== "value" && k !== "id" && k !== "class").map(([k, v]) => `${k}="${v}"`).join(" ");
+    const attrString2 = [idAttr, classAttr, otherAttrs].filter(Boolean).map((s) => s.trim()).join(" ");
+    const finalAttrString = attrString2 ? ` ${attrString2}` : "";
+    if (features?.headerAnchors) {
+      return `<h${depth}${finalAttrString}><a href="#${id}" class="header-anchor" aria-hidden="true">#</a>${compiledContent}</h${depth}>`;
+    } else {
+      return `<h${depth}${finalAttrString}>${compiledContent}</h${depth}>`;
+    }
+  }
+  const attrPairs = Object.entries(props).filter(([k]) => k !== "value").map(([k, v]) => `${k}="${v}"`).join(" ");
+  const attrString = attrPairs ? ` ${attrPairs}` : "";
+  return `<${tagName}${attrString}>${compiledContent}</${tagName}>`;
+}
+async function preprocessComponents(rawMarkdown, parseFn, parseInlineFn, features = {}, customComponents = {}) {
+  const lines = rawMarkdown.split(`
+`);
+  const result = [];
+  const stack = [];
+  for (const line of lines) {
+    const trimmed = line.trim();
+    const singleLineMatch = trimmed.match(/^=<(\w+)([^>]*?)>(.*?)=<\/\1>$/);
+    if (singleLineMatch) {
+      const tagName = singleLineMatch[1];
+      const attrString = singleLineMatch[2] || "";
+      const innerContent = singleLineMatch[3] || "";
+      const props = parseAttributes(attrString);
+      const html = await renderComponent(tagName, props, innerContent, parseFn, parseInlineFn, features, customComponents);
+      if (stack.length > 0) {
+        stack[stack.length - 1].contentLines.push(html);
+      } else {
+        result.push(html);
+      }
+      continue;
+    }
+    if (trimmed.startsWith("=<") && trimmed.endsWith("/>")) {
+      const match = trimmed.match(/^=<(\w+)([^>]*?)\/>$/);
+      if (match) {
+        const tagName = match[1];
+        const attrString = match[2] || "";
+        const props = parseAttributes(attrString);
+        const html = await renderComponent(tagName, props, "", parseFn, parseInlineFn, features, customComponents);
+        if (stack.length > 0) {
+          stack[stack.length - 1].contentLines.push(html);
+        } else {
+          result.push(html);
+        }
+        continue;
+      }
+    }
+    if (trimmed.startsWith("=<") && !trimmed.startsWith("=</") && trimmed.endsWith(">")) {
+      const match = trimmed.match(/^=<(\w+)([^>]*?)>$/);
+      if (match) {
+        const tagName = match[1];
+        const attrString = match[2] || "";
+        const props = parseAttributes(attrString);
+        stack.push({
+          tagName,
+          props,
+          contentLines: []
+        });
+        continue;
+      }
+    }
+    if (trimmed.startsWith("=</") && trimmed.endsWith(">")) {
+      const match = trimmed.match(/^=<\/(.*?)>$/);
+      if (match) {
+        const tagName = match[1].trim();
+        if (stack.length > 0 && stack[stack.length - 1].tagName === tagName) {
+          const block = stack.pop();
+          const rawContent = block.contentLines.join(`
+`);
+          const html = await renderComponent(block.tagName, block.props, rawContent, parseFn, parseInlineFn, features, customComponents);
+          if (stack.length > 0) {
+            stack[stack.length - 1].contentLines.push(html);
+          } else {
+            result.push(html);
+          }
+          continue;
+        }
+      }
+    }
+    if (stack.length > 0) {
+      stack[stack.length - 1].contentLines.push(line);
+    } else {
+      result.push(line);
+    }
+  }
+  while (stack.length > 0) {
+    const block = stack.pop();
+    result.push(`=<${block.tagName}>`);
+    result.push(block.contentLines.join(`
+`));
+    result.push(`=</${block.tagName}>`);
+  }
+  return result.join(`
+`);
+}
+function extractRawCode(raw) {
+  if (raw.startsWith("```") || raw.startsWith("~~~")) {
+    const lines = raw.split(`
+`);
+    return lines.slice(1, -1).join(`
+`);
+  }
+  return raw;
+}
+function parseCodeMeta(langString) {
+  const parts = langString.trim().split(/\s+/);
+  const lang = parts[0] || "";
+  let filename;
+  const highlightedLines = new Set;
+  for (const part of parts.slice(1)) {
+    if (part.startsWith("[") && part.endsWith("]")) {
+      filename = part.slice(1, -1);
+    } else if (part.startsWith("{") && part.endsWith("}")) {
+      const ranges = part.slice(1, -1).split(",");
+      for (const range of ranges) {
+        if (range.includes("-")) {
+          const [startStr, endStr] = range.split("-");
+          const start = parseInt(startStr || "0", 10);
+          const end = parseInt(endStr || "0", 10);
+          if (!isNaN(start) && !isNaN(end)) {
+            for (let i = start;i <= end; i++) {
+              highlightedLines.add(i);
+            }
+          }
+        } else {
+          const val = parseInt(range, 10);
+          if (!isNaN(val)) {
+            highlightedLines.add(val);
+          }
+        }
+      }
+    }
+  }
+  return { lang, filename, highlightedLines };
+}
+function injectHighlightedLines(html, highlightedLines) {
+  if (highlightedLines.size === 0)
+    return html;
+  if (html.includes('class="line"')) {
+    let lineIndex = 0;
+    return html.replace(/class="line"/g, () => {
+      lineIndex++;
+      if (highlightedLines.has(lineIndex)) {
+        return 'class="line highlighted-line"';
+      }
+      return 'class="line"';
+    });
+  }
+  const lines = html.split(`
+`);
+  const processed = lines.map((line, idx) => {
+    const lineNum = idx + 1;
+    if (highlightedLines.has(lineNum)) {
+      return `<div class="highlighted-line">${line}</div>`;
+    }
+    return line;
+  });
+  return processed.join(`
+`);
+}
+function copyCodeButtonRenderer(info) {
+  const rawCode = extractRawCode(info.raw);
+  const escapedCode = encodeURIComponent(rawCode).replace(/'/g, "%27");
+  const { lang, filename, highlightedLines } = parseCodeMeta(info.lang ?? "");
+  let codeContent = info.text.trim().startsWith("<pre") ? info.text : `<pre><code class="language-${lang}">${info.text}</code></pre>`;
+  codeContent = injectHighlightedLines(codeContent, highlightedLines);
+  const filenameHeader = filename ? `<div class="code-block-filename">${filename}</div>` : "";
+  return `<div class="code-block-wrapper" style="position: relative;">${filenameHeader}<button onclick="navigator.clipboard.writeText(decodeURIComponent('${escapedCode}')); this.textContent = 'Copied!'; setTimeout(() => this.textContent = 'Copy', 2000)" class="copy-code-btn" style="position: absolute; right: 0.5rem; top: ${filename ? "2.5rem" : "0.5rem"}; z-index: 10;">Copy</button>${codeContent}</div>`;
+}
+function headerAnchorsRenderer(info) {
+  const text = info.text ?? (this.parser ? this.parser.parseInline(info.tokens) : info.raw);
+  const depth = info.depth;
+  const id = text.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
+  return `<h${depth} id="${id}"><a href="#${id}" class="header-anchor" aria-hidden="true">#</a>${text}</h${depth}>`;
+}
+
+// src/engine.ts
+function createMDConfig(config = {}) {
+  const markedInstance = new Marked({
+    gfm: true
+  });
+  if (config.highlighter) {
+    markedInstance.use(markedHighlight({
+      async: true,
+      highlight: async (code, lang) => {
+        if (!lang)
+          return code;
+        return await config.highlighter(code, lang);
+      }
+    }));
+  }
+  const customRenderer = {};
+  if (config.features?.headerAnchors) {
+    customRenderer.heading = headerAnchorsRenderer;
+  }
+  if (config.features?.copyCodeButton) {
+    customRenderer.code = copyCodeButtonRenderer;
+  }
+  if (Object.keys(customRenderer).length > 0) {
+    markedInstance.use({ renderer: customRenderer });
+  }
+  return {
+    parse: async (rawString) => {
+      let { content, meta } = extractFrontmatter(rawString);
+      const headings = extractHeadings(content);
+      content = await preprocessComponents(content, async (str) => await markedInstance.parse(str), async (str) => await markedInstance.parseInline(str), config.features, config.components);
+      const html = await markedInstance.parse(content);
+      return {
+        html,
+        meta,
+        headings
+      };
+    }
+  };
+}
+// src/adapters/shiki.ts
+function shikiHighlighter(options = {}) {
+  let shikiInstance = null;
+  const theme = options.theme || "github-dark";
+  return async (code, language) => {
+    const { createHighlighter } = await import("shiki");
+    if (!shikiInstance) {
+      shikiInstance = await createHighlighter({
+        themes: typeof theme === "string" ? [theme] : [theme.light, theme.dark],
+        langs: options.langs || [language, "javascript", "typescript", "bash", "html", "css"]
+      });
+    }
+    if (!shikiInstance.getLoadedLanguages().includes(language)) {
+      await shikiInstance.loadLanguage(language).catch(() => {});
+    }
+    const shikiOptions = {
+      lang: language
+    };
+    if (typeof theme === "string") {
+      shikiOptions.theme = theme;
+    } else {
+      shikiOptions.themes = theme;
+    }
+    return shikiInstance.codeToHtml(code, shikiOptions);
+  };
+}
+export {
+  shikiHighlighter,
+  createMDConfig
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auwla-markdown",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -30,6 +30,6 @@
     "marked-highlight": "^2.2.4"
   },
   "scripts": {
-    "build": "tsc --project tsconfig.lib.json"
+    "build": "bun -e \"import { rmSync } from 'fs'; rmSync('dist', { recursive: true, force: true })\" && bun build src/index.ts --outdir dist --target node --external shiki --external prismjs --external marked --external marked-highlight && tsc --project tsconfig.lib.json --emitDeclarationOnly"
   }
 }

package/dist/adapters/shiki.js

@@ -1,29 +0,0 @@
-export function shikiHighlighter(options = {}) {
-    let shikiInstance = null;
-    const theme = options.theme || 'github-dark';
-    return async (code, language) => {
-        // 1. Dynamically import Shiki ONLY when this function is actually called
-        const { createHighlighter } = await import('shiki');
-        // 2. Initialize it as a singleton on the first run
-        if (!shikiInstance) {
-            shikiInstance = await createHighlighter({
-                themes: typeof theme === 'string' ? [theme] : [theme.light, theme.dark],
-                langs: options.langs || [language, 'javascript', 'typescript', 'bash', 'html', 'css'],
-            });
-        }
-        // 3. Load the language if it hasn't been loaded yet (catch-all for unexpected languages)
-        if (!shikiInstance.getLoadedLanguages().includes(language)) {
-            await shikiInstance.loadLanguage(language).catch(() => { });
-        }
-        const shikiOptions = {
-            lang: language,
-        };
-        if (typeof theme === 'string') {
-            shikiOptions.theme = theme;
-        }
-        else {
-            shikiOptions.themes = theme;
-        }
-        return shikiInstance.codeToHtml(code, shikiOptions);
-    };
-}

package/dist/engine.js

@@ -1,46 +0,0 @@
-import { Marked } from 'marked';
-import { markedHighlight } from 'marked-highlight';
-import { extractFrontmatter } from './frontmatter';
-import { extractHeadings } from './headings';
-import { preprocessComponents, copyCodeButtonRenderer, headerAnchorsRenderer, } from './features';
-/** Configures and returns an isolated instance of the Markdown parsing engine. */
-export function createMDConfig(config = {}) {
-    const markedInstance = new Marked({
-        gfm: true,
-    });
-    if (config.highlighter) {
-        markedInstance.use(markedHighlight({
-            async: true,
-            highlight: async (code, lang) => {
-                if (!lang)
-                    return code;
-                return await config.highlighter(code, lang);
-            },
-        }));
-    }
-    // Register built-in features using custom Marked renderers
-    const customRenderer = {};
-    if (config.features?.headerAnchors) {
-        customRenderer.heading = headerAnchorsRenderer;
-    }
-    if (config.features?.copyCodeButton) {
-        customRenderer.code = copyCodeButtonRenderer;
-    }
-    if (Object.keys(customRenderer).length > 0) {
-        markedInstance.use({ renderer: customRenderer });
-    }
-    return {
-        parse: async (rawString) => {
-            let { content, meta } = extractFrontmatter(rawString);
-            const headings = extractHeadings(content);
-            // Preprocess component blocks and custom tags before sending to Marked
-            content = await preprocessComponents(content, async (str) => await markedInstance.parse(str), async (str) => await markedInstance.parseInline(str), config.features, config.components);
-            const html = await markedInstance.parse(content);
-            return {
-                html,
-                meta,
-                headings,
-            };
-        },
-    };
-}

package/dist/features.js

@@ -1,341 +0,0 @@
-const inlineWrapperTags = new Set(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'span', 'a', 'li']);
-export const defaultComponents = {
-    Callout: async (props, rawContent, parse, parseInline, features) => {
-        const type = props.type || 'note';
-        const title = props.title || type.toUpperCase();
-        const htmlContent = await parse(rawContent);
-        const isCollapsible = 'collapsible' in props && props.collapsible !== 'false';
-        const isCollapsed = props.collapsed === 'true';
-        const customClass = props.class ? ` ${props.class}` : '';
-        const className = `callout callout-${type.toLowerCase()}${customClass}`;
-        const otherAttrs = Object.entries(props)
-            .filter(([k]) => !['value', 'type', 'title', 'collapsible', 'collapsed', 'class'].includes(k))
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = otherAttrs ? ` ${otherAttrs}` : '';
-        if (isCollapsible) {
-            const openAttr = isCollapsed ? '' : ' open';
-            return `<details class="${className}"${openAttr}${attrString}><summary class="callout-title">${title}</summary><div class="callout-content">${htmlContent}</div></details>`;
-        }
-        return `<div class="${className}"${attrString}><div class="callout-title">${title}</div><div class="callout-content">${htmlContent}</div></div>`;
-    },
-    Tabs: async (props, rawContent, parse, parseInline, features) => {
-        const content = await parse(rawContent);
-        const regex = /<div class="tab-panel[^"]*"\s+data-title="([^"]*)"/g;
-        const titles = [];
-        let match;
-        while ((match = regex.exec(content)) !== null) {
-            titles.push(match[1]);
-        }
-        if (titles.length === 0)
-            return content;
-        const tabButtons = titles.map((title, idx) => {
-            const activeClass = idx === 0 ? 'active' : '';
-            const clickHandler = `const c = this.closest('.tabs-container'); c.querySelectorAll('.tab-btn').forEach((b, i) => { b.classList.toggle('active', b === this); c.querySelectorAll('.tab-panel')[i].style.display = (b === this) ? 'block' : 'none'; })`;
-            return `<button class="tab-btn ${activeClass}" onclick="${clickHandler}">${title}</button>`;
-        }).join('');
-        let panelIndex = 0;
-        const adjustedContent = content.replace(/class="tab-panel([^"]*)"/g, (match, customClasses) => {
-            const activeClass = panelIndex === 0 ? ' active' : '';
-            const display = panelIndex === 0 ? 'block' : 'none';
-            panelIndex++;
-            return `class="tab-panel${customClasses}${activeClass}" style="display: ${display};"`;
-        });
-        const customClass = props.class ? ` ${props.class}` : '';
-        const className = `tabs-container${customClass}`;
-        const otherAttrs = Object.entries(props)
-            .filter(([k]) => !['value', 'class'].includes(k))
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = otherAttrs ? ` ${otherAttrs}` : '';
-        return `<div class="${className}"${attrString}><div class="tabs-header">${tabButtons}</div><div class="tabs-content">${adjustedContent}</div></div>`;
-    },
-    Tab: async (props, rawContent, parse, parseInline, features) => {
-        const title = props.title || '';
-        const content = await parse(rawContent);
-        const customClass = props.class ? ` ${props.class}` : '';
-        const className = `tab-panel${customClass}`;
-        const otherAttrs = Object.entries(props)
-            .filter(([k]) => !['value', 'title', 'class'].includes(k))
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = otherAttrs ? ` ${otherAttrs}` : '';
-        return `<div class="${className}" data-title="${title}"${attrString}>${content}</div>`;
-    },
-    Table: async (props, rawContent, parse, parseInline, features) => {
-        const content = await parseInline(rawContent);
-        const defaultClass = 'auwla-table';
-        const customClass = props.class ? ` ${props.class}` : '';
-        const mergedClass = `${defaultClass}${customClass}`;
-        const attrPairs = Object.entries(props)
-            .filter(([k]) => k !== 'value' && k !== 'class')
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = attrPairs ? ` ${attrPairs}` : '';
-        return `<table class="${mergedClass}"${attrString}>${content}</table>`;
-    },
-    Row: async (props, rawContent, parse, parseInline, features) => {
-        const content = await parseInline(rawContent);
-        const attrPairs = Object.entries(props)
-            .filter(([k]) => k !== 'value')
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = attrPairs ? ` ${attrPairs}` : '';
-        return `<tr${attrString}>${content}</tr>`;
-    },
-    Column: async (props, rawContent, parse, parseInline, features) => {
-        const content = await parseInline(rawContent);
-        const attrPairs = Object.entries(props)
-            .filter(([k]) => k !== 'value')
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = attrPairs ? ` ${attrPairs}` : '';
-        return `<th${attrString}>${content}</th>`;
-    },
-    Cell: async (props, rawContent, parse, parseInline, features) => {
-        const content = await parseInline(rawContent);
-        const attrPairs = Object.entries(props)
-            .filter(([k]) => k !== 'value')
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = attrPairs ? ` ${attrPairs}` : '';
-        return `<td${attrString}>${content}</td>`;
-    }
-};
-function parseAttributes(attrString) {
-    const attrs = {};
-    const trimmed = attrString.trim();
-    if (!trimmed)
-        return attrs;
-    if (trimmed.startsWith('=')) {
-        const match = trimmed.match(/^=\s*(?:"(.*?)"|'(.*?)'|([^\s>]+))/);
-        if (match) {
-            attrs.value = match[1] ?? match[2] ?? match[3] ?? '';
-            return attrs;
-        }
-    }
-    const regex = /(\w+)(?:\s*=\s*(?:"(.*?)"|'(.*?)'|([^\s>]+)))?/g;
-    let match;
-    while ((match = regex.exec(attrString)) !== null) {
-        const key = match[1];
-        const val = match[2] ?? match[3] ?? match[4] ?? 'true';
-        attrs[key] = val;
-    }
-    return attrs;
-}
-async function renderComponent(tagName, props, rawContent, parseFn, parseInlineFn, features, customComponents) {
-    if (customComponents[tagName]) {
-        return await customComponents[tagName](props, rawContent, parseFn, parseInlineFn, features);
-    }
-    if (defaultComponents[tagName]) {
-        return await defaultComponents[tagName](props, rawContent, parseFn, parseInlineFn, features);
-    }
-    const isInline = inlineWrapperTags.has(tagName.toLowerCase());
-    const compiledContent = isInline ? await parseInlineFn(rawContent) : await parseFn(rawContent);
-    // Match custom tag heading (e.g. h1, h2, h3, etc.)
-    if (isInline && tagName.toLowerCase().startsWith('h') && tagName.length === 2 && !isNaN(Number(tagName.slice(1)))) {
-        const depth = tagName.toLowerCase().slice(1);
-        const plainText = compiledContent.replace(/<[^>]*>/g, '');
-        const id = props.id || plainText
-            .toLowerCase()
-            .replace(/[^\w\s-]/g, '')
-            .replace(/\s+/g, '-');
-        const idAttr = `id="${id}"`;
-        const classAttr = props.class ? `class="${props.class}"` : '';
-        const otherAttrs = Object.entries(props)
-            .filter(([k]) => k !== 'value' && k !== 'id' && k !== 'class')
-            .map(([k, v]) => `${k}="${v}"`)
-            .join(' ');
-        const attrString = [idAttr, classAttr, otherAttrs].filter(Boolean).map(s => s.trim()).join(' ');
-        const finalAttrString = attrString ? ` ${attrString}` : '';
-        if (features?.headerAnchors) {
-            return `<h${depth}${finalAttrString}><a href="#${id}" class="header-anchor" aria-hidden="true">#</a>${compiledContent}</h${depth}>`;
-        }
-        else {
-            return `<h${depth}${finalAttrString}>${compiledContent}</h${depth}>`;
-        }
-    }
-    const attrPairs = Object.entries(props).filter(([k]) => k !== 'value').map(([k, v]) => `${k}="${v}"`).join(' ');
-    const attrString = attrPairs ? ` ${attrPairs}` : '';
-    return `<${tagName}${attrString}>${compiledContent}</${tagName}>`;
-}
-/**
- * Preprocesses component-like tags (=<TagName>) inside a raw markdown string.
- * Looks up default and custom components, compiles, and injects HTML.
- */
-export async function preprocessComponents(rawMarkdown, parseFn, parseInlineFn, features = {}, customComponents = {}) {
-    const lines = rawMarkdown.split('\n');
-    const result = [];
-    const stack = [];
-    for (const line of lines) {
-        const trimmed = line.trim();
-        // 1. Single-line components (e.g. =<Column>Name=</Column>)
-        const singleLineMatch = trimmed.match(/^=<(\w+)([^>]*?)>(.*?)=<\/\1>$/);
-        if (singleLineMatch) {
-            const tagName = singleLineMatch[1];
-            const attrString = singleLineMatch[2] || '';
-            const innerContent = singleLineMatch[3] || '';
-            const props = parseAttributes(attrString);
-            const html = await renderComponent(tagName, props, innerContent, parseFn, parseInlineFn, features, customComponents);
-            if (stack.length > 0) {
-                stack[stack.length - 1].contentLines.push(html);
-            }
-            else {
-                result.push(html);
-            }
-            continue;
-        }
-        // 2. Self-closing components
-        if (trimmed.startsWith('=<') && trimmed.endsWith('/>')) {
-            const match = trimmed.match(/^=<(\w+)([^>]*?)\/>$/);
-            if (match) {
-                const tagName = match[1];
-                const attrString = match[2] || '';
-                const props = parseAttributes(attrString);
-                const html = await renderComponent(tagName, props, '', parseFn, parseInlineFn, features, customComponents);
-                if (stack.length > 0) {
-                    stack[stack.length - 1].contentLines.push(html);
-                }
-                else {
-                    result.push(html);
-                }
-                continue;
-            }
-        }
-        // 3. Opening component tags
-        if (trimmed.startsWith('=<') && !trimmed.startsWith('=</') && trimmed.endsWith('>')) {
-            const match = trimmed.match(/^=<(\w+)([^>]*?)>$/);
-            if (match) {
-                const tagName = match[1];
-                const attrString = match[2] || '';
-                const props = parseAttributes(attrString);
-                stack.push({
-                    tagName,
-                    props,
-                    contentLines: []
-                });
-                continue;
-            }
-        }
-        // 4. Closing component tags
-        if (trimmed.startsWith('=</') && trimmed.endsWith('>')) {
-            const match = trimmed.match(/^=<\/(.*?)>$/);
-            if (match) {
-                const tagName = match[1].trim();
-                if (stack.length > 0 && stack[stack.length - 1].tagName === tagName) {
-                    const block = stack.pop();
-                    const rawContent = block.contentLines.join('\n');
-                    const html = await renderComponent(block.tagName, block.props, rawContent, parseFn, parseInlineFn, features, customComponents);
-                    if (stack.length > 0) {
-                        stack[stack.length - 1].contentLines.push(html);
-                    }
-                    else {
-                        result.push(html);
-                    }
-                    continue;
-                }
-            }
-        }
-        // 5. Standard line
-        if (stack.length > 0) {
-            stack[stack.length - 1].contentLines.push(line);
-        }
-        else {
-            result.push(line);
-        }
-    }
-    while (stack.length > 0) {
-        const block = stack.pop();
-        result.push(`=<${block.tagName}>`);
-        result.push(block.contentLines.join('\n'));
-        result.push(`=</${block.tagName}>`);
-    }
-    return result.join('\n');
-}
-function extractRawCode(raw) {
-    if (raw.startsWith('```') || raw.startsWith('~~~')) {
-        const lines = raw.split('\n');
-        return lines.slice(1, -1).join('\n');
-    }
-    return raw;
-}
-function parseCodeMeta(langString) {
-    const parts = langString.trim().split(/\s+/);
-    const lang = parts[0] || '';
-    let filename;
-    const highlightedLines = new Set();
-    for (const part of parts.slice(1)) {
-        if (part.startsWith('[') && part.endsWith(']')) {
-            filename = part.slice(1, -1);
-        }
-        else if (part.startsWith('{') && part.endsWith('}')) {
-            const ranges = part.slice(1, -1).split(',');
-            for (const range of ranges) {
-                if (range.includes('-')) {
-                    const [startStr, endStr] = range.split('-');
-                    const start = parseInt(startStr || '0', 10);
-                    const end = parseInt(endStr || '0', 10);
-                    if (!isNaN(start) && !isNaN(end)) {
-                        for (let i = start; i <= end; i++) {
-                            highlightedLines.add(i);
-                        }
-                    }
-                }
-                else {
-                    const val = parseInt(range, 10);
-                    if (!isNaN(val)) {
-                        highlightedLines.add(val);
-                    }
-                }
-            }
-        }
-    }
-    return { lang, filename, highlightedLines };
-}
-function injectHighlightedLines(html, highlightedLines) {
-    if (highlightedLines.size === 0)
-        return html;
-    if (html.includes('class="line"')) {
-        let lineIndex = 0;
-        return html.replace(/class="line"/g, () => {
-            lineIndex++;
-            if (highlightedLines.has(lineIndex)) {
-                return 'class="line highlighted-line"';
-            }
-            return 'class="line"';
-        });
-    }
-    const lines = html.split('\n');
-    const processed = lines.map((line, idx) => {
-        const lineNum = idx + 1;
-        if (highlightedLines.has(lineNum)) {
-            return `<div class="highlighted-line">${line}</div>`;
-        }
-        return line;
-    });
-    return processed.join('\n');
-}
-/** Custom Marked renderer for a button that copies code snippets to clipboard. */
-export function copyCodeButtonRenderer(info) {
-    const rawCode = extractRawCode(info.raw);
-    const escapedCode = encodeURIComponent(rawCode).replace(/'/g, '%27');
-    const { lang, filename, highlightedLines } = parseCodeMeta(info.lang ?? '');
-    let codeContent = info.text.trim().startsWith('<pre')
-        ? info.text
-        : `<pre><code class="language-${lang}">${info.text}</code></pre>`;
-    codeContent = injectHighlightedLines(codeContent, highlightedLines);
-    const filenameHeader = filename
-        ? `<div class="code-block-filename">${filename}</div>`
-        : '';
-    return `<div class="code-block-wrapper" style="position: relative;">${filenameHeader}<button onclick="navigator.clipboard.writeText(decodeURIComponent('${escapedCode}')); this.textContent = 'Copied!'; setTimeout(() => this.textContent = 'Copy', 2000)" class="copy-code-btn" style="position: absolute; right: 0.5rem; top: ${filename ? '2.5rem' : '0.5rem'}; z-index: 10;">Copy</button>${codeContent}</div>`;
-}
-/** Custom Marked renderer for adding hoverable anchors pointing to header IDs. */
-export function headerAnchorsRenderer(info) {
-    const text = info.text ?? (this.parser ? this.parser.parseInline(info.tokens) : info.raw);
-    const depth = info.depth;
-    const id = text
-        .toLowerCase()
-        .replace(/[^\w\s-]/g, '')
-        .replace(/\s+/g, '-');
-    return `<h${depth} id="${id}"><a href="#${id}" class="header-anchor" aria-hidden="true">#</a>${text}</h${depth}>`;
-}

package/dist/frontmatter.js

@@ -1,32 +0,0 @@
-/**
- * Parses header-based metadata blocks (e.g. key: value lines enclosed within =<Header> ... =</Header> tags)
- * at the top of a Markdown document and removes them from the parsed content body.
- */
-export function extractFrontmatter(rawString) {
-    const match = rawString.match(/^=<Header(?:[^>]*)>\r?\n([\s\S]*?)\r?\n=<\/Header>\r?\n([\s\S]*)$/);
-    if (!match)
-        return { content: rawString, meta: {} };
-    const rawMeta = match[1];
-    const content = match[2];
-    const meta = {};
-    for (const line of rawMeta.split('\n')) {
-        const sep = line.indexOf(':');
-        if (sep === -1)
-            continue;
-        const key = line.slice(0, sep).trim();
-        const val = line.slice(sep + 1).trim();
-        if (val === 'true') {
-            meta[key] = true;
-        }
-        else if (val === 'false') {
-            meta[key] = false;
-        }
-        else if (!isNaN(Number(val)) && val !== '') {
-            meta[key] = Number(val);
-        }
-        else {
-            meta[key] = val.replace(/^["']|["']$/g, ''); // strip optional wrapping quotes
-        }
-    }
-    return { content, meta };
-}

package/dist/headings.js

@@ -1,42 +0,0 @@
-/**
- * Scans a Markdown content string and extracts all headings (level 1-6)
- * to populate the table of contents. Supports both standard # headers and custom tag-based headings (=<h1>...=</h1>).
- */
-export function extractHeadings(content) {
-    const headings = [];
-    const lines = content.split('\n');
-    let inCodeBlock = false;
-    for (const line of lines) {
-        const trimmed = line.trim();
-        if (trimmed.startsWith('```')) {
-            inCodeBlock = !inCodeBlock;
-            continue;
-        }
-        if (inCodeBlock)
-            continue;
-        // 1. Match custom single-line tag headings, e.g. =<h1>Getting Started=</h1>
-        const tagMatch = trimmed.match(/^=<h([1-6])(?:[^>]*?)>(.*?)=<\/h\1>$/);
-        if (tagMatch) {
-            const level = parseInt(tagMatch[1], 10);
-            const text = tagMatch[2].trim();
-            const id = text
-                .toLowerCase()
-                .replace(/[^\w\s-]/g, '')
-                .replace(/\s+/g, '-');
-            headings.push({ level, text, id });
-            continue;
-        }
-        // 2. Match standard markdown headings, e.g. # Title
-        const match = line.match(/^(#{1,6})\s+(.+)$/);
-        if (match) {
-            const level = match[1].length;
-            const text = match[2].trim();
-            const id = text
-                .toLowerCase()
-                .replace(/[^\w\s-]/g, '')
-                .replace(/\s+/g, '-');
-            headings.push({ level, text, id });
-        }
-    }
-    return headings;
-}