@sliiu/present-renderer 0.0.0-stage → 0.1.0

package/dist/cjs/entrance-hide.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyEntranceHideToScene = applyEntranceHideToScene;
+exports.revealDesignedAppearance = revealDesignedAppearance;
+const core_1 = require("@sliiu/present-core");
+/**
+ * 放映专用：按当前 timing 把 entrance 目标在 scene 上藏起来（opacity=0 / 段落级 hide）。
+ *
+ * 编辑器会 `forceVisibleForEdit`，让入场图形在编辑态全部可见；分享 / 导出 / 直播快照
+ * 打的是这份数据。播放器必须在这里重算 hidden-until-entrance，不能依赖 shape.opacity。
+ */
+function applyEntranceHideToScene(scene, slide) {
+    const st = (0, core_1.computeInitialEntranceState)(slide);
+    for (const s of st.hiddenShapes) {
+        const node = scene.root.findById(s.id);
+        if (node)
+            node.setProperty("opacity", 0);
+    }
+    for (const o of st.paraOverrides) {
+        const node = scene.root.findById(o.shapeId);
+        if (!node)
+            continue;
+        if (o.opacity !== undefined)
+            node.setParaProperty(o.paraIdx, "opacity", o.opacity);
+    }
+    for (const o of st.charOverrides) {
+        const node = scene.root.findById(o.shapeId);
+        if (!node)
+            continue;
+        if (o.opacity !== undefined) {
+            node.setCharRangeProperty(o.paraIdx, o.unit, o.start, o.end, "opacity", o.opacity);
+        }
+    }
+}
+/**
+ * 放映缩略图 / 下一张预览：画出设计稿，而不是「点击前隐藏」的初态。
+ *
+ * 进入放映时编辑器会把 entrance 目标的 opacity 写回 0。播放舞台要这个初态，
+ * 缩略图如果跟着藏，演讲者看到的是空白页。只改 scene，不改 slide 数据。
+ */
+function revealDesignedAppearance(scene, slide) {
+    const st = (0, core_1.computeInitialEntranceState)(slide);
+    for (const s of st.hiddenShapes) {
+        const node = scene.root.findById(s.id);
+        if (node)
+            node.setProperty("opacity", 1);
+    }
+    for (const o of st.paraOverrides) {
+        const node = scene.root.findById(o.shapeId);
+        if (!node)
+            continue;
+        if (o.opacity === 0)
+            node.setParaProperty(o.paraIdx, "opacity", 1);
+    }
+    for (const o of st.charOverrides) {
+        const node = scene.root.findById(o.shapeId);
+        if (!node)
+            continue;
+        if (o.opacity === 0) {
+            node.setCharRangeProperty(o.paraIdx, o.unit, o.start, o.end, "opacity", 1);
+        }
+    }
+}

package/dist/cjs/font-stack.js

