@barzhsieh/nuxt-content-mermaid 2.1.2 → 2.2.0

package/dist/runtime/utils/index.js

@@ -0,0 +1,113 @@
+let renderQueue = Promise.resolve();
+let queueSize = 0;
+export function enqueueRender(task, debug = false) {
+  queueSize++;
+  if (debug) {
+    console.log(`[nuxt-content-mermaid] \u{1F535} Enqueueing task. Queue size: ${queueSize}`);
+  }
+  const wrappedTask = async () => {
+    if (debug) {
+      console.log(`[nuxt-content-mermaid] \u{1F7E2} Starting render task. Pending: ${queueSize - 1}`);
+    }
+    try {
+      await task();
+    } catch (e) {
+      console.error("[nuxt-content-mermaid] Render error:", e);
+      throw e;
+    } finally {
+      queueSize--;
+      if (debug) {
+        console.log(`[nuxt-content-mermaid] \u2705 Task finished. Remaining: ${queueSize}`);
+      }
+    }
+  };
+  renderQueue = renderQueue.then(wrappedTask).catch((e) => {
+    if (debug) {
+      console.error("[nuxt-content-mermaid] \u274C Queue chain caught error:", e);
+    }
+  });
+  return renderQueue;
+}
+export function parseSizeToPx(value, defaultSize = 14) {
+  if (value === void 0 || value === null) return defaultSize;
+  if (typeof value === "number") return value;
+  const match = value.match(/^([\d.]+)(px|rem|em)?$/);
+  if (!match) return defaultSize;
+  const num = Number.parseFloat(match[1] || "0");
+  const unit = match[2] || "px";
+  if (unit === "rem" || unit === "em") {
+    return num * 16;
+  }
+  return num;
+}
+export function promiseTimeout(ms, throwOnTimeout = false, reason = "Timeout") {
+  return new Promise((resolve, reject) => {
+    if (throwOnTimeout)
+      setTimeout(() => reject(reason), ms);
+    else
+      setTimeout(resolve, ms);
+  });
+}
+export function identity(arg) {
+  return arg;
+}
+export function createSingletonPromise(fn) {
+  let _promise;
+  function wrapper() {
+    if (!_promise)
+      _promise = fn();
+    return _promise;
+  }
+  wrapper.reset = async () => {
+    const _prev = _promise;
+    _promise = void 0;
+    if (_prev)
+      await _prev;
+  };
+  return wrapper;
+}
+export function invoke(fn) {
+  return fn();
+}
+export function containsProp(obj, ...props) {
+  return props.some((k) => k in obj);
+}
+export function increaseWithUnit(target, delta) {
+  if (typeof target === "number")
+    return target + delta;
+  const value = target.match(/^-?\d+\.?\d*/)?.[0] || "";
+  const unit = target.slice(value.length);
+  const result = Number.parseFloat(value) + delta;
+  if (Number.isNaN(result))
+    return target;
+  return result + unit;
+}
+export function objectPick(obj, keys, omitUndefined = false) {
+  return keys.reduce((n, k) => {
+    if (k in obj) {
+      if (!omitUndefined || obj[k] !== void 0)
+        n[k] = obj[k];
+    }
+    return n;
+  }, {});
+}
+export function objectOmit(obj, keys, omitUndefined = false) {
+  return Object.fromEntries(Object.entries(obj).filter(([key, value]) => {
+    return (!omitUndefined || value !== void 0) && !keys.includes(key);
+  }));
+}
+export function objectEntries(obj) {
+  return Object.entries(obj);
+}
+export function toArray(value) {
+  return Array.isArray(value) ? value : [value];
+}
+export function escapeHtmlAttribute(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/'/g, "&#39;");
+}
+export function stringifyInlineValue(value) {
+  return escapeHtmlAttribute(JSON.stringify(value));
+}
+export * from "./is.js";
+export * from "./vue.js";
+export * from "./mermaid-transform.js";

package/dist/runtime/utils/is.d.ts

