markstream-svelte 0.0.1-beta.1

package/dist/workers/mermaidCdnWorker.js

@@ -0,0 +1,235 @@
+function stringifyForWorker(value) {
+    return JSON.stringify(value);
+}
+export function buildMermaidCDNWorkerSource(options) {
+    var _a;
+    const mode = (_a = options.mode) !== null && _a !== void 0 ? _a : 'module';
+    const mermaidUrlLiteral = stringifyForWorker(options.mermaidUrl);
+    const initLiteral = stringifyForWorker({
+        startOnLoad: false,
+        securityLevel: 'strict',
+        flowchart: { htmlLabels: false },
+        ...(options.initializeOptions || {}),
+    });
+    const sharedLogic = `
+let DEBUG = false
+let mermaid = null
+let mermaidLoadError = null
+
+function normalizeMermaidModule(mod) {
+  if (!mod)
+    return mod
+  const candidate = mod && mod.default ? mod.default : mod
+  if (candidate && (typeof candidate.render === 'function' || typeof candidate.parse === 'function' || typeof candidate.initialize === 'function'))
+    return candidate
+  if (candidate && candidate.mermaidAPI && (typeof candidate.mermaidAPI.render === 'function' || typeof candidate.mermaidAPI.parse === 'function')) {
+    const api = candidate.mermaidAPI
+    return {
+      ...candidate,
+      render: api.render ? api.render.bind(api) : undefined,
+      parse: api.parse ? api.parse.bind(api) : undefined,
+      initialize: (opts) => {
+        if (typeof candidate.initialize === 'function')
+          return candidate.initialize(opts)
+        return api.initialize ? api.initialize(opts) : undefined
+      },
+    }
+  }
+  if (mod && mod.mermaid && typeof mod.mermaid.parse === 'function')
+    return mod.mermaid
+  return candidate
+}
+
+function applyThemeTo(code, theme) {
+  const themeValue = theme === 'dark' ? 'dark' : 'default'
+  const themeConfig = \`%%{init: {"theme": "\${themeValue}"}}%%\\n\`
+  const trimmed = String(code || '').trimStart()
+  if (trimmed.startsWith('%%{'))
+    return code
+  return themeConfig + code
+}
+
+function findHeaderIndex(lines) {
+  const headerRe = /^(?:graph|flowchart|flowchart\\s+tb|flowchart\\s+lr|sequenceDiagram|gantt|classDiagram|stateDiagram(?:-v2)?|erDiagram|journey|pie|quadrantChart|timeline|xychart(?:-beta)?)\\b/
+  for (let i = 0; i < lines.length; i++) {
+    const line = (lines[i] || '').trim()
+    if (!line || line.startsWith('%%'))
+      continue
+    if (headerRe.test(line))
+      return i
+  }
+  return -1
+}
+
+async function canParse(code, theme) {
+  const themed = applyThemeTo(code, theme)
+  if (mermaid && typeof mermaid.parse === 'function') {
+    await mermaid.parse(themed)
+    return true
+  }
+  throw new Error('mermaid.parse not available in worker')
+}
+
+async function findLastRenderablePrefix(baseCode, theme) {
+  const lines = String(baseCode || '').split('\\n')
+  const headerIndex = findHeaderIndex(lines)
+  if (headerIndex === -1)
+    return null
+  const head = lines.slice(0, headerIndex + 1)
+  await canParse(head.join('\\n'), theme)
+
+  let low = headerIndex + 1
+  let high = lines.length
+  let lastGood = headerIndex + 1
+  let tries = 0
+  const MAX_TRIES = 12
+
+  while (low <= high && tries < MAX_TRIES) {
+    const mid = Math.floor((low + high) / 2)
+    const candidate = [...head, ...lines.slice(headerIndex + 1, mid)].join('\\n')
+    tries += 1
+    try {
+      await canParse(candidate, theme)
+      lastGood = mid
+      low = mid + 1
+    }
+    catch {
+      high = mid - 1
+    }
+  }
+
+  return [...head, ...lines.slice(headerIndex + 1, lastGood)].join('\\n')
+}
+
+function initMermaidOnce() {
+  if (!mermaid)
+    return
+  try {
+    if (typeof mermaid.initialize === 'function')
+      mermaid.initialize(${initLiteral})
+  }
+  catch (e) {
+    if (DEBUG)
+      console.warn('[markstream-svelte:mermaid-cdn-worker] initialize failed', e)
+  }
+}
+
+globalThis.addEventListener('message', async (ev) => {
+  const msg = ev.data || {}
+  if (msg.type === 'init') {
+    DEBUG = !!msg.debug
+    return
+  }
+
+  const id = msg.id
+  const action = msg.action
+  const payload = msg.payload || {}
+
+  if (!mermaid) {
+    const error = mermaidLoadError ? String(mermaidLoadError?.message || mermaidLoadError) : 'Mermaid is not available in worker'
+    globalThis.postMessage({ id, ok: false, error })
+    return
+  }
+
+  try {
+    if (action === 'canParse') {
+      const ok = await canParse(payload.code, payload.theme)
+      globalThis.postMessage({ id, ok: true, result: ok })
+      return
+    }
+    if (action === 'findPrefix') {
+      const result = await findLastRenderablePrefix(payload.code, payload.theme)
+      globalThis.postMessage({ id, ok: true, result })
+      return
+    }
+    globalThis.postMessage({ id, ok: false, error: 'Unknown action' })
+  }
+  catch (e) {
+    globalThis.postMessage({ id, ok: false, error: String(e?.message || e) })
+  }
+})
+`.trimStart();
+    if (mode === 'module') {
+        return `
+${sharedLogic}
+
+let loadPromise = null
+async function loadMermaid() {
+  if (mermaid || mermaidLoadError)
+    return
+  if (!loadPromise) {
+    loadPromise = (async () => {
+      try {
+        const mod = await import(${mermaidUrlLiteral})
+        mermaid = normalizeMermaidModule(mod) || null
+        initMermaidOnce()
+      }
+      catch (e) {
+        mermaidLoadError = e
+      }
+    })()
+  }
+  await loadPromise
+}
+
+await loadMermaid()
+`.trimStart();
+    }
+    return `
+${sharedLogic}
+
+function loadMermaidClassic() {
+  if (mermaid || mermaidLoadError)
+    return
+  try {
+    importScripts(${mermaidUrlLiteral})
+    mermaid = normalizeMermaidModule(globalThis.mermaid) || null
+    initMermaidOnce()
+  }
+  catch (e) {
+    mermaidLoadError = e
+  }
+}
+
+loadMermaidClassic()
+`.trimStart();
+}
+export function createMermaidWorkerFromCDN(options) {
+    var _a, _b;
+    const source = buildMermaidCDNWorkerSource(options);
+    if (typeof Worker === 'undefined' || typeof URL === 'undefined' || typeof Blob === 'undefined') {
+        return {
+            worker: null,
+            dispose: () => { },
+            source,
+        };
+    }
+    const blob = new Blob([source], { type: 'text/javascript' });
+    const url = URL.createObjectURL(blob);
+    let revoked = false;
+    const dispose = () => {
+        if (revoked)
+            return;
+        revoked = true;
+        try {
+            URL.revokeObjectURL(url);
+        }
+        catch {
+            // Ignore revoke failures.
+        }
+    };
+    const mode = (_a = options.mode) !== null && _a !== void 0 ? _a : 'module';
+    const workerOptions = mode === 'module'
+        ? { ...((_b = options.workerOptions) !== null && _b !== void 0 ? _b : {}), type: 'module' }
+        : options.workerOptions;
+    const worker = new Worker(url, workerOptions);
+    if (options.debug) {
+        try {
+            worker.postMessage({ type: 'init', debug: true });
+        }
+        catch {
+            // Ignore init messaging failures.
+        }
+    }
+    return { worker, dispose, source };
+}

