postext 1.24.0 → 1.25.1

package/dist/html-backend.js

@@ -2,6 +2,9 @@ import { footnoteRuleSegments } from './columnRule';
 import { leaderRuleGeometry, lineTextAlign, tableCellFillRects, tableFrameOutline } from './vdt';
 import { dimensionToPx } from './units';
 import { documentInkHex, isSingleInkSvgUrl, singleInkColorMatrix } from './svg/singleInk';
+import { inlineSvgFontsDetailedSync } from './svg/fonts';
+import { registeredFontSyncProvider } from './svg/fontRegistry';
+import { svgPictureFontWarning } from './svg/image';
 import { lineInkExtent, lineTrailingTracking } from './lineInk';
 import { CHARACTER_GRID_COLOR, cjkGridCells } from './pipeline/cjkGrid';
 import { isJapaneseLanguage, renderLangOf } from './locale';
@@ -198,8 +201,79 @@ function imageUrl(options, fileId, resourceId) {
     const url = options?.resourceImageUrl?.(fileId);
     if (!url)
         options?.missingImage?.(fileId, resourceId);
+    if (url && options?.svgUrl)
+        return options.svgUrl(url, fileId, resourceId);
     return url || undefined;
 }
+/** The markup of an SVG `data:` URI; null for any other URL. */
+function svgDataUriText(url) {
+    const head = /^data:image\/svg\+xml(;[^,]*)?,/i.exec(url);
+    if (!head)
+        return null;
+    const body = url.slice(head[0].length);
+    try {
+        if (/;base64/i.test(head[1] ?? '')) {
+            const binary = atob(body);
+            const bytes = new Uint8Array(binary.length);
+            for (let i = 0; i < binary.length; i++)
+                bytes[i] = binary.charCodeAt(i);
+            return new TextDecoder().decode(bytes);
+        }
+        return decodeURIComponent(body);
+    }
+    catch {
+        return null;
+    }
+}
+/** The `svgUrl` of a render (#630): SVG data URIs re-encoded with the
+ *  faces their text names, once per URL; null when inlining is off. */
+function svgFontInliner(doc, options) {
+    const opt = options.inlineSvgFonts;
+    if (!opt || doc.config.diagramStyle?.inlineFonts === false)
+        return null;
+    const settings = typeof opt === 'object' ? opt : {};
+    const provider = settings.fonts ?? registeredFontSyncProvider();
+    // Pictures whose resource opts out.
+    const keep = new Set();
+    const note = (block) => {
+        const r = block.resourceBlock?.resource;
+        if (r?.svg?.inlineFonts === false && r.svg.fileId)
+            keep.add(r.svg.fileId);
+    };
+    for (const b of doc.blocks)
+        note(b);
+    for (const p of doc.pages)
+        for (const b of p.floats ?? [])
+            note(b);
+    const done = new Map();
+    const reported = new Set();
+    return (url, fileId, resourceId) => {
+        if (keep.has(fileId))
+            return url;
+        const cached = done.get(url);
+        if (cached !== undefined)
+            return cached;
+        const text = svgDataUriText(url);
+        let out = url;
+        if (text !== null) {
+            const result = inlineSvgFontsDetailedSync(text, provider, {
+                ...(settings.maxBytes !== undefined ? { maxBytes: settings.maxBytes } : {}),
+                ...(settings.withhold ? { withhold: settings.withhold } : {}),
+                onWarning: (w) => {
+                    const key = `${fileId}|${w.kind}|${w.kind === 'svgFontUnavailable' ? `${w.family}|${w.weight}|${w.style}` : ''}`;
+                    if (reported.has(key))
+                        return;
+                    reported.add(key);
+                    options.onWarning?.(svgPictureFontWarning(w, fileId, resourceId));
+                },
+            });
+            if (result.svg !== text)
+                out = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(result.svg)}`;
+        }
+        done.set(url, out);
+        return out;
+    };
+}
 const HTML_ESCAPE = {
     '&': '&amp;',
     '<': '&lt;',
@@ -1317,8 +1391,14 @@ function verticalDesignLines(block, v, originX, originY) {
         const inner = [];
         for (const run of runs) {
             const runFont = quoteFontString(run.fontString);
-            const decl = runFont !== font ? `font:${runFont};` : '';
-            inner.push(verticalSpan(x, axisOf(run.fontString, run.baselineShift ?? 0), verticalTextHtml(run.text, v, segmentOrientation(run), run.fontString, block.letterSpacingPx ?? 0), decl));
+            // A dash of a 破折号 (`inkScale`, #652): turned with the flow and
+            // stretched down the column, as a body segment's is.
+            const stretched = run.inkScale !== undefined;
+            const decl = (runFont !== font ? `font:${runFont};` : '')
+                + (stretched ? `transform:scaleY(${run.inkScale.toFixed(4)});transform-origin:0 0;${DASH_FEATURES_DECL}` : '');
+            // A run whose width is its box (a CJK mark that gave up blank, #637)
+            // sets its glyphs `inkOffset` into it.
+            inner.push(verticalSpan(x + (run.inkOffset ?? 0), axisOf(run.fontString, run.baselineShift ?? 0), verticalTextHtml(run.text, v, stretched ? 'sideways' : segmentOrientation(run), run.fontString, block.letterSpacingPx ?? 0), decl));
             x += run.width;
         }
         const width = Math.max(line.width, x);
@@ -1804,7 +1884,19 @@ function renderDesignTextBlock(block, options) {
                     ? 'display:inline-block;width:0;'
                     : line.runs[i - 1]?.stacked ? `display:inline-block;min-width:${run.width.toFixed(3)}px;` : '';
                 const shiftDecl = run.baselineShift ? `position:relative;top:${run.baselineShift.toFixed(3)}px;` : '';
-                return fontDecl || cjkDecl || stackDecl || shiftDecl ? `<span style="${fontDecl}${cjkDecl}${stackDecl}${shiftDecl}">${esc(run.text)}</span>` : esc(run.text);
+                // A run whose width is its box, not its glyphs' advance (a CJK
+                // mark that gave up blank, a Han–Latin space, #637): a box that
+                // wide, its glyphs set `inkOffset` into it.
+                const boxDecl = run.inkOffset !== undefined && !run.stacked
+                    ? `display:inline-block;width:${run.width.toFixed(3)}px;${run.inkOffset !== 0 ? `text-indent:${run.inkOffset.toFixed(3)}px;` : ''}`
+                    : '';
+                // A dash of a 破折号 (`inkScale`, #652): a box of its own inside
+                // the run's, stretched from where the run's indent puts its
+                // glyph, as a body segment's is.
+                const text = run.inkScale !== undefined
+                    ? `<span style="display:inline-block;text-indent:0;${inkScaleDecl(run.inkScale)}">${esc(run.text)}</span>`
+                    : esc(run.text);
+                return fontDecl || cjkDecl || stackDecl || shiftDecl || boxDecl ? `<span style="${fontDecl}${cjkDecl}${stackDecl}${shiftDecl}${boxDecl}">${text}</span>` : text;
             }).join('')
             : esc(line.text);
         const lineDecl = !line.runs && hasCJK(line.text) ? CJK_TEXT_DECL : '';
@@ -2238,10 +2330,12 @@ export function renderToHtmlIndexed(doc, options = {}) {
     const bleedInset = doc.trimOffset > 0
         ? Math.max(0, doc.trimOffset - dimensionToPx(doc.config.page.cutLines.bleed, doc.config.page.dpi))
         : 0;
+    const svgUrl = svgFontInliner(doc, options);
     for (const p of doc.pages) {
         const pageOptions = onWarning
             ? {
                 ...options,
+                ...(svgUrl ? { svgUrl } : {}),
                 linkTargets,
                 ...anchorPaint,
                 missingImage: (fileId, resourceId) => {
@@ -2251,7 +2345,7 @@ export function renderToHtmlIndexed(doc, options = {}) {
                     onWarning({ kind: 'missingImage', fileId, ...(resourceId !== undefined ? { resourceId } : {}), pageIndex: p.index });
                 },
             }
-            : { ...options, linkTargets, ...anchorPaint };
+            : { ...options, ...(svgUrl ? { svgUrl } : {}), linkTargets, ...anchorPaint };
         const gridCells = doc.config.cjk?.grid?.show && !p.comic ? cjkGridCells(doc.config, p.contentArea, doc.baselineGrid, p.columns, p.flow) : undefined;
         const detail = renderPageDetailed(p, p.background ?? background, pageOptions, ink, bleedInset, gridCells, doc.config.cjk?.region, doc.config.cjk?.uprightDigits);
         pageHtmlParts.push(detail.outerHtml);