@@ -0,0 +1,15 @@
+export declare const isClient: boolean;
+export declare const isWorker: boolean;
+export declare const isDef: <T = unknown>(val?: T) => val is T;
+export declare const notNullish: <T = unknown>(val?: T | null | undefined) => val is T;
+export declare const assert: (condition: boolean, ...infos: unknown[]) => void;
+export declare const isObject: (val: unknown) => val is object;
+export declare const now: () => number;
+export declare const timestamp: () => number;
+export declare const clamp: (n: number, min: number, max: number) => number;
+export declare const noop: () => void;
+export declare const rand: (min: number, max: number) => number;
+export declare const hasOwn: <T extends object, K extends keyof T>(val: T, key: K) => key is K;
+export declare const isIOS: boolean;
+export declare function isRecord(value: unknown): value is Record<string, unknown>;
+export declare function isNonEmptyRecord(value: Record<string, unknown>): boolean;

package/dist/runtime/utils/is.js

@@ -0,0 +1,31 @@
+export const isClient = typeof window !== "undefined" && typeof document !== "undefined";
+export const isWorker = typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
+export const isDef = (val) => typeof val !== "undefined";
+export const notNullish = (val) => val != null;
+export const assert = (condition, ...infos) => {
+  if (!condition)
+    console.warn(...infos);
+};
+const toString = Object.prototype.toString;
+export const isObject = (val) => toString.call(val) === "[object Object]";
+export const now = () => Date.now();
+export const timestamp = () => +Date.now();
+export const clamp = (n, min, max) => Math.min(max, Math.max(min, n));
+export const noop = () => {
+};
+export const rand = (min, max) => {
+  min = Math.ceil(min);
+  max = Math.floor(max);
+  return Math.floor(Math.random() * (max - min + 1)) + min;
+};
+export const hasOwn = (val, key) => Object.prototype.hasOwnProperty.call(val, key);
+export const isIOS = /* @__PURE__ */ getIsIOS();
+function getIsIOS() {
+  return isClient && !!window?.navigator?.userAgent && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || window?.navigator?.maxTouchPoints > 2 && /iPad|Macintosh/.test(window?.navigator.userAgent));
+}
+export function isRecord(value) {
+  return !!value && typeof value === "object" && !Array.isArray(value);
+}
+export function isNonEmptyRecord(value) {
+  return Object.keys(value).length > 0;
+}

package/dist/runtime/utils/mermaid-transform.d.ts

@@ -0,0 +1,18 @@
+export type MermaidFrontmatterInfo = {
+    data: Record<string, unknown>;
+    startIndex: number;
+    endIndex: number;
+    indent: string;
+};
+export type MermaidInlineOverrides = {
+    title?: string;
+    displayMode?: string;
+    config?: Record<string, unknown>;
+    toolbar?: Record<string, unknown>;
+};
+export declare function parseMermaidFrontmatter(rawCode: string, newline: string): MermaidFrontmatterInfo | null;
+export declare function parseInlineAttrs(info: string): Record<string, unknown> | null;
+export declare function extractToolbarProps(source: Record<string, unknown> | null | undefined): Record<string, unknown> | undefined;
+export declare function extractMermaidInlineOverrides(source: Record<string, unknown> | null): MermaidInlineOverrides | null;
+export declare function applyMermaidFrontmatterOverrides(rawCode: string, newline: string, frontmatterInfo: MermaidFrontmatterInfo | null, overrides: MermaidInlineOverrides, fallbackIndent: string): string;
+export declare function mergeToolbarProps(yamlToolbar: Record<string, unknown> | undefined, inlineToolbar: Record<string, unknown> | undefined): {} | undefined;

package/dist/runtime/utils/mermaid-transform.js