package/dist/workers/mermaidParser.worker.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=mermaidParser.worker.d.ts.map

package/dist/workers/mermaidParser.worker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mermaidParser.worker.d.ts","sourceRoot":"","sources":["../../src/workers/mermaidParser.worker.ts"],"names":[],"mappings":"AAiHA,OAAO,EAAE,CAAA"}

package/dist/workers/mermaidParser.worker.js

@@ -0,0 +1,85 @@
+/// <reference lib="webworker" />
+import mermaid from 'mermaid';
+mermaid.initialize({ startOnLoad: false, securityLevel: 'strict', flowchart: { htmlLabels: false } });
+function applyThemeTo(code, theme) {
+    const themeValue = theme === 'dark' ? 'dark' : 'default';
+    const themeConfig = `%%{init: {"theme": "${themeValue}"}}%%\n`;
+    const trimmed = code.trimStart();
+    if (trimmed.startsWith('%%{'))
+        return code;
+    return themeConfig + code;
+}
+function findHeaderIndex(lines) {
+    const headerRe = /^(?:graph|flowchart|flowchart\s+tb|flowchart\s+lr|sequenceDiagram|gantt|classDiagram|stateDiagram(?:-v2)?|erDiagram|journey|pie|quadrantChart|timeline|xychart(?:-beta)?)\b/;
+    for (let index = 0; index < lines.length; index += 1) {
+        const line = lines[index].trim();
+        if (!line || line.startsWith('%%'))
+            continue;
+        if (headerRe.test(line))
+            return index;
+    }
+    return -1;
+}
+async function canParse(code, theme) {
+    const themed = applyThemeTo(code, theme);
+    const anyMermaid = mermaid;
+    if (typeof anyMermaid.parse === 'function') {
+        await anyMermaid.parse(themed);
+        return true;
+    }
+    throw new Error('mermaid.parse not available in worker');
+}
+async function findLastRenderablePrefix(baseCode, theme) {
+    const lines = baseCode.split('\n');
+    const headerIndex = findHeaderIndex(lines);
+    if (headerIndex === -1)
+        return null;
+    const head = lines.slice(0, headerIndex + 1);
+    await canParse(head.join('\n'), theme);
+    let low = headerIndex + 1;
+    let high = lines.length;
+    let lastGood = headerIndex + 1;
+    let tries = 0;
+    const maxTries = 12;
+    while (low <= high && tries < maxTries) {
+        const mid = Math.floor((low + high) / 2);
+        const candidate = [...head, ...lines.slice(headerIndex + 1, mid)].join('\n');
+        tries += 1;
+        try {
+            await canParse(candidate, theme);
+            lastGood = mid;
+            low = mid + 1;
+        }
+        catch {
+            high = mid - 1;
+        }
+    }
+    return [...head, ...lines.slice(headerIndex + 1, lastGood)].join('\n');
+}
+self.onmessage = async (event) => {
+    var _a;
+    const message = event.data;
+    const send = (response) => self.postMessage(response);
+    try {
+        if (message.action === 'canParse') {
+            send({
+                id: message.id,
+                ok: true,
+                result: await canParse(message.payload.code, message.payload.theme),
+            });
+            return;
+        }
+        if (message.action === 'findPrefix') {
+            send({
+                id: message.id,
+                ok: true,
+                result: await findLastRenderablePrefix(message.payload.code, message.payload.theme),
+            });
+            return;
+        }
+        send({ id: message.id, ok: false, error: 'Unknown action' });
+    }
+    catch (error) {
+        send({ id: message.id, ok: false, error: (_a = error === null || error === void 0 ? void 0 : error.message) !== null && _a !== void 0 ? _a : String(error) });
+    }
+};

