@openpresentation/opf-render 0.18.2 → 0.19.1

package/README.md

@@ -14,7 +14,7 @@
 
 **OPF 0.15 (FA-23, unreleased; requires core 0.15).** Catalogs are registered by the host, and every picture is an image background or an image block. The breaking changes are listed in `changes/fa-23-opf-0-15.md` (the next CHANGELOG section); the [0.15 design](https://github.com/OpenPresentation/opf/blob/main/docs/programs/format-audit/0.15-design.md) explains them.
 
-- The renderer bundles, looks up and fetches no catalog. Every entry point (`toSvg`, `resolvePresentation`, the font loaders' `renderOptions`, `/player`, `<opf-deck>`) takes core's `catalogs: Catalog[]` and passes it unchanged to core resolution. Register the gallery snapshot yourself: `import { defaultCatalog } from '@openpresentation/opf/catalog'` and `toSvg(deck, { catalogs: [defaultCatalog] })`. `strictReferences: true` fails with `unresolved-reference` instead of falling back.
+- The renderer bundles, looks up and fetches no catalog. Every entry point (`toSvg`, `resolvePresentation`, the font loaders' `renderOptions`, `/player`, `<opf-deck>`) takes core's `catalogs: Catalog[]` and passes it unchanged to core resolution. Register the gallery snapshot yourself: `import { gallery } from '@openpresentation/gallery'` and `toSvg(deck, { catalogs: [gallery] })`. `strictReferences: true` fails with `unresolved-reference` instead of falling back.
 - What resolves nowhere draws with core's engine defaults (`engineDefaults` is `{ theme, colorScheme, fontScheme, chartType }`: core's `ENGINE_DEFAULT_THEME`, `ENGINE_DEFAULT_COLOR_SCHEME`, `ENGINE_DEFAULT_FONT_SCHEME`) and is reported once per reference as `unresolved-reference`.
 - An image background (`design.background: { type: "image", src, alt, fit, focus, opacity, recolor, overlay }`, or an image source string) draws from core's `geometry.backgroundImage`: the canvas colour, the picture (cover, contain, stretch or tile; recolor and opacity on the pixels only), then the overlay (the whole slide or an edge band). `alt` is the picture's accessible name; without it the picture is decorative.
 - Every content picture is an image block drawn from `item.image`: frame, fit (`cover`, `contain`, `stretch`; default `design.imageFit`, else `cover`), focus, shape mask, border, opacity, recolor and overlay, and a placed block (`placement`) at its edge band.
@@ -120,7 +120,9 @@ const pptx = await toPptx(presentation, { fonts });        // the same lines in
 
 One handle carries the measurement for core's `validate`, `paginate` and slide context, for `toSvg`, `toPng` and `toPdf`, and for opf-pptx's `toPptx`. The same handle gives identical text geometry across those engines: every engine reads core's one composition, so the measurement decides the lines. [opf-pptx's `layout-parity` test](https://github.com/OpenPresentation/opf-pptx/blob/main/test/layout-parity.mjs) checks that the exported PowerPoint paragraphs agree with this renderer's SVG and with core's composed items, with and without `fonts`.
 
-A call without `fonts` is not an error. It uses core's built-in estimate instead of measured widths: 0.54 em per character, 0.62 em for capitals and digits, 0.32 em for a space, 1 em for CJK characters and zero for combining marks. The estimate is deterministic and needs no font files, but it is too narrow for some scripts (opf#566 tracks improving it), so line breaks, overflow findings and page breaks from an estimated run can differ from what the faces actually draw. Treat an estimated preview as a draft. Core's Node `convert` and the `opf` CLI prepare an office-pack handle for you; a library call to `toSvg`, `toPng` or `toPdf` never loads fonts on its own, so pass the handle you want. Compare [opf#364](https://github.com/OpenPresentation/opf/issues/364).
+Node handles, and browser handles loaded with `shapeWasm`, measure advances and glyph ink with the same HarfBuzz shaper used by vector PDF and text outlines. Handles without shaping WASM retain fontkit measurement. This can change line wrapping for Myanmar and some Syriac text; [the reviewed corpus report](docs/evidence/harfbuzz-layout-measurement/README.md) records the differences and the unchanged example output.
+
+A call without `fonts` is not an error. It uses core's deterministic estimate instead of measured font advances. Core applies script-specific widths, including the six script estimates improved in OPF 0.19; nonspacing and enclosing marks have no independent advance, while spacing combining marks retain width. The estimate needs no font files, but line breaks, overflow findings and page breaks can differ from what the selected faces actually draw. Treat an estimated preview as a draft. Core's Node `convert` and the `opf` CLI prepare an office-pack handle for you; a library call to `toSvg`, `toPng` or `toPdf` never loads fonts on its own, so pass the handle you want. Compare [opf#364](https://github.com/OpenPresentation/opf/issues/364).
 
 
 ## Install: what to add for what (RR-63)
@@ -210,6 +212,8 @@ console.log(fonts.substitutions);
 
 Set `trace: true` to stamp rendered SVG elements with `data-opf-path` values such as `slides.0.title`; omit it for smaller production SVG.
 
+Layout templates (OPF 0.19, core `opf-layout/v2`: `areas`, `rows`, `columns` and `regions`) draw from core's composed geometry, as every slide does: the renderer adds no arrangement of its own. Core places each block in its region (`geometry.regions`, `item.region`); a card is the `item.frameBox` core composed in the block's cell (`design.contentBox`), and a region with `bleed` arrives with its outer edges on the slide edge and no card. A list core laid out in columns (`item.listColumns`: a lone list in a region with `listColumns: "auto"`, or a list payload with `columns`) draws each column's own fit in its own box, at one shared size, with numbering continuing across the columns; `item.text` (the whole list) is not drawn then. With `trace: true` everything an item of a region draws (card, payload, caption) is grouped in `<g data-opf-region="<name>">`, and each list column is a group with `data-opf-list-column` (its index), `data-opf-list-start` and `data-opf-list-end` (the half-open range of the payload's items it holds) and its `data-opf-box-*`. OPF 0.19 removes `opf-layout/v1` records with no alias or migration shim. Slides without a layout use core's automatic composition; only items bound to template regions carry these region attributes. `test/layout-template-goldens.mjs` pins the SVG and PNG of the 28 built-in templates with 1 to 6 short and long blocks, and of the pages core's `paginate` makes of the ones that overflow.
+
 The installed open font pack works offline. The Aptos family previews with the metric-compatible Intos even under the default metric policy; this example additionally permits visual-only look-alikes for families with no metric replacement yet (a documented fallback), and the substitution report identifies requested and resolved faces. A visual substitute is not a claim of metric or pixel equivalence, and it is a known layout-fidelity gap rather than the end state. Replacements apply to rendering only; the document keeps the selected font name. Omit `substitutionPolicy` to restrict the Office pack to its metric mappings, or supply your own licensed faces (`faces`). Missing fonts/glyphs fail explicitly. Without `fonts`, synchronous SVG APIs use estimated widths; named fonts alone do not make rich-run spacing reliable. Browser hosts should load the same bytes using the loader below.
 
 Unresolved images produce an `unresolved-asset` diagnostic through `onDiagnostic`, including the OPF path, reason and complete description. The fallback shows a bounded status label when it fits above the selected readability floor, otherwise an icon with the full accessible description. The label is `Image unavailable` over the description (alt, else title, else `Image`) in semibold at 20 px on a 1280 x 720 canvas, and opf-pptx exports the same placeholder as native shapes. It preserves authored opacity, including faint decorative watermarks; a missing image is still missing even when its fallback fits. Use `strictAssets: true` to reject unresolved images. Supply embedded raster data URIs or a synchronous host `imageResolver` to resolve them; the renderer does not fetch URLs or read local paths. Caller descriptions and other metadata override referenced asset metadata through alias chains. These diagnostics identify unresolved sources, not malformed image bytes or native PowerPoint compatibility.
@@ -502,7 +506,7 @@ fonts.registry.scriptSelection; // { detected, scripts, unavailable, packages, n
 const browserFonts = await loadBrowserFonts({ faces: baseEntries, substitutionPolicy: 'visual', fallbackFamily: 'Roboto', scriptBaseUrl: '/script-fonts/' });
 if (browserFonts.pending(presentation).length) await browserFonts.ensure(presentation); // resolves { scripts, lazy, uncovered }
 // pending is synchronous: empty means nothing is missing, so render at once.
-// Text decides, so the analysis does not resolve layouts. Pass the render options (renderOptions: { catalogs: [defaultCatalog] }
+// Text decides, so the analysis does not resolve layouts. Pass the render options (renderOptions: { catalogs: [gallery] }
 // to loadFonts, or per call) so a font scheme only the host's catalogs have and that names a script font (Yu Gothic) counts.
 ```
 
@@ -577,7 +581,7 @@ The package runtime must stay local and deterministic:
 
 Dependency policy:
 
-- `@openpresentation/opf` is the compatibility source for schemas, validation, resolution and composition. The renderer imports no catalog data; hosts register catalogs (`@openpresentation/opf/catalog` holds the gallery snapshot).
+- `@openpresentation/opf` is the compatibility source for schemas, validation, resolution and composition. The renderer imports no catalog data; hosts register catalogs (`@openpresentation/gallery` holds the gallery snapshot).
 - `@resvg/resvg-js` (optional peer, RR-63) is used only for local SVG rasterization in Node; it makes no network calls and does not require a browser. `sharp` (optional peer) decodes WebP, rotated JPEG and the pictures of a vector PDF. Both load on first use; see [Install](#install-what-to-add-for-what-rr-63).
 - `pdf-lib` (optional peer, RR-63) assembles raster-mode PDF bytes locally. Metadata timestamps are disabled so repeated PDF output is byte-stable for the same SVG input and options.
 - Vector PDF output is written by a small deterministic PDF writer in this package, with `pako` for Flate compression (pure JavaScript, so independent of the platform zlib build), HarfBuzz (the fonts handle's `harfbuzz.wasm` of the pinned harfbuzzjs) for shaping, `fontkit` for font metrics (and for shaping without a shaper) and `bidi-js` for the Unicode bidirectional algorithm. No hosted service, network call or system font is involved.

package/dist/font-registry.js

@@ -1,3 +1,5 @@
+import { sha256Bytes } from "./sha256.js";
+import bidiFactory from "bidi-js";
 import { create } from "fontkit";
 import { FONT_COMPATIBILITY, disabledFeaturesFor } from "./font-compatibility.js";
 import { adjustedFontSize, createScriptFonts, openTypeLanguage, scriptFontAliases, sizeAdjustFor } from "./script-fonts.js";
@@ -11,6 +13,7 @@ import { SYMBOL_SCRIPT, isSymbolEncodedFamily, symbolEncodingFamily, symbolPrevi
 export class OPFFontError extends Error {
   constructor(code, message, details = {}) { super(message); this.name = "OPFFontError"; this.code = code; this.details = details; }
 }
+const bidi = bidiFactory();
 const key = (family, weight, italic) => `${family.toLowerCase()}:${weight}:${!!italic}`;
 function base64(data) {
   let binary = "";
@@ -190,8 +193,15 @@ export function createFontRegistry(entries, options = {}) {
     if (entry.embed !== undefined && entry.embed !== "always" && entry.embed !== "used") throw new OPFFontError("invalid-font-embed", "Font embed must be 'always' or 'used'.");
     // A fallback-only face (the default Noto Sans) serves glyph fallback and explicit requests by its own name,
     // but never stands in for another family, so loading it does not change what any other font previews with.
-    return {family,familyGroup,fontFace,weight,italic,font,data,format,license:entry.license,embed:entry.embed,scripts,fallbackOnly:entry.fallbackOnly===true,cache:new Map()};
+    return {family,familyGroup,fontFace,weight,italic,font,data,format,
+      // The Node shaper is shared across handles: reuse its immutable font by content, never by a new byte-array identity.
+      get hash() {
+        const hash = Array.from(sha256Bytes(data), byte => byte.toString(16).padStart(2, "0")).join("").toUpperCase();
+        Object.defineProperty(this, "hash", {value: hash});
+        return hash;
+      },license:entry.license,embed:entry.embed,scripts,fallbackOnly:entry.fallbackOnly===true,cache:new Map()};
   };
+  let shaper;
   const faces = [], duplicates = new Set(), familySlots = new Map();
   // Adds faces atomically: every check runs before any face is registered.
   const register = added => {
@@ -265,7 +275,9 @@ export function createFontRegistry(entries, options = {}) {
     const {face,resolution}=resolve(style);
     // A BCP-47 `lang` selects the font's OpenType language system, as a browser
     // does for an element's lang (FF-19). Without it, shaping is unchanged.
-    const language=openTypeLanguage(style.lang),key=language?`${language}\u0000${text}`:text;
+    const language=openTypeLanguage(style.lang);
+    const direction = style.direction ?? (bidi.getEmbeddingLevels(text).paragraphs[0]?.level % 2 ? "rtl" : "ltr");
+    const key = `${direction}\u0000${style.lang ?? ""}\u0000${text}`;
     let value=face.cache.get(key);
     if (value===undefined) {
       if (options.strictGlyphs!==false) for(const character of text) {
@@ -284,7 +296,27 @@ export function createFontRegistry(entries, options = {}) {
       const off=disabledFeaturesFor(face.family),policyFeatures=off&&Object.fromEntries(off.map(tag=>[tag,false]));
       const shape=extra=>{const features=policyFeatures||extra?{...policyFeatures,...extra}:undefined;return language?face.font.layout(text,features,undefined,language):features?face.font.layout(text,features):face.font.layout(text);};
       let run;
-      try { run=shape(); }
+      if (shaper) {
+        try {
+          const glyphs = shaper.shape(face, text, {direction, lang: style.lang, features: policyFeatures});
+          let pen = 0, bounds = null;
+          for (const glyph of glyphs) {
+            if (includeOutline) {
+              // Colour/bitmap glyphs may have no fontkit outline (the em-box fallback below still applies).
+              let box;
+              try { box = face.font.getGlyph(glyph.gid).bbox; } catch { box = null; }
+              if (box && [box.minX, box.minY, box.maxX, box.maxY].every(Number.isFinite) && box.width > 0 && box.height > 0) {
+                const next = {minX: pen + glyph.xOffset + box.minX, maxX: pen + glyph.xOffset + box.maxX, minY: glyph.yOffset + box.minY, maxY: glyph.yOffset + box.maxY};
+                bounds = bounds ? {minX: Math.min(bounds.minX, next.minX), maxX: Math.max(bounds.maxX, next.maxX), minY: Math.min(bounds.minY, next.minY), maxY: Math.max(bounds.maxY, next.maxY)} : next;
+              }
+            }
+            pen += glyph.advance;
+          }
+          run = {positions: [{xAdvance: pen}], bbox: bounds && {...bounds, width: bounds.maxX - bounds.minX, height: bounds.maxY - bounds.minY}};
+        } catch (error) {
+          throw new OPFFontError("font-shaping-failed", `Font '${face.family}' cannot shape this text with HarfBuzz.`, {path:style.path,fontFamily:face.family,cause:error?.message});
+        }
+      } else try { run=shape(); }
       catch (error) {
         // A lookup fontkit cannot decode (GSUB type 8 in Noto Sans Mongolian) applies nothing; shape again with the rest (FF-44).
         if (skipUndecodableLookups(face.font)) { try { run=shape(); } catch { /* the mark retry below */ } }
@@ -326,6 +358,11 @@ export function createFontRegistry(entries, options = {}) {
   textMeasurement.forScripts=profile=>createScriptFonts(profile,textMeasurement).textMeasurement;
   return {
     textMeasurement,
+    // Attach the handle's outline shaper after its WASM loads. Earlier measurements must not survive the engine switch.
+    setShaper(engine) {
+      shaper = engine;
+      for (const face of faces) face.cache.clear();
+    },
     resolveFont(style) { return resolve(style).resolution; },
     clearSubstitutions() { substitutions.clear(); },
     get substitutions() { return [...substitutions.values()]; },

package/dist/index.d.ts

@@ -106,12 +106,17 @@ export interface ToSvgOptions {
    * never reads a clock; without it a current date is reported as unresolved content.
    */
   date?: string;
+  /**
+   * Stamp drawn elements with their OPF path (`data-opf-path`) and the other `data-opf-*` trace attributes. On a slide with an
+   * OPF 0.19 layout template, everything an item of a region draws is grouped in `<g data-opf-region="<name>">`, and each
+   * column of a list laid out in columns is a group with `data-opf-list-column`, `data-opf-list-start` and `data-opf-list-end`.
+   */
   trace?: boolean;
   /**
    * Catalogs the host registered (core `Catalog[]`), passed unchanged to core resolution: a reference the document does not
    * embed resolves against the catalog whose `source` its group names, and the first entry is the default catalog for bare ids
    * when the document omits `catalogs.default`. The renderer bundles and fetches no catalog; register the gallery snapshot with
-   * `import { defaultCatalog } from "@openpresentation/opf/catalog"` and `catalogs: [defaultCatalog]`. Omitted: only embedded
+   * `import { gallery } from "@openpresentation/gallery"` and `catalogs: [gallery]`. Omitted: only embedded
    * records resolve, and anything else draws with core's engine defaults (reported as `unresolved-reference`).
    * A malformed value throws core's `OPFCatalogsOptionError` (`code: "invalid-catalogs"`); a reference with an undeclared prefix
    * (`foo:id` without `catalogs.foo`) fails the boundary check (`invalid-opf`, finding `opf/undeclared-catalog`).
@@ -257,7 +262,6 @@ export interface ResolvedSlide {
     colors: Record<string, string>;
     fonts: Record<"heading" | "body" | "code", string>;
   };
-  titleBindings: RenderBinding[];
   contentItems: RenderBinding[];
   blocks: RenderBinding[];
 }
@@ -265,10 +269,8 @@ export interface ResolvedSlide {
 export interface RenderBinding {
   type: string;
   field?: string;
-  slot?: string;
   value: unknown;
   path: string;
-  placeholderIndex?: number;
   regionKey?: string;
 }
 

package/dist/svg.d.ts

@@ -107,12 +107,17 @@ export interface ToSvgOptions {
    * never reads a clock; without it a current date is reported as unresolved content.
    */
   date?: string;
+  /**
+   * Stamp drawn elements with their OPF path (`data-opf-path`) and the other `data-opf-*` trace attributes. On a slide with an
+   * OPF 0.19 layout template, everything an item of a region draws is grouped in `<g data-opf-region="<name>">`, and each
+   * column of a list laid out in columns is a group with `data-opf-list-column`, `data-opf-list-start` and `data-opf-list-end`.
+   */
   trace?: boolean;
   /**
    * Catalogs the host registered (core `Catalog[]`), passed unchanged to core resolution: a reference the document does not
    * embed resolves against the catalog whose `source` its group names, and the first entry is the default catalog for bare ids
    * when the document omits `catalogs.default`. The renderer bundles and fetches no catalog; register the gallery snapshot with
-   * `import { defaultCatalog } from "@openpresentation/opf/catalog"` and `catalogs: [defaultCatalog]`. Omitted: only embedded
+   * `import { gallery } from "@openpresentation/gallery"` and `catalogs: [gallery]`. Omitted: only embedded
    * records resolve, and anything else draws with core's engine defaults (reported as `unresolved-reference`).
    * A malformed value throws core's `OPFCatalogsOptionError` (`code: "invalid-catalogs"`); a reference with an undeclared prefix
    * (`foo:id` without `catalogs.foo`) fails the boundary check (`invalid-opf`, finding `opf/undeclared-catalog`).
@@ -152,7 +157,6 @@ export interface ResolvedSlide {
     colors: Record<string, string>;
     fonts: Record<"heading" | "body" | "code", string>;
   };
-  titleBindings: RenderBinding[];
   contentItems: RenderBinding[];
   blocks: RenderBinding[];
 }
@@ -160,10 +164,8 @@ export interface ResolvedSlide {
 export interface RenderBinding {
   type: string;
   field?: string;
-  slot?: string;
   value: unknown;
   path: string;
-  placeholderIndex?: number;
   regionKey?: string;
 }
 

package/dist/svg.js

@@ -9,7 +9,7 @@ import {
   ENGINE_DEFAULT_THEME, ENGINE_DEFAULT_COLOR_SCHEME, ENGINE_DEFAULT_FONT_SCHEME, ENGINE_DEFAULT_CHART_TYPES
 } from "@openpresentation/opf/composition";
 // The renderer is a library: it never imports a catalog. Hosts register theirs (`options.catalogs`, core `Catalog[]`, for
-// example `defaultCatalog` from `@openpresentation/opf/catalog`) and core resolves every reference against them.
+// example `defaultCatalog` from `@openpresentation/gallery`) and core resolves every reference against them.
 import {
   hasContentVariables,
   isTemplate,
@@ -132,7 +132,6 @@ const PROMOTED_REGION_KEYS = [
   "top+middle+bottom:left+center+right"
 ];
 
-const TITLE_PLACEHOLDERS = new Set(["title", "subtitle", "tag"]);
 
 const FIELD_TYPE = Object.freeze({
   text: "text",
@@ -457,9 +456,9 @@ function reportGlyphFallback(context, note) {
   });
 }
 
-function contentPayloadFromHost(host, path, slot) {
+function contentPayloadFromHost(host, path) {
   if (!isPlainObject(host)) {
-    return { type: "text", field: "text", value: host, slot: slot ?? "text", path };
+    return { type: "text", field: "text", value: host, path };
   }
 
   for (const field of ROOT_PAYLOAD_FIELDS) {
@@ -468,7 +467,6 @@ function contentPayloadFromHost(host, path, slot) {
         type: host.type ?? FIELD_TYPE[field],
         field,
         value: host[field],
-        slot: host.slot ?? slot ?? host.type ?? FIELD_TYPE[field],
         path: `${path}.${field}`
       };
     }
@@ -478,7 +476,6 @@ function contentPayloadFromHost(host, path, slot) {
     type: "text",
     field: "text",
     value: stableJson(host),
-    slot: slot ?? "text",
     path
   };
 }
@@ -491,7 +488,6 @@ function slideRootContent(slide, slidePath) {
         type: slide.type ?? FIELD_TYPE[field],
         field,
         value: slide[field],
-        slot: slide.type ?? FIELD_TYPE[field],
         path: `${slidePath}.${field}`
       });
     }
@@ -503,8 +499,8 @@ function promotedRegionContent(slide, slidePath) {
   const items = [];
   for (const key of PROMOTED_REGION_KEYS) {
     if (slide[key] !== undefined) {
-      const payload = contentPayloadFromHost(slide[key], `${slidePath}.${key}`, key);
-      items.push({ ...payload, slot: key, regionKey: key });
+      const payload = contentPayloadFromHost(slide[key], `${slidePath}.${key}`);
+      items.push({ ...payload, regionKey: key });
     }
   }
   return items;
@@ -512,15 +508,7 @@ function promotedRegionContent(slide, slidePath) {
 
 function blockContent(slide, slidePath) {
   if (!Array.isArray(slide.blocks)) return [];
-  return slide.blocks.map((block, index) => contentPayloadFromHost(block, `${slidePath}.blocks.${index}`, "body"));
-}
-
-function normalizeFutureContent(slide, slidePath) {
-  if (!Array.isArray(slide.content)) return [];
-  return slide.content.map((item, index) => {
-    const payload = contentPayloadFromHost(item, `${slidePath}.content.${index}`, item.slot);
-    return { ...payload, slot: item.slot ?? payload.slot, path: `${slidePath}.content.${index}` };
-  });
+  return slide.blocks.map((block, index) => contentPayloadFromHost(block, `${slidePath}.blocks.${index}`));
 }
 
 // The core catalog options every resolution takes: the host's catalogs, unchanged, and its strict reference policy.
@@ -556,27 +544,7 @@ function bindSlide(presentation, index, context) {
   // {{deck.slideCount}} hold this slide's number, its section and the deck's slide count, the same values the furniture draws. Core resolved them.
   const slide = slideContext.slide;
   const layout = slideContext.options.layout;
-  const placeholders = Array.isArray(layout?.placeholders) ? layout.placeholders : [];
-  const titleBindings = [];
-
-  for (let i = 0; i < placeholders.length; i += 1) {
-    const type = placeholders[i]?.type;
-    if (!TITLE_PLACEHOLDERS.has(type)) continue;
-    const value = slide[type] ?? presentation[type] ?? "";
-    if (value) {
-      titleBindings.push({
-        type: "text",
-        field: type,
-        slot: type,
-        value,
-        placeholderIndex: i,
-        path: `${slidePath}.${type}`
-      });
-    }
-  }
-
   const contentItems = [
-    ...normalizeFutureContent(slide, slidePath),
     ...slideRootContent(slide, slidePath),
     ...promotedRegionContent(slide, slidePath)
   ];
@@ -638,7 +606,6 @@ function bindSlide(presentation, index, context) {
     slide,
     layout,
     design,
-    titleBindings,
     contentItems,
     blocks
   };
@@ -911,10 +878,15 @@ function imageRecolorMatrix(recolor, bound) {
 function renderSlideContent(bound, width, height, options) {
   for (const diagnostic of [...bound.design.diagnostics, ...bound.geometry.diagnostics]) reportDiagnostic(diagnostic, options);
   return bound.geometry.items.map(item => {
+    // Cards come from core's geometry: item.frameBox is the card core allocated in the item's cell (OPF 0.19: a template
+    // region's flow cell; core never gives an item of a bled region a card).
     const frame=item.frameBox;
     const surface=frame ? tag('rect',{...HIDDEN,x:frame.x,y:frame.y,width:frame.width,height:frame.height,rx:8*Math.min(width,height)/720,fill:bound.design.colors.surface,stroke:bound.design.colors.border,...traceAttrs(options,item.path)}) : '';
     // RR-34: a captioned item draws its media in item.box and its caption band after it (src/annotations.js).
-    return surface+renderPayload(item, item.box, { ...bound, composition: item.composition }, options)+(item.caption?renderCaption(item,{ ...bound, composition: item.composition },options,drawHelpers):'');
+    const drawn=surface+renderPayload(item, item.box, { ...bound, composition: item.composition }, options)+(item.caption?renderCaption(item,{ ...bound, composition: item.composition },options,drawHelpers):'');
+    // OPF 0.19 (RR-81): with trace, everything an item of a layout template region draws (card, payload, caption) is
+    // grouped under data-opf-region, the region's name (ComposedItem.region). Items outside a template are unchanged.
+    return options.trace && item.region !== undefined && drawn ? tag('g',{'data-opf-region':item.region},drawn) : drawn;
   });
 }
 // Draw helpers injected into src/annotations.js (captions and footnote areas).
@@ -985,8 +957,26 @@ function renderTextPayload(item, box, bound, options) {
 }
 
 function renderList(item, box, bound, options) {
+  // OPF 0.19 (RR-81): a list core laid out in columns (item.listColumns) draws every column's own fit in its own box, and
+  // only those: item.text is then the whole list's fit and is never drawn, or the list would draw twice. Core renumbers each
+  // column's entries (indexes, paths and markers), so numbering continues across columns. With trace, each column is a
+  // group carrying its index, its box and the half-open item range it holds.
+  if (Array.isArray(item.listColumns) && item.listColumns.length > 1) {
+    const columns=item.listColumns.map((column,index)=>{
+      const entries=listEntriesSvg(item,column.text,bound,options).join('\n');
+      return options.trace?tag('g',{'data-opf-list-column':index,'data-opf-list-start':column.start,'data-opf-list-end':column.end,
+        'data-opf-box-x':column.box.x,'data-opf-box-y':column.box.y,'data-opf-box-width':column.box.width,'data-opf-box-height':column.box.height,
+        ...(column.text.overflow?{'data-opf-overflow':'true'}:{})},entries):entries;
+    });
+    return tag('g',{...traceAttrs(options,item.path),...(item.listColumns.some(column=>column.text.overflow)?{'data-opf-overflow':'true'}:{})},columns.join('\n'));
+  }
   const scale=Math.min(bound.design.dimensions.width,bound.design.dimensions.height)/720;
   const fit=item.text?.listEntries?item.text:fitList(item.value,box,25*scale,((bound.composition??bound.geometry.composition).minFontSize??16)*scale,{style:{fontFamily:bound.design.fonts.body,fontWeight:400,path:item.path},...(bound.design.fonts.code?{codeFontFamily:bound.design.fonts.code}:{}),textMeasurement:options.textMeasurement,...(item.payload?.numbering!==undefined?{numbering:item.payload.numbering}:{})});
+  return tag('g',{...traceAttrs(options,item.path),...(fit.overflow?{'data-opf-overflow':'true'}:{})},listEntriesSvg(item,fit,bound,options).join('\n'));
+}
+
+// The markers, item text and descriptions of one list fit: a whole list, or one column of a list in columns.
+function listEntriesSvg(item, fit, bound, options) {
   const children=[];
   // design.listBullet=image: core attaches the icon logo as item.bulletImage and its box (entry.bulletBox: 0.65 em, as PowerPoint draws a:buBlip). An icon that cannot be drawn keeps the glyph marker.
   const bullet=item.bulletImage?resolveBulletImage(item.bulletImage,bound,options):undefined;
@@ -997,7 +987,7 @@ function renderList(item, box, bound, options) {
     children.push(renderRichLines(typeof entry.value==='string'?[entry.value]:entry.value,entry.text,entry.textBox,bound,config));
     if(entry.description)children.push(renderRichLines(typeof entry.descriptionValue==='string'?[entry.descriptionValue]:entry.descriptionValue,entry.description,entry.descriptionBox,bound,{...config,path:entry.descriptionPath,rich:Array.isArray(entry.descriptionValue),fill:bound.design.colors.mutedText}));
   }
-  return tag('g',{...traceAttrs(options,item.path),...(fit.overflow?{'data-opf-overflow':'true'}:{})},children.join('\n'));
+  return children;
 }
 
 // A numbered list's marker (numbering) draws the number with the weight and slant core measured it at: PowerPoint draws an

package/dist/text-paths.js

@@ -320,6 +320,8 @@ function precise(value) { return String(Number(Number(value).toPrecision(6))); }
  * slide's text with it. The faces are read from the handle when a slide is outlined, so faces it loads later are used too.
  */
 export function textOutlines(fonts) {
+  const shape = fonts.shaper ? harfBuzzShape(fonts.shaper, { clusterLevel: 2 }) : undefined;
+  fonts.registry?.setShaper?.(shape ? { shape } : undefined);
   return Object.freeze({
     outlineSlideText: (content, options) => {
       const library = outlineLibrary(fonts);
@@ -329,7 +331,7 @@ export function textOutlines(fonts) {
     // opf-render#188: the vector PDF shapes its runs with the same HarfBuzz. Each character stays with the glyph it became (cluster
     // level 2: a mark, a reordered vowel sign), so the PDF's glyph-to-Unicode map and /ActualText spans give the text as before;
     // the glyphs and positions are the outlines'.
-    ...(fonts.shaper ? { shape: harfBuzzShape(fonts.shaper, { clusterLevel: 2 }) } : {}),
+    ...(shape ? { shape } : {}),
   });
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openpresentation/opf-render",
-  "version": "0.18.2",
+  "version": "0.19.1",
   "description": "Deterministic local OPF renderer for SVG, PNG, and PDF output.",
   "license": "MIT",
   "type": "module",
@@ -142,7 +142,7 @@
     "test:forced-colors-browser": "node test/forced-colors-browser.mjs artifacts/forced-colors"
   },
   "dependencies": {
-    "@openpresentation/opf": "^0.18.4",
+    "@openpresentation/opf": "^0.19.0",
     "bidi-js": "1.1.0",
     "fontkit": "^2.0.4",
     "harfbuzzjs": "1.6.3",
@@ -341,6 +341,7 @@
     }
   },
   "devDependencies": {
+    "@openpresentation/gallery": "^2.0.0",
     "@expo-google-fonts/arimo": "0.4.3",
     "@expo-google-fonts/caladea": "0.4.2",
     "@expo-google-fonts/cousine": "0.4.3",