@@ -0,0 +1,345 @@
+import { defu } from "defu";
+import destr from "destr";
+import { parse as parseYaml, stringify as stringifyYaml } from "yaml";
+import { isNonEmptyRecord, isRecord } from "./is.js";
+const UNSAFE_INLINE_KEYS = /* @__PURE__ */ new Set(["__proto__", "prototype", "constructor"]);
+export function parseMermaidFrontmatter(rawCode, newline) {
+  const lines = rawCode.split(newline);
+  let startIndex = 0;
+  while (startIndex < lines.length) {
+    const line = lines[startIndex];
+    const trimmed = line.trim();
+    if (!trimmed) {
+      startIndex += 1;
+      continue;
+    }
+    if (isMermaidDirectiveStart(line)) {
+      startIndex = skipMermaidDirective(lines, startIndex);
+      continue;
+    }
+    if (isMermaidCommentLine(line)) {
+      startIndex += 1;
+      continue;
+    }
+    break;
+  }
+  if (startIndex >= lines.length)
+    return null;
+  const startLine = lines[startIndex];
+  if (startLine.trim() !== "---")
+    return null;
+  const indentMatch = startLine.match(/^\s*/);
+  const indent = indentMatch ? indentMatch[0] : "";
+  let endIndex = -1;
+  for (let i = startIndex + 1; i < lines.length; i++) {
+    if (lines[i].trim() === "---") {
+      endIndex = i;
+      break;
+    }
+  }
+  if (endIndex === -1)
+    return null;
+  const yamlLines = lines.slice(startIndex + 1, endIndex).map((line) => line.startsWith(indent) ? line.slice(indent.length) : line);
+  const yamlRaw = yamlLines.join("\n").trim();
+  try {
+    const data = yamlRaw ? parseYaml(yamlRaw) : {};
+    if (!isRecord(data))
+      return null;
+    return {
+      data,
+      startIndex,
+      endIndex,
+      indent
+    };
+  } catch {
+    return null;
+  }
+}
+function isMermaidDirectiveStart(line) {
+  return line.trim().startsWith("%%{");
+}
+function isMermaidCommentLine(line) {
+  const trimmed = line.trim();
+  return trimmed.startsWith("%%") && !trimmed.startsWith("%%{");
+}
+function skipMermaidDirective(lines, startIndex) {
+  let index = startIndex;
+  while (index < lines.length) {
+    if (lines[index].includes("}%%"))
+      return index + 1;
+    index += 1;
+  }
+  return lines.length;
+}
+export function parseInlineAttrs(info) {
+  const attrsBlock = extractInlineAttrsBlock(info);
+  if (!attrsBlock)
+    return null;
+  return parseInlineAttrsBlock(attrsBlock);
+}
+function extractInlineAttrsBlock(info) {
+  const startIndex = info.indexOf("{");
+  if (startIndex === -1)
+    return null;
+  let depth = 0;
+  let quote = null;
+  for (let i = startIndex; i < info.length; i++) {
+    const char = info[i];
+    if (quote) {
+      if (char === quote && info[i - 1] !== "\\")
+        quote = null;
+      continue;
+    }
+    if (char === '"' || char === "'") {
+      quote = char;
+      continue;
+    }
+    if (char === "{") {
+      depth += 1;
+      continue;
+    }
+    if (char === "}") {
+      depth -= 1;
+      if (depth === 0)
+        return info.slice(startIndex + 1, i);
+    }
+  }
+  return null;
+}
+function parseInlineAttrsBlock(raw) {
+  const result = {};
+  let index = 0;
+  while (index < raw.length) {
+    index = skipSeparators(raw, index);
+    if (index >= raw.length)
+      break;
+    const keyStart = index;
+    while (index < raw.length && isAttrKeyChar(raw[index]))
+      index += 1;
+    const key = raw.slice(keyStart, index).trim();
+    if (!key)
+      break;
+    index = skipWhitespace(raw, index);
+    let value = true;
+    if (index < raw.length && (raw[index] === "=" || raw[index] === ":")) {
+      index += 1;
+      index = skipWhitespace(raw, index);
+      const { value: rawValue, nextIndex, quoted } = readAttributeValue(raw, index);
+      index = nextIndex;
+      value = parseAttributeValue(rawValue, quoted);
+    }
+    setNestedValue(result, key, value);
+  }
+  return result;
+}
+function skipWhitespace(input, index) {
+  let cursor = index;
+  while (cursor < input.length) {
+    const char = input[cursor];
+    if (char !== " " && char !== "	" && char !== "\n" && char !== "\r")
+      break;
+    cursor += 1;
+  }
+  return cursor;
+}
+function skipSeparators(input, index) {
+  let cursor = index;
+  while (cursor < input.length) {
+    const char = input[cursor];
+    if (char !== " " && char !== "	" && char !== "\n" && char !== "\r" && char !== ";")
+      break;
+    cursor += 1;
+  }
+  return cursor;
+}
+function isAttrKeyChar(char) {
+  return /[\w.-]/.test(char);
+}
+function readAttributeValue(input, start) {
+  const char = input[start];
+  if (char === '"' || char === "'")
+    return readQuotedValue(input, start);
+  if (char === "{" || char === "[")
+    return readBalancedValue(input, start);
+  let end = start;
+  while (end < input.length) {
+    const current = input[end];
+    if (current === ";" || current === " " || current === "	" || current === "\n" || current === "\r")
+      break;
+    end += 1;
+  }
+  return { value: input.slice(start, end), nextIndex: end, quoted: false };
+}
+function readQuotedValue(input, start) {
+  const quote = input[start];
+  let cursor = start + 1;
+  let result = "";
+  while (cursor < input.length) {
+    const char = input[cursor];
+    if (char === "\\" && cursor + 1 < input.length) {
+      result += input[cursor + 1];
+      cursor += 2;
+      continue;
+    }
+    if (char === quote) {
+      return { value: result, nextIndex: cursor + 1, quoted: true };
+    }
+    result += char;
+    cursor += 1;
+  }
+  return { value: result, nextIndex: cursor, quoted: true };
+}
+function readBalancedValue(input, start) {
+  const open = input[start];
+  const close = open === "{" ? "}" : "]";
+  let depth = 0;
+  let quote = null;
+  for (let i = start; i < input.length; i++) {
+    const char = input[i];
+    if (quote) {
+      if (char === quote && input[i - 1] !== "\\")
+        quote = null;
+      continue;
+    }
+    if (char === '"' || char === "'") {
+      quote = char;
+      continue;
+    }
+    if (char === open) {
+      depth += 1;
+      continue;
+    }
+    if (char === close) {
+      depth -= 1;
+      if (depth === 0) {
+        return { value: input.slice(start, i + 1), nextIndex: i + 1, quoted: false };
+      }
+    }
+  }
+  return { value: input.slice(start), nextIndex: input.length, quoted: false };
+}
+function parseAttributeValue(raw, quoted) {
+  const value = raw.trim();
+  if (!value)
+    return "";
+  const isStructured = value.startsWith("{") || value.startsWith("[");
+  if (quoted) {
+    if (!isStructured)
+      return value;
+    return parseStructuredValue(value);
+  }
+  if (isStructured)
+    return parseStructuredValue(value);
+  return destr(value);
+}
+function parseStructuredValue(value) {
+  const parsed = destr(value);
+  if (parsed !== value)
+    return parsed;
+  try {
+    const yamlParsed = parseYaml(value);
+    if (isRecord(yamlParsed) || Array.isArray(yamlParsed))
+      return yamlParsed;
+  } catch {
+  }
+  return value;
+}
+function setNestedValue(target, path, value) {
+  const keys = path.split(".").filter(Boolean);
+  if (!keys.length)
+    return;
+  let current = target;
+  for (let i = 0; i < keys.length; i++) {
+    const key = keys[i];
+    if (UNSAFE_INLINE_KEYS.has(key))
+      return;
+    if (i === keys.length - 1) {
+      current[key] = value;
+      return;
+    }
+    const existing = current[key];
+    if (!isRecord(existing)) {
+      current[key] = {};
+    }
+    current = current[key];
+  }
+}
+export function extractToolbarProps(source) {
+  if (!source)
+    return void 0;
+  return isRecord(source.toolbar) ? source.toolbar : void 0;
+}
+export function extractMermaidInlineOverrides(source) {
+  if (!source)
+    return null;
+  const overrides = {};
+  let hasOverrides = false;
+  if (source.title !== void 0) {
+    overrides.title = String(source.title);
+    hasOverrides = true;
+  }
+  if (source.displayMode !== void 0) {
+    overrides.displayMode = String(source.displayMode);
+    hasOverrides = true;
+  }
+  if (isRecord(source.config)) {
+    overrides.config = source.config;
+    hasOverrides = true;
+  }
+  if (isRecord(source.toolbar)) {
+    overrides.toolbar = source.toolbar;
+    hasOverrides = true;
+  }
+  return hasOverrides ? overrides : null;
+}
+export function applyMermaidFrontmatterOverrides(rawCode, newline, frontmatterInfo, overrides, fallbackIndent) {
+  const mergedFrontmatter = mergeMermaidFrontmatter(frontmatterInfo?.data, overrides);
+  const frontmatterLines = serializeMermaidFrontmatter(
+    mergedFrontmatter,
+    frontmatterInfo?.indent ?? fallbackIndent
+  );
+  const lines = rawCode.split(newline);
+  if (frontmatterInfo) {
+    const before = lines.slice(0, frontmatterInfo.startIndex);
+    const after = lines.slice(frontmatterInfo.endIndex + 1);
+    return [...frontmatterLines, ...before, ...after].join(newline);
+  }
+  return [
+    ...frontmatterLines,
+    ...lines
+  ].join(newline);
+}
+function mergeMermaidFrontmatter(existing, overrides) {
+  const merged = existing ? { ...existing } : {};
+  if (overrides.title !== void 0)
+    merged.title = overrides.title;
+  if (overrides.displayMode !== void 0)
+    merged.displayMode = overrides.displayMode;
+  if (overrides.config && isRecord(overrides.config)) {
+    const baseConfig = isRecord(merged.config) ? merged.config : void 0;
+    merged.config = defu({}, overrides.config, baseConfig || {});
+  }
+  if (overrides.toolbar && isRecord(overrides.toolbar)) {
+    const baseToolbar = isRecord(merged.toolbar) ? merged.toolbar : void 0;
+    merged.toolbar = defu({}, overrides.toolbar, baseToolbar || {});
+  }
+  return merged;
+}
+export function mergeToolbarProps(yamlToolbar, inlineToolbar) {
+  const merged = defu(
+    {},
+    inlineToolbar || {},
+    yamlToolbar || {}
+  );
+  return isNonEmptyRecord(merged) ? merged : void 0;
+}
+function serializeMermaidFrontmatter(frontmatter, indent) {
+  const yaml = stringifyYaml(frontmatter).trim();
+  const yamlLines = yaml ? yaml.split("\n").map((line) => `${indent}${line}`) : [];
+  const delimiter = `${indent}---`;
+  return [
+    delimiter,
+    ...yamlLines,
+    delimiter
+  ];
+}