package/dist/workers/mermaidWorkerClient.d.ts

@@ -0,0 +1,16 @@
+type Theme = 'light' | 'dark';
+export declare function setMermaidWorkerClientDebug(enabled: boolean): void;
+export declare function setMermaidWorkerMaxConcurrency(value: number): void;
+export declare function getMermaidWorkerLoad(): {
+    inFlight: number;
+    max: number;
+};
+export declare const MERMAID_WORKER_BUSY_CODE = "WORKER_BUSY";
+export declare const MERMAID_DISABLED_CODE = "MERMAID_DISABLED";
+export declare function setMermaidWorker(nextWorker: Worker): void;
+export declare function clearMermaidWorker(): void;
+export declare function canParseOffthread(code: string, theme: Theme, timeout?: number): Promise<boolean>;
+export declare function findPrefixOffthread(code: string, theme: Theme, timeout?: number): Promise<string>;
+export declare function terminateWorker(): void;
+export {};
+//# sourceMappingURL=mermaidWorkerClient.d.ts.map

package/dist/workers/mermaidWorkerClient.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mermaidWorkerClient.d.ts","sourceRoot":"","sources":["../../src/workers/mermaidWorkerClient.ts"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM,CAAA;AAc7B,wBAAgB,2BAA2B,CAAC,OAAO,EAAE,OAAO,QAE3D;AAED,wBAAgB,8BAA8B,CAAC,KAAK,EAAE,MAAM,QAG3D;AAED,wBAAgB,oBAAoB;;;EAEnC;AAED,eAAO,MAAM,wBAAwB,gBAAgB,CAAA;AACrD,eAAO,MAAM,qBAAqB,qBAAqB,CAAA;AAEvD,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,MAAM,QAoDlD;AAED,wBAAgB,kBAAkB,SAcjC;AAgFD,wBAAsB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,SAAO,oBAEjF;AAED,wBAAsB,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,SAAO,mBAEnF;AAED,wBAAgB,eAAe,SAY9B"}

package/dist/workers/mermaidWorkerClient.js