@@ -0,0 +1,103 @@
+"use strict";
+/**
+ * Font fallback for the browser. OOXML names one typeface per run ("Inter", "Songti SC"); when the
+ * machine lacks it PowerPoint substitutes a face of the same class (sans / serif / mono), but a
+ * browser given a bare unknown family falls back to its default — usually a serif — so a sans deck
+ * comes up in Times. Append the class-matched generic (plus CJK faces so Han glyphs never hit a
+ * Latin-only fallback) to every family that is not already a stack.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withFontFallback = withFontFallback;
+const SERIF = /\b(serif|times|georgia|garamond|cambria|palatino|baskerville|didot|bodoni|playfair|fraunces|merriweather|lora|libre|spectral|songti|simsun|song|ming|mincho|kaiti|kai|fangsong|batang)\b|宋体|楷体|仿宋|书宋|明朝/i;
+const MONO = /\b(mono|monospace|consolas|menlo|courier|code|inconsolata|fira code|source code|jetbrains|plex mono|space mono)\b/i;
+const CJK_FALLBACK = `"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC"`;
+const CJK_SERIF_FALLBACK = `"Songti SC", "SimSun", "Noto Serif CJK SC"`;
+// OOXML 写的是 Windows 字体名。同一种字在 macOS 上登记成另一个 family，
+// 名字对不上时浏览器会跳过它，后面的拉丁字体就把数字和英文抢走。
+// 别名紧跟在原名后面，原名存在时仍优先用原名。
+const CJK_ALIASES = {
+    黑体: ["SimHei", "Heiti SC", "STHeiti", "华文黑体"],
+    SimHei: ["黑体", "Heiti SC", "STHeiti"],
+    宋体: ["SimSun", "Songti SC", "STSong", "华文宋体"],
+    SimSun: ["宋体", "Songti SC", "STSong"],
+    新宋体: ["NSimSun", "Songti SC", "SimSun"],
+    NSimSun: ["新宋体", "Songti SC"],
+    微软雅黑: ["Microsoft YaHei", "PingFang SC", "Hiragino Sans GB"],
+    "Microsoft YaHei": ["微软雅黑", "PingFang SC", "Hiragino Sans GB"],
+    楷体: ["KaiTi", "Kaiti SC", "STKaiti", "华文楷体"],
+    KaiTi: ["楷体", "Kaiti SC", "STKaiti"],
+    仿宋: ["FangSong", "STFangsong", "华文仿宋"],
+    FangSong: ["仿宋", "STFangsong"],
+    等线: ["DengXian", "Microsoft YaHei", "PingFang SC"],
+};
+const cache = new Map();
+/** `family` as a CSS font-family list with a class-matched generic fallback appended. */
+function withFontFallback(family) {
+    if (!family)
+        return `${CJK_FALLBACK}, sans-serif`;
+    const hit = cache.get(family);
+    if (hit)
+        return hit;
+    const trimmed = expandCjkAliases(family.trim());
+    // Ends in a generic already: trust it. A stack of named faces (`Inter, "Noto Sans SC"`) still
+    // needs the generic, since with none of them installed the browser falls to its serif default.
+    // The class is judged from the lead family; the rest of the stack is kept as authored.
+    const lead = trimmed.split(",")[0].trim().replace(/^["']|["']$/g, "");
+    const head = trimmed.includes(",") ? trimmed : quote(trimmed);
+    const stack = /\b(sans-serif|serif|monospace|system-ui|cursive|fantasy)\s*$/i.test(trimmed)
+        ? trimmed
+        : MONO.test(lead)
+            ? `${head}, "Menlo", "Consolas", monospace`
+            : SERIF.test(lead)
+                ? `${head}, ${CJK_SERIF_FALLBACK}, serif`
+                : `${head}, ${CJK_FALLBACK}, sans-serif`;
+    cache.set(family, stack);
+    return stack;
+}
+function quote(name) {
+    return /^["']/.test(name) || !/[\s\d]/.test(name) ? name : `"${name}"`;
+}
+function unquote(name) {
+    return name.trim().replace(/^["']|["']$/g, "");
+}
+function splitFamilies(stack) {
+    const out = [];
+    let cur = "";
+    let quoted = false;
+    for (const ch of stack) {
+        if (ch === '"') {
+            quoted = !quoted;
+            cur += ch;
+            continue;
+        }
+        if (ch === "," && !quoted) {
+            if (cur.trim())
+                out.push(cur.trim());
+            cur = "";
+            continue;
+        }
+        cur += ch;
+    }
+    if (cur.trim())
+        out.push(cur.trim());
+    return out;
+}
+function expandCjkAliases(stack) {
+    const parts = splitFamilies(stack);
+    const seen = new Set(parts.map((part) => unquote(part).toLowerCase()));
+    const out = [];
+    for (const part of parts) {
+        out.push(part);
+        const aliases = CJK_ALIASES[unquote(part)];
+        if (!aliases)
+            continue;
+        for (const alias of aliases) {
+            const key = alias.toLowerCase();
+            if (seen.has(key))
+                continue;
+            seen.add(key);
+            out.push(quote(alias));
+        }
+    }
+    return out.join(", ");
+}

package/dist/cjs/hit-geom.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.inverseSceneNode = inverseSceneNode;
+exports.worldToLocal = worldToLocal;
+exports.hitTestNodeBBox = hitTestNodeBBox;
+/**
+ * 撤销单个 SceneNode 的绘制变换，与 canvas/svg backend 对偶：
+ * translate(tx,ty) → rotate around bbox center → scale around center。
+ */
+function inverseSceneNode(n, x, y) {
+    const s = n.shape;
+    const cx = s.bbox.x + s.bbox.w / 2;
+    const cy = s.bbox.y + s.bbox.h / 2;
+    let lx = x - n.tx;
+    let ly = y - n.ty;
+    if (n.rotation) {
+        const a = (-n.rotation * Math.PI) / 180;
+        const cos = Math.cos(a);
+        const sin = Math.sin(a);
+        const dx = lx - cx;
+        const dy = ly - cy;
+        lx = cx + dx * cos - dy * sin;
+        ly = cy + dx * sin + dy * cos;
+    }
+    const flipX = s.transform?.scaleX ?? 1;
+    const flipY = s.transform?.scaleY ?? 1;
+    const sx = n.scale * n.scaleX * n.widthScale * (flipX < 0 ? -1 : 1);
+    const sy = n.scale * n.scaleY * n.heightScale * (flipY < 0 ? -1 : 1);
+    if (sx !== 1 && sx !== 0)
+        lx = (lx - cx) / sx + cx;
+    if (sy !== 1 && sy !== 0)
+        ly = (ly - cy) / sy + cy;
+    return { x: lx, y: ly };
+}
+/** 世界坐标 → 该节点未旋转 bbox 空间（含祖先 group 变换）。 */
+function worldToLocal(node, x, y) {
+    const chain = [];
+    for (let n = node; n; n = n.parent)
+        chain.push(n);
+    chain.reverse();
+    let p = { x, y };
+    for (const n of chain)
+        p = inverseSceneNode(n, p.x, p.y);
+    return p;
+}
+function hitTestNodeBBox(node, worldX, worldY) {
+    const p = worldToLocal(node, worldX, worldY);
+    const b = node.shape.bbox;
+    return p.x >= b.x && p.x <= b.x + b.w && p.y >= b.y && p.y <= b.y + b.h;
+}

package/dist/cjs/hybrid-backend.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HybridBackend = void 0;
+const svg_backend_1 = require("./svg-backend");
+const canvas_backend_1 = require("./canvas-backend");
+const webgl_shape_backend_1 = require("./webgl-shape-backend");
+const webgl_model3d_backend_1 = require("./webgl-model3d-backend");
+const hybrid_segments_1 = require("./hybrid-segments");
+class HybridBackend {
+    host;
+    svg;
+    wrapper;
+    backends = [];
+    constructor(scene, container, opts = {}) {
+        this.wrapper = document.createElement("div");
+        this.wrapper.style.position = "relative";
+        this.wrapper.style.width = "100%";
+        this.wrapper.style.height = "100%";
+        this.wrapper.style.background = opts.background ?? "transparent";
+        container.appendChild(this.wrapper);
+        const segments = (0, hybrid_segments_1.buildHybridSegments)(scene.root.children);
+        let firstSvg = null;
+        for (const seg of segments) {
+            const layer = document.createElement("div");
+            layer.style.position = "absolute";
+            layer.style.inset = "0";
+            layer.style.width = "100%";
+            layer.style.height = "100%";
+            this.wrapper.appendChild(layer);
+            const ids = new Set(seg.ids);
+            const filter = (s) => ids.has(s.id);
+            if (seg.kind === "canvas") {
+                this.backends.push(new canvas_backend_1.CanvasBackend(scene, layer, { shapeFilter: filter, transparent: true }));
+            }
+            else if (seg.kind === "webgl") {
+                layer.style.pointerEvents = "none";
+                this.backends.push(new webgl_shape_backend_1.WebGLShapeBackend(scene, layer, { shapeFilter: filter }));
+            }
+            else if (seg.kind === "webglm3d") {
+                layer.style.pointerEvents = "none";
+                this.backends.push(new webgl_model3d_backend_1.WebGLModel3DBackend(scene, layer, { shapeFilter: filter, interactive: opts.interactive }));
+            }
+            else {
+                // 这一层必须能接到指针。HTML 祖先一旦 pointer-events:none，foreignObject
+                // 里的 <video> 控件就点不到，点击会穿透到 stage，被放映的翻页接走。
+                const be = new svg_backend_1.SvgBackend(scene, layer, {
+                    shapeFilter: filter,
+                    transparent: true,
+                    clipToSlide: opts.clipToSlide,
+                });
+                this.backends.push(be);
+                if (!firstSvg)
+                    firstSvg = be;
+            }
+        }
+        if (!firstSvg) {
+            const layer = document.createElement("div");
+            layer.style.position = "absolute";
+            layer.style.inset = "0";
+            layer.style.width = "100%";
+            layer.style.height = "100%";
+            layer.style.pointerEvents = "none";
+            this.wrapper.appendChild(layer);
+            firstSvg = new svg_backend_1.SvgBackend(scene, layer, {
+                shapeFilter: () => false,
+                transparent: true,
+                clipToSlide: opts.clipToSlide,
+            });
+            this.backends.push(firstSvg);
+        }
+        this.svg = firstSvg;
+        this.host = this.wrapper;
+    }
+    get svgRoot() {
+        return this.svg.root;
+    }
+    /** 同步刷新所有子 backend；详见 SvgBackend.flush。 */
+    flush() {
+        for (const b of this.backends)
+            b.flush?.();
+    }
+    /** 等待所有 live 3D（WebGLShapeBackend）首帧就绪——截图 / visual-compare 前调。 */
+    async waitForReady() {
+        await Promise.all(this.backends.map((b) => b.whenReady?.() ?? Promise.resolve()));
+    }
+    destroy() {
+        for (const b of this.backends)
+            b.destroy();
+        this.backends = [];
+        this.wrapper.remove();
+    }
+}
+exports.HybridBackend = HybridBackend;

package/dist/cjs/hybrid-segments.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildHybridSegments = buildHybridSegments;
+const three_bake_1 = require("@sliiu/present-three-bake");
+const BITMAP_KINDS = new Set(["image", "chart"]);
+function shapeIsLive3D(s) {
+    return (0, three_bake_1.shapeSupports3D)(s) && (0, three_bake_1.needs3DRender)((0, three_bake_1.shape3DInfo)(s));
+}
+function shapeIsLiveModel3D(s) {
+    return s.kind === "model3d" && Boolean(s.glbSrc);
+}
+function classifyBucket(node) {
+    if (shapeIsLive3D(node.shape))
+        return "webgl";
+    if (shapeIsLiveModel3D(node.shape))
+        return "webglm3d";
+    if (node.shape.kind === "model3d")
+        return "canvas";
+    return BITMAP_KINDS.has(node.shape.kind) ? "canvas" : "svg";
+}
+/**
+ * 按绘制顺序切段。组合不单独成段：非 3D 子形状留在组合被归入的那一类（图片在组合里
+ * 仍走 SVG），3D 子形状在它自己的 z 序位置拆成 webgl 段，这样字可以盖在挤出体上面。
+ */
+function buildHybridSegments(children) {
+    const segments = [];
+    for (const child of children)
+        walk(child, segments, classifyBucket(child));
+    return segments;
+}
+function walk(node, segments, bucket) {
+    if (shapeIsLive3D(node.shape)) {
+        push(segments, "webgl", node.id);
+        return;
+    }
+    if (shapeIsLiveModel3D(node.shape)) {
+        push(segments, "webglm3d", node.id);
+        return;
+    }
+    if (node.shape.kind === "group") {
+        for (const c of node.children)
+            walk(c, segments, bucket);
+        return;
+    }
+    push(segments, bucket, node.id);
+}
+function push(segments, kind, id) {
+    const prev = segments[segments.length - 1];
+    if (prev && prev.kind === kind && kind !== "webgl" && kind !== "webglm3d") {
+        prev.ids.push(id);
+        return;
+    }
+    segments.push({ kind, ids: [id] });
+}

package/dist/cjs/index.js

@@ -0,0 +1,70 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.placeGlyphsOnWarp = exports.sampleWarpPath = exports.warpActive = exports.shapeFrontImageSrc = exports.inverseSceneNode = exports.hitTestNodeBBox = exports.worldToLocal = exports.hitTestTextRunAt = exports.runLinkAt = exports.effectClipUsesEvenOdd = exports.effectClipPathD = exports.drawChartCanvas = exports.renderChart = exports.waitForModel3DFrames = exports.getModel3DPreviewFrame = exports.waitForVideoFrames = exports.getVideoPosterFrame = exports.waitForImagesLoaded = exports.getImage = exports.applyCanvasStroke = exports.paintToCanvasStyle = exports.applySvgStroke = exports.renderPaint = exports.mountMorphTransitionLayers = exports.stageChromeBackground = exports.WebGLModel3DBackend = exports.WebGLShapeBackend = exports.revealDesignedAppearance = exports.applyEntranceHideToScene = void 0;
+__exportStar(require("./scene-node"), exports);
+var entrance_hide_1 = require("./entrance-hide");
+Object.defineProperty(exports, "applyEntranceHideToScene", { enumerable: true, get: function () { return entrance_hide_1.applyEntranceHideToScene; } });
+Object.defineProperty(exports, "revealDesignedAppearance", { enumerable: true, get: function () { return entrance_hide_1.revealDesignedAppearance; } });
+__exportStar(require("./compose"), exports);
+__exportStar(require("./svg-backend"), exports);
+__exportStar(require("./canvas-backend"), exports);
+__exportStar(require("./hybrid-backend"), exports);
+var webgl_shape_backend_1 = require("./webgl-shape-backend");
+Object.defineProperty(exports, "WebGLShapeBackend", { enumerable: true, get: function () { return webgl_shape_backend_1.WebGLShapeBackend; } });
+var webgl_model3d_backend_1 = require("./webgl-model3d-backend");
+Object.defineProperty(exports, "WebGLModel3DBackend", { enumerable: true, get: function () { return webgl_model3d_backend_1.WebGLModel3DBackend; } });
+var stage_chrome_1 = require("./stage-chrome");
+Object.defineProperty(exports, "stageChromeBackground", { enumerable: true, get: function () { return stage_chrome_1.stageChromeBackground; } });
+var morph_transition_1 = require("./morph-transition");
+Object.defineProperty(exports, "mountMorphTransitionLayers", { enumerable: true, get: function () { return morph_transition_1.mountMorphTransitionLayers; } });
+__exportStar(require("./selection"), exports);
+var paint_svg_1 = require("./paint-svg");
+Object.defineProperty(exports, "renderPaint", { enumerable: true, get: function () { return paint_svg_1.renderPaint; } });
+Object.defineProperty(exports, "applySvgStroke", { enumerable: true, get: function () { return paint_svg_1.applyStroke; } });
+var paint_canvas_1 = require("./paint-canvas");
+Object.defineProperty(exports, "paintToCanvasStyle", { enumerable: true, get: function () { return paint_canvas_1.paintToCanvasStyle; } });
+Object.defineProperty(exports, "applyCanvasStroke", { enumerable: true, get: function () { return paint_canvas_1.applyStroke; } });
+Object.defineProperty(exports, "getImage", { enumerable: true, get: function () { return paint_canvas_1.getImage; } });
+Object.defineProperty(exports, "waitForImagesLoaded", { enumerable: true, get: function () { return paint_canvas_1.waitForImagesLoaded; } });
+var video_frame_1 = require("./video-frame");
+Object.defineProperty(exports, "getVideoPosterFrame", { enumerable: true, get: function () { return video_frame_1.getVideoPosterFrame; } });
+Object.defineProperty(exports, "waitForVideoFrames", { enumerable: true, get: function () { return video_frame_1.waitForVideoFrames; } });
+var model3d_frame_1 = require("./model3d-frame");
+Object.defineProperty(exports, "getModel3DPreviewFrame", { enumerable: true, get: function () { return model3d_frame_1.getModel3DPreviewFrame; } });
+Object.defineProperty(exports, "waitForModel3DFrames", { enumerable: true, get: function () { return model3d_frame_1.waitForModel3DFrames; } });
+var chart_svg_1 = require("./chart-svg");
+Object.defineProperty(exports, "renderChart", { enumerable: true, get: function () { return chart_svg_1.renderChart; } });
+var chart_canvas_1 = require("./chart-canvas");
+Object.defineProperty(exports, "drawChartCanvas", { enumerable: true, get: function () { return chart_canvas_1.drawChartCanvas; } });
+var effect_clip_1 = require("./effect-clip");
+Object.defineProperty(exports, "effectClipPathD", { enumerable: true, get: function () { return effect_clip_1.effectClipPathD; } });
+Object.defineProperty(exports, "effectClipUsesEvenOdd", { enumerable: true, get: function () { return effect_clip_1.effectClipUsesEvenOdd; } });
+__exportStar(require("./text-shared"), exports);
+__exportStar(require("./text-stacked"), exports);
+var text_hit_1 = require("./text-hit");
+Object.defineProperty(exports, "runLinkAt", { enumerable: true, get: function () { return text_hit_1.runLinkAt; } });
+Object.defineProperty(exports, "hitTestTextRunAt", { enumerable: true, get: function () { return text_hit_1.hitTestTextRunAt; } });
+var hit_geom_1 = require("./hit-geom");
+Object.defineProperty(exports, "worldToLocal", { enumerable: true, get: function () { return hit_geom_1.worldToLocal; } });
+Object.defineProperty(exports, "hitTestNodeBBox", { enumerable: true, get: function () { return hit_geom_1.hitTestNodeBBox; } });
+Object.defineProperty(exports, "inverseSceneNode", { enumerable: true, get: function () { return hit_geom_1.inverseSceneNode; } });
+var shape_front_1 = require("./shape-front");
+Object.defineProperty(exports, "shapeFrontImageSrc", { enumerable: true, get: function () { return shape_front_1.shapeFrontImageSrc; } });
+var text_warp_1 = require("./text-warp");
+Object.defineProperty(exports, "warpActive", { enumerable: true, get: function () { return text_warp_1.warpActive; } });
+Object.defineProperty(exports, "sampleWarpPath", { enumerable: true, get: function () { return text_warp_1.sampleWarpPath; } });
+Object.defineProperty(exports, "placeGlyphsOnWarp", { enumerable: true, get: function () { return text_warp_1.placeGlyphsOnWarp; } });

package/dist/cjs/linked-src.js

@@ -0,0 +1,116 @@
+"use strict";
+/** 浏览器无法加载 `file:` 外链图；画带文件名的占位，避免空白碎图。
+ *  Node 下若本地文件仍在，读成 data URL 仅供预览，**不改 IR 的 src**（否则 round-trip 会丢掉 r:link）。
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isFileLinkedSrc = isFileLinkedSrc;
+exports.linkedImageLabel = linkedImageLabel;
+exports.linkedImagePlaceholderDataUri = linkedImagePlaceholderDataUri;
+exports.displayImageSrc = displayImageSrc;
+exports.drawLinkedImagePlaceholder = drawLinkedImagePlaceholder;
+function isFileLinkedSrc(src) {
+    return !!src && /^file:/i.test(src);
+}
+function linkedImageLabel(src) {
+    const stripped = src.replace(/^file:\/\//i, "").replace(/^\/\//, "");
+    const name = stripped.split(/[/\\]/).pop()?.trim();
+    return name && name.length > 0 && name.length < 80 ? name : "Linked image";
+}
+function escapeXml(s) {
+    return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+const FILE_PREVIEW_CACHE = new Map();
+function fileUrlToFsPath(src) {
+    try {
+        const u = new URL(src);
+        if (u.protocol !== "file:")
+            return undefined;
+        let p = decodeURIComponent(u.pathname);
+        if (/^\/[A-Za-z]:\//.test(p))
+            p = p.slice(1);
+        return p;
+    }
+    catch {
+        return undefined;
+    }
+}
+function mimeFromFsPath(p) {
+    const ext = p.slice(p.lastIndexOf(".") + 1).toLowerCase();
+    if (ext === "jpg" || ext === "jpeg")
+        return "image/jpeg";
+    if (ext === "gif")
+        return "image/gif";
+    if (ext === "webp")
+        return "image/webp";
+    if (ext === "svg")
+        return "image/svg+xml";
+    if (ext === "bmp")
+        return "image/bmp";
+    return "image/png";
+}
+function tryReadFileLinkedDataUrl(src) {
+    const cached = FILE_PREVIEW_CACHE.get(src);
+    if (cached === null)
+        return undefined;
+    if (cached)
+        return cached;
+    const proc = globalThis;
+    if (!proc.process?.versions?.node) {
+        FILE_PREVIEW_CACHE.set(src, null);
+        return undefined;
+    }
+    const fsPath = fileUrlToFsPath(src);
+    if (!fsPath) {
+        FILE_PREVIEW_CACHE.set(src, null);
+        return undefined;
+    }
+    try {
+        const fs = proc.process.getBuiltinModule?.("fs");
+        if (!fs?.existsSync || !fs.readFileSync || !fs.existsSync(fsPath)) {
+            FILE_PREVIEW_CACHE.set(src, null);
+            return undefined;
+        }
+        const b64 = fs.readFileSync(fsPath).toString("base64");
+        const dataUrl = `data:${mimeFromFsPath(fsPath)};base64,${b64}`;
+        FILE_PREVIEW_CACHE.set(src, dataUrl);
+        return dataUrl;
+    }
+    catch {
+        FILE_PREVIEW_CACHE.set(src, null);
+        return undefined;
+    }
+}
+function linkedImagePlaceholderDataUri(src, w = 320, h = 180) {
+    const label = escapeXml(linkedImageLabel(src));
+    const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${Math.max(1, Math.round(w))}" height="${Math.max(1, Math.round(h))}">` +
+        `<rect width="100%" height="100%" fill="#f3f4f6"/>` +
+        `<rect x="0.5" y="0.5" width="99%" height="99%" fill="none" stroke="#d1d5db" stroke-dasharray="6 4"/>` +
+        `<text x="50%" y="46%" text-anchor="middle" font-size="14" fill="#6b7280" font-family="sans-serif">Linked image</text>` +
+        `<text x="50%" y="60%" text-anchor="middle" font-size="12" fill="#6b7280" font-family="sans-serif">${label}</text>` +
+        `</svg>`;
+    return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+}
+function displayImageSrc(src, w = 320, h = 180) {
+    if (!isFileLinkedSrc(src))
+        return src;
+    return tryReadFileLinkedDataUrl(src) ?? linkedImagePlaceholderDataUri(src, w, h);
+}
+function drawLinkedImagePlaceholder(ctx, bbox, src) {
+    ctx.save();
+    ctx.fillStyle = "#f3f4f6";
+    ctx.fillRect(bbox.x, bbox.y, bbox.w, bbox.h);
+    ctx.strokeStyle = "#d1d5db";
+    ctx.setLineDash([6, 4]);
+    ctx.lineWidth = 1;
+    ctx.strokeRect(bbox.x + 0.5, bbox.y + 0.5, bbox.w - 1, bbox.h - 1);
+    ctx.setLineDash([]);
+    ctx.fillStyle = "#6b7280";
+    ctx.font = "12px sans-serif";
+    ctx.textAlign = "center";
+    ctx.textBaseline = "middle";
+    const label = linkedImageLabel(src);
+    ctx.fillText("Linked image", bbox.x + bbox.w / 2, bbox.y + bbox.h / 2 - 8);
+    ctx.font = "11px sans-serif";
+    ctx.fillText(label, bbox.x + bbox.w / 2, bbox.y + bbox.h / 2 + 10, Math.max(8, bbox.w - 12));
+    ctx.restore();
+}