package/dist/runtime/utils/vue.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentInternalInstance } from 'vue';
+export declare function getLifeCycleTarget(target?: ComponentInternalInstance | null): ComponentInternalInstance | null;

package/dist/runtime/utils/vue.js

@@ -0,0 +1,4 @@
+import { getCurrentInstance } from "vue";
+export function getLifeCycleTarget(target) {
+  return target || getCurrentInstance();
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barzhsieh/nuxt-content-mermaid",
-  "version": "2.1.2",
+  "version": "2.2.0",
   "description": "A Nuxt module designed for integrating Mermaid with `@nuxt/content`. It automatically converts `mermaid` code blocks in Markdown into responsive chart components, and supports lazy loading and dark/light theme switching.",
   "keywords": [
     "nuxt",
@@ -38,7 +38,9 @@
   "dependencies": {
     "@nuxt/kit": "4.2.1",
     "defu": "^6.1.4",
-    "mermaid": "^11.12.2"
+    "destr": "^2.0.5",
+    "mermaid": "^11.12.2",
+    "yaml": "^2.8.2"
   },
   "peerDependencies": {
     "@nuxt/content": ">=3.5.0",

package/dist/runtime/utils.d.ts

@@ -1 +0,0 @@
-export declare function enqueueRender(task: () => Promise<void>, debug?: boolean): Promise<void>;

package/dist/runtime/utils.js

@@ -1,30 +0,0 @@
-let renderQueue = Promise.resolve();
-let queueSize = 0;
-export function enqueueRender(task, debug = false) {
-  queueSize++;
-  if (debug) {
-    console.log(`[nuxt-content-mermaid] \u{1F535} Enqueueing task. Queue size: ${queueSize}`);
-  }
-  const wrappedTask = async () => {
-    if (debug) {
-      console.log(`[nuxt-content-mermaid] \u{1F7E2} Starting render task. Pending: ${queueSize - 1}`);
-    }
-    try {
-      await task();
-    } catch (e) {
-      console.error("[nuxt-content-mermaid] Render error:", e);
-      throw e;
-    } finally {
-      queueSize--;
-      if (debug) {
-        console.log(`[nuxt-content-mermaid] \u2705 Task finished. Remaining: ${queueSize}`);
-      }
-    }
-  };
-  renderQueue = renderQueue.then(wrappedTask).catch((e) => {
-    if (debug) {
-      console.error("[nuxt-content-mermaid] \u274C Queue chain caught error:", e);
-    }
-  });
-  return renderQueue;
-}