@@ -0,0 +1,170 @@
+import { isMermaidEnabled } from '../optional/mermaid';
+let worker = null;
+let workerInitError = null;
+const rpcMap = new Map();
+let maxConcurrency = 5;
+let debugClient = false;
+export function setMermaidWorkerClientDebug(enabled) {
+    debugClient = !!enabled;
+}
+export function setMermaidWorkerMaxConcurrency(value) {
+    if (Number.isFinite(value) && value > 0)
+        maxConcurrency = Math.floor(value);
+}
+export function getMermaidWorkerLoad() {
+    return { inFlight: rpcMap.size, max: maxConcurrency };
+}
+export const MERMAID_WORKER_BUSY_CODE = 'WORKER_BUSY';
+export const MERMAID_DISABLED_CODE = 'MERMAID_DISABLED';
+export function setMermaidWorker(nextWorker) {
+    worker = nextWorker;
+    workerInitError = null;
+    const current = nextWorker;
+    worker.onmessage = (event) => {
+        if (worker !== current)
+            return;
+        const { id, ok, result, error } = event.data || {};
+        const active = rpcMap.get(id);
+        if (!active)
+            return;
+        if (ok === false || error)
+            active.reject(new Error(error || 'Unknown error'));
+        else
+            active.resolve(result);
+    };
+    worker.onerror = (event) => {
+        var _a, _b;
+        if (worker !== current)
+            return;
+        if (rpcMap.size === 0) {
+            (_a = console.debug) === null || _a === void 0 ? void 0 : _a.call(console, '[markstream-svelte:mermaidWorkerClient] Worker error (idle):', (event === null || event === void 0 ? void 0 : event.message) || event);
+            return;
+        }
+        try {
+            if (debugClient)
+                console.error('[markstream-svelte:mermaidWorkerClient] Worker error:', (event === null || event === void 0 ? void 0 : event.message) || event);
+            else
+                (_b = console.debug) === null || _b === void 0 ? void 0 : _b.call(console, '[markstream-svelte:mermaidWorkerClient] Worker error:', (event === null || event === void 0 ? void 0 : event.message) || event);
+        }
+        catch {
+            // Ignore logging failures.
+        }
+        for (const [, active] of rpcMap.entries())
+            active.reject(new Error(`Worker error: ${event.message}`));
+        rpcMap.clear();
+    };
+    worker.onmessageerror = (event) => {
+        var _a;
+        if (worker !== current)
+            return;
+        if (rpcMap.size === 0) {
+            (_a = console.debug) === null || _a === void 0 ? void 0 : _a.call(console, '[markstream-svelte:mermaidWorkerClient] Worker messageerror (idle):', event);
+            return;
+        }
+        for (const [, active] of rpcMap.entries())
+            active.reject(new Error('Worker messageerror'));
+        rpcMap.clear();
+    };
+}
+export function clearMermaidWorker() {
+    var _a;
+    if (worker) {
+        try {
+            for (const [, active] of rpcMap.entries())
+                active.reject(new Error('Worker cleared'));
+            rpcMap.clear();
+            (_a = worker.terminate) === null || _a === void 0 ? void 0 : _a.call(worker);
+        }
+        catch {
+            // Ignore worker termination failures.
+        }
+    }
+    worker = null;
+    workerInitError = null;
+}
+function ensureWorker() {
+    if (worker)
+        return worker;
+    workerInitError = new Error('[markstream-svelte:mermaidWorkerClient] No worker instance set. Please inject a Worker via setMermaidWorker().');
+    workerInitError.name = 'WorkerInitError';
+    workerInitError.code = 'WORKER_INIT_ERROR';
+    return null;
+}
+function callWorker(action, payload, timeout = 1400) {
+    if (!isMermaidEnabled()) {
+        const error = new Error('Mermaid rendering disabled');
+        error.name = 'MermaidDisabled';
+        error.code = MERMAID_DISABLED_CODE;
+        return Promise.reject(error);
+    }
+    if (workerInitError)
+        return Promise.reject(workerInitError);
+    const activeWorker = ensureWorker();
+    if (!activeWorker)
+        return Promise.reject(workerInitError);
+    if (rpcMap.size >= maxConcurrency) {
+        const error = new Error('Worker busy');
+        error.name = 'WorkerBusy';
+        error.code = MERMAID_WORKER_BUSY_CODE;
+        error.inFlight = rpcMap.size;
+        error.max = maxConcurrency;
+        return Promise.reject(error);
+    }
+    return new Promise((resolve, reject) => {
+        const id = Math.random().toString(36).slice(2);
+        let settled = false;
+        let timeoutId = null;
+        const cleanup = () => {
+            if (settled)
+                return;
+            settled = true;
+            if (timeoutId != null)
+                clearTimeout(timeoutId);
+            rpcMap.delete(id);
+        };
+        rpcMap.set(id, {
+            resolve: (value) => {
+                cleanup();
+                resolve(value);
+            },
+            reject: (error) => {
+                cleanup();
+                reject(error);
+            },
+        });
+        try {
+            activeWorker.postMessage({ id, action, payload });
+        }
+        catch (error) {
+            rpcMap.delete(id);
+            reject(error);
+            return;
+        }
+        timeoutId = setTimeout(() => {
+            const error = new Error('Worker call timed out');
+            error.name = 'WorkerTimeout';
+            error.code = 'WORKER_TIMEOUT';
+            const pending = rpcMap.get(id);
+            pending === null || pending === void 0 ? void 0 : pending.reject(error);
+        }, timeout);
+    });
+}
+export async function canParseOffthread(code, theme, timeout = 1400) {
+    return await callWorker('canParse', { code, theme }, timeout);
+}
+export async function findPrefixOffthread(code, theme, timeout = 1400) {
+    return await callWorker('findPrefix', { code, theme }, timeout);
+}
+export function terminateWorker() {
+    if (worker) {
+        try {
+            for (const [, active] of rpcMap.entries())
+                active.reject(new Error('Worker terminated'));
+            rpcMap.clear();
+            worker.terminate();
+        }
+        finally {
+            worker = null;
+        }
+    }
+}

package/package.json

@@ -0,0 +1,95 @@
+{
+  "name": "markstream-svelte",
+  "type": "module",
+  "version": "0.0.1-beta.1",
+  "description": "Svelte Markdown renderer for Markstream, aligned with markstream-vue and markstream-react.",
+  "author": "Simon He",
+  "license": "MIT",
+  "homepage": "https://github.com/Simon-He95/markstream-vue#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Simon-He95/markstream-vue.git",
+    "directory": "packages/markstream-svelte"
+  },
+  "bugs": {
+    "url": "https://github.com/Simon-He95/markstream-vue/issues"
+  },
+  "keywords": [
+    "svelte",
+    "markdown",
+    "markdown-renderer",
+    "streaming-markdown",
+    "markstream",
+    "markstream-svelte"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "svelte": "./dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "svelte": "./dist/index.js",
+      "import": "./dist/index.js"
+    },
+    "./index.css": "./dist/index.css",
+    "./index.px.css": "./dist/index.px.css",
+    "./index.tailwind.css": "./dist/index.tailwind.css",
+    "./workers/katexRenderer.worker": "./dist/workers/katexRenderer.worker.js",
+    "./workers/mermaidParser.worker": "./dist/workers/mermaidParser.worker.js"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "@antv/infographic": "^0.2.3",
+    "@terrastruct/d2": ">=0.1.33",
+    "katex": ">=0.16.22",
+    "mermaid": ">=11",
+    "stream-monaco": ">=0.0.40",
+    "svelte": ">=5"
+  },
+  "peerDependenciesMeta": {
+    "@antv/infographic": {
+      "optional": true
+    },
+    "@terrastruct/d2": {
+      "optional": true
+    },
+    "katex": {
+      "optional": true
+    },
+    "mermaid": {
+      "optional": true
+    },
+    "stream-monaco": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@floating-ui/dom": "^1.7.6",
+    "stream-markdown-parser": "0.0.92"
+  },
+  "devDependencies": {
+    "@sveltejs/package": "^2.5.7",
+    "@sveltejs/vite-plugin-svelte": "^6.2.4",
+    "@types/node": "^18.19.130",
+    "autoprefixer": "^10.4.27",
+    "postcss-cli": "^11.0.1",
+    "svelte": "^5.55.5",
+    "svelte-check": "^4.4.8",
+    "tailwindcss": "^3.4.19",
+    "typescript": "^5.9.3",
+    "vite": "^7.3.1"
+  },
+  "scripts": {
+    "build": "svelte-package -i src -o dist && postcss src/index.css -o dist/index.css && cp dist/index.css dist/index.tailwind.css && node ../../scripts/generate-px-css.mjs",
+    "dev": "vite dev",
+    "preview": "vite preview",
+    "typecheck": "svelte-check --tsconfig ./tsconfig.json",
+    "release": "bumpp --commit --no-tag --no-push && pnpm publish --access public && node ../../scripts/tag-package.mjs --package-json package.json --push"
+  }
+}