@tscaps/engine 0.3.1 → 0.4.0

package/dist/modules/rendering/subtitle/ElementWidthMeasurer.js

@@ -0,0 +1,119 @@
+import { CssVariable } from '../../document/CssVariable';
+import { DataAttribute } from '../../document/DataAttribute';
+import { ElementWidths } from '../../rendering/subtitle/ElementWidths';
+import { profiler } from '../../profiling/Profiler';
+const WIDTH_VARIABLES = [
+    CssVariable.SEGMENT_WIDTH_EM,
+    CssVariable.LINE_WIDTH_EM,
+    CssVariable.WORD_WIDTH_EM,
+];
+/**
+ * How wide a caption's elements lay out, measured by mounting the
+ * subtree under the consumer's own stylesheet and reading the boxes
+ * back. Answers once per caption per style and reuses that for every
+ * frame the caption is on screen; `clear` drops what it kept.
+ *
+ * Segments, lines and words answer, and nothing else does. They are the
+ * three a stylesheet lays text out in, and every extra kind costs
+ * another custom property on every rendered element for a question no
+ * stylesheet has asked yet. Adding a kind is adding its variable here.
+ *
+ * A style whose CSS reads none of the properties is never measured: the
+ * work is a mount and a layout read, and nothing would consume it.
+ *
+ * Measuring the subtree as it is really built is what keeps the answer
+ * honest. Whatever classes the caption carries at that moment are on
+ * it, so a template that restyles a whole caption on a render state is
+ * measured in the typography that state produces, with no second
+ * description of that state to keep in step.
+ */
+export class ElementWidthMeasurer {
+    subtreeBuilder;
+    viewportWidth;
+    viewportHeight;
+    widthsByKey = new Map();
+    constructor(subtreeBuilder, viewportWidth, viewportHeight) {
+        this.subtreeBuilder = subtreeBuilder;
+        this.viewportWidth = viewportWidth;
+        this.viewportHeight = viewportHeight;
+    }
+    widthsFor(style, styleInput, segment, t, indexInSection) {
+        if (!this.styleReadsAnyWidth(style))
+            return ElementWidths.empty();
+        const key = `${style.kind}:${segment.id}`;
+        let widths = this.widthsByKey.get(key);
+        if (!widths) {
+            widths = this.measure(style, styleInput, segment, t, indexInSection);
+            this.widthsByKey.set(key, widths);
+        }
+        return widths;
+    }
+    clear() {
+        this.widthsByKey.clear();
+    }
+    styleReadsAnyWidth(style) {
+        return WIDTH_VARIABLES.some((property) => style.usedCssVars.has(property));
+    }
+    measure(style, styleInput, segment, t, indexInSection) {
+        const host = document.createElement('div');
+        host.style.cssText = `container-type: size; width: ${this.viewportWidth}px; height: ${this.viewportHeight}px;`;
+        const inner = document.createElement('div');
+        inner.style.cssText = 'display:inline-block;';
+        profiler.time('ElementWidthMeasurer.mount', () => {
+            inner.innerHTML = this.buildMeasurableSubtree(styleInput, segment, t, indexInSection);
+            host.appendChild(inner);
+            style.probeContainer.appendChild(host);
+        });
+        try {
+            return profiler.time('ElementWidthMeasurer.read', () => this.readWidths(inner));
+        }
+        finally {
+            style.probeContainer.removeChild(host);
+        }
+    }
+    /**
+     * The subtree as it will really be built, with every element named so
+     * its box can be found again afterwards.
+     *
+     * The widths are deliberately absent from it. A stylesheet sizing text
+     * from its own width would otherwise have to be measured at the size
+     * it is being asked to produce; leaving the properties unset lets the
+     * rule fall back, and since the answer is a multiple of the font size,
+     * whichever size the fallback lands on gives the same one.
+     */
+    buildMeasurableSubtree(styleInput, segment, t, indexInSection) {
+        const named = { ...styleInput, addressableElementIds: this.everyElementId(segment) };
+        return this.subtreeBuilder.buildSegmentSubtree(named, segment, t, new Set(), indexInSection);
+    }
+    everyElementId(segment) {
+        const ids = new Set([segment.id]);
+        for (const line of segment.lines) {
+            ids.add(line.id);
+            for (const word of line.words)
+                ids.add(word.id);
+        }
+        return ids;
+    }
+    /**
+     * An element that generates no box reports zero. That is the true
+     * answer rather than a missing one — a stylesheet asking the width of
+     * something it took out of flow is asking about a box that is not
+     * there.
+     */
+    readWidths(host) {
+        const widthEmByElementId = new Map();
+        for (const element of host.querySelectorAll(`[${DataAttribute.ELEMENT_ID}]`)) {
+            const elementId = element.getAttribute(DataAttribute.ELEMENT_ID);
+            if (elementId)
+                widthEmByElementId.set(elementId, this.widthEmOf(element));
+        }
+        return new ElementWidths(widthEmByElementId);
+    }
+    widthEmOf(element) {
+        const fontSizePx = parseFloat(window.getComputedStyle(element).fontSize) || 0;
+        if (fontSizePx <= 0)
+            return 0;
+        return element.getBoundingClientRect().width / fontSizePx;
+    }
+}
+//# sourceMappingURL=ElementWidthMeasurer.js.map

package/dist/modules/rendering/subtitle/ElementWidthMeasurer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementWidthMeasurer.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/ElementWidthMeasurer.ts"],"names":[],"mappings":"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"}

package/dist/modules/rendering/subtitle/ElementWidths.d.ts

@@ -0,0 +1,23 @@
+import type { InlineStyleMap } from '../../rendering/types/InlineStyleMap';
+/**
+ * How wide each element of one rendered caption came out, as a
+ * multiple of the font size that element renders at.
+ *
+ * The multiple is what makes the answer usable: a stylesheet deriving a
+ * font size from a width cannot be told the width in pixels, because
+ * the pixels it would be told are the ones its own answer produces. A
+ * width in `em` is free of that, so it stays true whatever size the
+ * measurement happened to be taken at.
+ */
+export declare class ElementWidths {
+    private readonly widthEmByElementId;
+    constructor(widthEmByElementId: ReadonlyMap<string, number>);
+    static empty(): ElementWidths;
+    /**
+     * The named custom property carrying `elementId`'s width, or nothing
+     * at all when the element was not measured — so a caller can spread
+     * the result unconditionally.
+     */
+    varsFor(property: string, elementId: string): InlineStyleMap;
+}
+//# sourceMappingURL=ElementWidths.d.ts.map

package/dist/modules/rendering/subtitle/ElementWidths.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementWidths.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/ElementWidths.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAE9E;;;;;;;;;GASG;AACH,qBAAa,aAAa;IAEZ,OAAO,CAAC,QAAQ,CAAC,kBAAkB;gBAAlB,kBAAkB,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC;IAE5E,MAAM,CAAC,KAAK,IAAI,aAAa;IAI7B;;;;OAIG;IACH,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,cAAc;CAI7D"}

package/dist/modules/rendering/subtitle/ElementWidths.js

@@ -0,0 +1,29 @@
+/**
+ * How wide each element of one rendered caption came out, as a
+ * multiple of the font size that element renders at.
+ *
+ * The multiple is what makes the answer usable: a stylesheet deriving a
+ * font size from a width cannot be told the width in pixels, because
+ * the pixels it would be told are the ones its own answer produces. A
+ * width in `em` is free of that, so it stays true whatever size the
+ * measurement happened to be taken at.
+ */
+export class ElementWidths {
+    widthEmByElementId;
+    constructor(widthEmByElementId) {
+        this.widthEmByElementId = widthEmByElementId;
+    }
+    static empty() {
+        return new ElementWidths(new Map());
+    }
+    /**
+     * The named custom property carrying `elementId`'s width, or nothing
+     * at all when the element was not measured — so a caller can spread
+     * the result unconditionally.
+     */
+    varsFor(property, elementId) {
+        const widthEm = this.widthEmByElementId.get(elementId);
+        return widthEm === undefined ? {} : { [property]: String(widthEm) };
+    }
+}
+//# sourceMappingURL=ElementWidths.js.map

package/dist/modules/rendering/subtitle/ElementWidths.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementWidths.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/ElementWidths.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,MAAM,OAAO,aAAa;IAEK;IAA7B,YAA6B,kBAA+C;QAA/C,uBAAkB,GAAlB,kBAAkB,CAA6B;IAAG,CAAC;IAEhF,MAAM,CAAC,KAAK;QACV,OAAO,IAAI,aAAa,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IACtC,CAAC;IAED;;;;OAIG;IACH,OAAO,CAAC,QAAgB,EAAE,SAAiB;QACzC,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;QACvD,OAAO,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;IACtE,CAAC;CACF"}

package/dist/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.d.ts

@@ -0,0 +1,18 @@
+import type { SpriteSheetRasterOutcome, SpriteSheetRasterProbe } from '../../rendering/subtitle/SpriteSheetRasterProbe';
+/**
+ * Draws a data-URL SVG through an `<img>` onto a canvas, the same
+ * delivery path a real sprite sheet takes, and reads its far corner
+ * back.
+ *
+ * The readback is the point: some hosts decode an oversize SVG and
+ * report success while leaving the far edges unpainted. Nothing public
+ * answers this instead — the reported WebGL limits (`MAX_TEXTURE_SIZE`,
+ * `MAX_VIEWPORT_DIMS`) bear no stable relation to what `img.decode` and
+ * `drawImage` accept.
+ */
+export declare class ImageDecodeSpriteSheetRasterProbe implements SpriteSheetRasterProbe {
+    offer(width: number, height: number): Promise<SpriteSheetRasterOutcome>;
+    private markerSvg;
+    private isMarker;
+}
+//# sourceMappingURL=ImageDecodeSpriteSheetRasterProbe.d.ts.map

package/dist/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageDecodeSpriteSheetRasterProbe.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,wBAAwB,EACxB,sBAAsB,EACvB,MAAM,oDAAoD,CAAC;AAI5D;;;;;;;;;;GAUG;AACH,qBAAa,iCAAkC,YAAW,sBAAsB;IAExE,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,wBAAwB,CAAC;IAe7E,OAAO,CAAC,SAAS;IASjB,OAAO,CAAC,QAAQ;CAGjB"}

package/dist/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.js

@@ -0,0 +1,42 @@
+const MARKER_SIZE_PX = 2;
+/**
+ * Draws a data-URL SVG through an `<img>` onto a canvas, the same
+ * delivery path a real sprite sheet takes, and reads its far corner
+ * back.
+ *
+ * The readback is the point: some hosts decode an oversize SVG and
+ * report success while leaving the far edges unpainted. Nothing public
+ * answers this instead — the reported WebGL limits (`MAX_TEXTURE_SIZE`,
+ * `MAX_VIEWPORT_DIMS`) bear no stable relation to what `img.decode` and
+ * `drawImage` accept.
+ */
+export class ImageDecodeSpriteSheetRasterProbe {
+    async offer(width, height) {
+        const image = new Image();
+        image.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(this.markerSvg(width, height))}`;
+        try {
+            await image.decode();
+            const context = new OffscreenCanvas(width, height).getContext('2d');
+            if (!context)
+                return { refusal: 'no-context' };
+            context.drawImage(image, 0, 0);
+            const corner = context.getImageData(width - 1, height - 1, 1, 1).data;
+            return this.isMarker(corner) ? { refusal: null } : { refusal: 'blank-edge' };
+        }
+        catch (cause) {
+            return { refusal: 'error', cause };
+        }
+    }
+    markerSvg(width, height) {
+        const x = width - MARKER_SIZE_PX;
+        const y = height - MARKER_SIZE_PX;
+        return `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}">`
+            + `<rect width="100%" height="100%" fill="green"/>`
+            + `<rect x="${x}" y="${y}" width="${MARKER_SIZE_PX}" height="${MARKER_SIZE_PX}" fill="red"/>`
+            + `</svg>`;
+    }
+    isMarker(pixel) {
+        return pixel[0] > 200 && pixel[1] < 80 && pixel[2] < 80 && pixel[3] > 200;
+    }
+}
+//# sourceMappingURL=ImageDecodeSpriteSheetRasterProbe.js.map

package/dist/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageDecodeSpriteSheetRasterProbe.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/ImageDecodeSpriteSheetRasterProbe.ts"],"names":[],"mappings":"AAKA,MAAM,cAAc,GAAG,CAAC,CAAC;AAEzB;;;;;;;;;;GAUG;AACH,MAAM,OAAO,iCAAiC;IAE5C,KAAK,CAAC,KAAK,CAAC,KAAa,EAAE,MAAc;QACvC,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;QAC1B,KAAK,CAAC,GAAG,GAAG,oCAAoC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC;QACpG,IAAI,CAAC;YACH,MAAM,KAAK,CAAC,MAAM,EAAE,CAAC;YACrB,MAAM,OAAO,GAAG,IAAI,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;YACpE,IAAI,CAAC,OAAO;gBAAE,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC;YAC/C,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YAC/B,MAAM,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;YACtE,OAAO,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC;QAC/E,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QACrC,CAAC;IACH,CAAC;IAEO,SAAS,CAAC,KAAa,EAAE,MAAc;QAC7C,MAAM,CAAC,GAAG,KAAK,GAAG,cAAc,CAAC;QACjC,MAAM,CAAC,GAAG,MAAM,GAAG,cAAc,CAAC;QAClC,OAAO,kDAAkD,KAAK,aAAa,MAAM,IAAI;cACjF,iDAAiD;cACjD,YAAY,CAAC,QAAQ,CAAC,YAAY,cAAc,aAAa,cAAc,gBAAgB;cAC3F,QAAQ,CAAC;IACf,CAAC;IAEO,QAAQ,CAAC,KAAwB;QACvC,OAAO,KAAK,CAAC,CAAC,CAAE,GAAG,GAAG,IAAI,KAAK,CAAC,CAAC,CAAE,GAAG,EAAE,IAAI,KAAK,CAAC,CAAC,CAAE,GAAG,EAAE,IAAI,KAAK,CAAC,CAAC,CAAE,GAAG,GAAG,CAAC;IAChF,CAAC;CACF"}

package/dist/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.d.ts

@@ -0,0 +1,35 @@
+import type { CssKeyframesScanner } from '../../css/CssKeyframesScanner';
+import type { PreparedStyle } from '../../rendering/subtitle/PreparedStyle';
+import type { AnimationStateFingerprint } from '../../rendering/subtitle/AnimationStateFingerprint';
+/**
+ * Reads the style's CSS. One that neither defines nor applies any
+ * `@keyframes`, and declares no transition, has no animation to be at
+ * a point in, so it is described the same way at every timestamp.
+ * Anything else is never comparable.
+ *
+ * Coarse: a style is answered for as a whole, so one animation
+ * anywhere in it makes every timestamp incomparable, however still the
+ * segment being described happens to be.
+ *
+ * Defining a `@keyframes` counts even where nothing applies it, which
+ * is what covers `animation: var(--name)` — the name is not in the
+ * declaration to be found, and only the block gives it away.
+ *
+ * Every source of CSS the style carries is read, including the inline
+ * styles its overrides put on single elements.
+ *
+ * Read once per style: a prepared style's CSS does not change, and it
+ * can carry embedded font faces, which makes it large. The answer is
+ * held against the style itself, so one prepared from different CSS is
+ * never given another's.
+ */
+export declare class KeyframeScanAnimationStateFingerprint implements AnimationStateFingerprint {
+    private readonly keyframesScanner;
+    private readonly movesByStyle;
+    constructor(keyframesScanner: CssKeyframesScanner);
+    at(style: PreparedStyle): Promise<string | null>;
+    private moves;
+    private everyDeclarationOf;
+    private serialize;
+}
+//# sourceMappingURL=KeyframeScanAnimationStateFingerprint.d.ts.map

package/dist/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyframeScanAnimationStateFingerprint.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAE5E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAC/E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,uDAAuD,CAAC;AAUvG;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBAAa,qCAAsC,YAAW,yBAAyB;IAGzE,OAAO,CAAC,QAAQ,CAAC,gBAAgB;IAF7C,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAyC;gBAEzC,gBAAgB,EAAE,mBAAmB;IAElE,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;IAIhD,OAAO,CAAC,KAAK;IAWb,OAAO,CAAC,kBAAkB;IAU1B,OAAO,CAAC,SAAS;CAIlB"}

package/dist/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.js

@@ -0,0 +1,64 @@
+/** The description every timestamp gets when the style has no animation to be at a point in. */
+const NO_ANIMATION = '';
+// A transition needs a value to change on an element that was already
+// laid out, which a subtree built from scratch never has — except
+// under `@starting-style`, which runs on first paint.
+const TRANSITION_PATTERN = /transition|@starting-style/;
+/**
+ * Reads the style's CSS. One that neither defines nor applies any
+ * `@keyframes`, and declares no transition, has no animation to be at
+ * a point in, so it is described the same way at every timestamp.
+ * Anything else is never comparable.
+ *
+ * Coarse: a style is answered for as a whole, so one animation
+ * anywhere in it makes every timestamp incomparable, however still the
+ * segment being described happens to be.
+ *
+ * Defining a `@keyframes` counts even where nothing applies it, which
+ * is what covers `animation: var(--name)` — the name is not in the
+ * declaration to be found, and only the block gives it away.
+ *
+ * Every source of CSS the style carries is read, including the inline
+ * styles its overrides put on single elements.
+ *
+ * Read once per style: a prepared style's CSS does not change, and it
+ * can carry embedded font faces, which makes it large. The answer is
+ * held against the style itself, so one prepared from different CSS is
+ * never given another's.
+ */
+export class KeyframeScanAnimationStateFingerprint {
+    keyframesScanner;
+    movesByStyle = new WeakMap();
+    constructor(keyframesScanner) {
+        this.keyframesScanner = keyframesScanner;
+    }
+    at(style) {
+        return Promise.resolve(this.moves(style) ? null : NO_ANIMATION);
+    }
+    moves(style) {
+        const known = this.movesByStyle.get(style);
+        if (known !== undefined)
+            return known;
+        const css = this.everyDeclarationOf(style);
+        const moves = this.keyframesScanner.definedNames(css).size > 0
+            || this.keyframesScanner.referencedNames(css).size > 0
+            || TRANSITION_PATTERN.test(css);
+        this.movesByStyle.set(style, moves);
+        return moves;
+    }
+    everyDeclarationOf(style) {
+        return [
+            style.baselineCss,
+            style.scopedCss,
+            this.serialize(style.inlineStyles),
+            ...[...style.segmentOverrides.values(), ...style.wordOverrides.values()]
+                .map((override) => this.serialize(override.inlineStyles)),
+        ].join(';');
+    }
+    serialize(inlineStyles) {
+        if (!inlineStyles)
+            return '';
+        return Object.entries(inlineStyles).map(([property, value]) => `${property}:${value}`).join(';');
+    }
+}
+//# sourceMappingURL=KeyframeScanAnimationStateFingerprint.js.map

package/dist/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyframeScanAnimationStateFingerprint.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/KeyframeScanAnimationStateFingerprint.ts"],"names":[],"mappings":"AAKA,gGAAgG;AAChG,MAAM,YAAY,GAAG,EAAE,CAAC;AAExB,sEAAsE;AACtE,kEAAkE;AAClE,sDAAsD;AACtD,MAAM,kBAAkB,GAAG,4BAA4B,CAAC;AAExD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,OAAO,qCAAqC;IAGnB;IAFZ,YAAY,GAAG,IAAI,OAAO,EAA0B,CAAC;IAEtE,YAA6B,gBAAqC;QAArC,qBAAgB,GAAhB,gBAAgB,CAAqB;IAAG,CAAC;IAEtE,EAAE,CAAC,KAAoB;QACrB,OAAO,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;IAClE,CAAC;IAEO,KAAK,CAAC,KAAoB;QAChC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QAC3C,IAAI,KAAK,KAAK,SAAS;YAAE,OAAO,KAAK,CAAC;QACtC,MAAM,GAAG,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,CAAC;eACzD,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,CAAC;eACnD,kBAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAClC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QACpC,OAAO,KAAK,CAAC;IACf,CAAC;IAEO,kBAAkB,CAAC,KAAoB;QAC7C,OAAO;YACL,KAAK,CAAC,WAAW;YACjB,KAAK,CAAC,SAAS;YACf,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC;YAClC,GAAG,CAAC,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,EAAE,GAAG,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;iBACrE,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;SAC5D,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACd,CAAC;IAEO,SAAS,CAAC,YAAwC;QACxD,IAAI,CAAC,YAAY;YAAE,OAAO,EAAE,CAAC;QAC7B,OAAO,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,QAAQ,IAAI,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACnG,CAAC;CACF"}

package/dist/modules/rendering/subtitle/PreparedStyle.d.ts

@@ -26,6 +26,8 @@ export interface PreparedStyle {
     segmentOverrides: ElementRenderOverrides;
     decorationPlacements: ReadonlyMap<string, DecorationPlacementSide>;
     addressableElementIds: ReadonlySet<string>;
+    /** Every custom property the style's CSS reads, whether by substitution or style query. */
+    usedCssVars: ReadonlySet<string>;
     probeStyleElement: HTMLStyleElement;
     probeContainer: HTMLElement;
     scopeClass: string;

package/dist/modules/rendering/subtitle/PreparedStyle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreparedStyle.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kDAAkD,CAAC;AAChG,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iDAAiD,CAAC;AAC9F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAC9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAEnF;;;;;;;;GAQG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,eAAe,CAAC;IACzB,YAAY,EAAE,cAAc,CAAC;IAC7B,SAAS,EAAE,eAAe,CAAC;IAC3B,SAAS,EAAE,eAAe,CAAC;IAC3B,aAAa,EAAE,sBAAsB,CAAC;IACtC,gBAAgB,EAAE,sBAAsB,CAAC;IACzC,oBAAoB,EAAE,WAAW,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAC;IACnE,qBAAqB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3C,iBAAiB,EAAE,gBAAgB,CAAC;IACpC,cAAc,EAAE,WAAW,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;CACrB"}
+{"version":3,"file":"PreparedStyle.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kDAAkD,CAAC;AAChG,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iDAAiD,CAAC;AAC9F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAC9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAEnF;;;;;;;;GAQG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,eAAe,CAAC;IACzB,YAAY,EAAE,cAAc,CAAC;IAC7B,SAAS,EAAE,eAAe,CAAC;IAC3B,SAAS,EAAE,eAAe,CAAC;IAC3B,aAAa,EAAE,sBAAsB,CAAC;IACtC,gBAAgB,EAAE,sBAAsB,CAAC;IACzC,oBAAoB,EAAE,WAAW,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAC;IACnE,qBAAqB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3C,2FAA2F;IAC3F,WAAW,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACjC,iBAAiB,EAAE,gBAAgB,CAAC;IACpC,cAAc,EAAE,WAAW,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;CACrB"}

package/dist/modules/rendering/subtitle/PreparedStyleFactory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreparedStyleFactory.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyleFactory.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAC9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAClF,OAAO,KAAK,EAAE,mBAAmB,EAAiB,MAAM,+CAA+C,CAAC;AACxG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,wDAAwD,CAAC;AAO3G,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAE/E;;;;;;GAMG;AACH,qBAAa,oBAAoB;IAG7B,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,sBAAsB;IACvC,OAAO,CAAC,QAAQ,CAAC,mBAAmB;IACpC,OAAO,CAAC,QAAQ,CAAC,eAAe;IAChC,OAAO,CAAC,QAAQ,CAAC,4BAA4B;gBAN5B,WAAW,EAAE,mBAAmB,EAChC,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,sBAAsB,EAAE,sBAAsB,EAC9C,mBAAmB,EAAE,mBAAmB,EACxC,eAAe,EAAE,eAAe,EAChC,4BAA4B,EAAE,4BAA4B;IAGvE,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,EAAE,QAAQ,GAAG,OAAO,CAAC,aAAa,CAAC;IAoDvF,OAAO,CAAC,yBAAyB;IAKjC,OAAO,CAAC,qBAAqB;CAS9B"}
+{"version":3,"file":"PreparedStyleFactory.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyleFactory.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAC9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAClF,OAAO,KAAK,EAAE,mBAAmB,EAAiB,MAAM,+CAA+C,CAAC;AACxG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,wDAAwD,CAAC;AAO3G,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAW/E;;;;;;GAMG;AACH,qBAAa,oBAAoB;IAG7B,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,sBAAsB;IACvC,OAAO,CAAC,QAAQ,CAAC,mBAAmB;IACpC,OAAO,CAAC,QAAQ,CAAC,eAAe;IAChC,OAAO,CAAC,QAAQ,CAAC,4BAA4B;gBAN5B,WAAW,EAAE,mBAAmB,EAChC,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,sBAAsB,EAAE,sBAAsB,EAC9C,mBAAmB,EAAE,mBAAmB,EACxC,eAAe,EAAE,eAAe,EAChC,4BAA4B,EAAE,4BAA4B;IAGvE,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,EAAE,QAAQ,GAAG,OAAO,CAAC,aAAa,CAAC;IAuDvF,OAAO,CAAC,yBAAyB;IAKjC,OAAO,CAAC,qBAAqB;CAS9B"}

package/dist/modules/rendering/subtitle/PreparedStyleFactory.js

@@ -2,6 +2,14 @@ import { SvgFilterBundle } from '../../svg-filter/SvgFilterBundle';
 import { SvgFilterScope } from '../../svg-filter/SvgFilterScope';
 import { ElementRenderOverrides } from '../../rendering/types/ElementRenderOverrides';
 import { InlineStyleEmitter } from '../../rendering/styles/InlineStyleEmitter';
+// `!important`, so a sheet declaring any of them for its own layout
+// cannot bring the probe container back on screen.
+const PROBE_CONTAINER_STYLES = {
+    position: 'fixed',
+    left: '-99999px',
+    visibility: 'hidden',
+    'pointer-events': 'none',
+};
 /**
  * Prepares a `SubtitleStyle` for downstream rendering: minifies and
  * embeds the CSS, scopes it to a unique class, mounts a probe
@@ -47,7 +55,9 @@ export class PreparedStyleFactory {
         document.head.appendChild(probeStyleEl);
         const probeContainer = document.createElement('div');
         probeContainer.className = scopeClass;
-        probeContainer.style.cssText = 'position:fixed;left:-99999px;visibility:hidden;pointer-events:none;';
+        for (const [property, value] of Object.entries(PROBE_CONTAINER_STYLES)) {
+            probeContainer.style.setProperty(property, value, 'important');
+        }
         document.body.appendChild(probeContainer);
         const usedCssVars = this.cssVarReferenceScanner.scan(baselineCss + scopedCss);
         return {
@@ -67,6 +77,7 @@ export class PreparedStyleFactory {
             probeStyleElement: probeStyleEl,
             probeContainer,
             scopeClass,
+            usedCssVars,
             inlineStyleEmitter: new InlineStyleEmitter(usedCssVars),
             baselineNeeds,
             baselineCss,

package/dist/modules/rendering/subtitle/PreparedStyleFactory.js.map

@@ -1 +1 @@
-{"version":3,"file":"PreparedStyleFactory.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyleFactory.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"PreparedStyleFactory.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/PreparedStyleFactory.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AACtE,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,sBAAsB,EAAE,MAAM,iDAAiD,CAAC;AACzF,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAKlF,oEAAoE;AACpE,mDAAmD;AACnD,MAAM,sBAAsB,GAA2B;IACrD,QAAQ,EAAE,OAAO;IACjB,IAAI,EAAE,UAAU;IAChB,UAAU,EAAE,QAAQ;IACpB,gBAAgB,EAAE,MAAM;CACzB,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,OAAO,oBAAoB;IAGZ;IACA;IACA;IACA;IACA;IACA;IACA;IAPnB,YACmB,WAAgC,EAChC,SAAoB,EACpB,WAAwB,EACxB,sBAA8C,EAC9C,mBAAwC,EACxC,eAAgC,EAChC,4BAA0D;QAN1D,gBAAW,GAAX,WAAW,CAAqB;QAChC,cAAS,GAAT,SAAS,CAAW;QACpB,gBAAW,GAAX,WAAW,CAAa;QACxB,2BAAsB,GAAtB,sBAAsB,CAAwB;QAC9C,wBAAmB,GAAnB,mBAAmB,CAAqB;QACxC,oBAAe,GAAf,eAAe,CAAiB;QAChC,iCAA4B,GAA5B,4BAA4B,CAA8B;IAC1E,CAAC;IAEJ,KAAK,CAAC,MAAM,CAAC,IAAY,EAAE,KAAoB,EAAE,GAAa;QAC5D,MAAM,cAAc,GAAG,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;QAClF,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;QACzD,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACxD,MAAM,UAAU,GAAG,iBAAiB,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;QACrF,MAAM,EAAE,GAAG,EAAE,sBAAsB,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QAClF,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,sBAAsB,EAAE,IAAI,UAAU,EAAE,CAAC,CAAC;QAEjF,MAAM,aAAa,GAAkB;YACnC,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,GAAG,EAAE,IAAI,CAAC;YAClD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,QAAQ;SAChD,CAAC;QACF,MAAM,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAEpE,+DAA+D;QAC/D,+DAA+D;QAC/D,gCAAgC;QAChC,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,IAAI,UAAU,EAAE,CAAC,CAAC;QAC3E,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACrD,YAAY,CAAC,WAAW,GAAG,cAAc,GAAG,SAAS,CAAC;QACtD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;QAExC,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACrD,cAAc,CAAC,SAAS,GAAG,UAAU,CAAC;QACtC,KAAK,MAAM,CAAC,QAAQ,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,sBAAsB,CAAC,EAAE,CAAC;YACvE,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC;QACjE,CAAC;QACD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QAE1C,MAAM,WAAW,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC;QAE9E,OAAO;YACL,IAAI;YACJ,SAAS;YACT,OAAO,EAAE,KAAK,CAAC,UAAU,IAAI,eAAe,CAAC,KAAK,CAAC;gBACjD,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,EAAE;gBACrC,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC;aACrD,CAAC;YACF,YAAY,EAAE,KAAK,CAAC,YAAY;YAChC,SAAS,EAAE,KAAK,CAAC,SAAS;YAC1B,SAAS,EAAE,KAAK,CAAC,SAAS;YAC1B,aAAa,EAAE,KAAK,CAAC,aAAa,IAAI,sBAAsB,CAAC,KAAK,EAAE;YACpE,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,IAAI,sBAAsB,CAAC,KAAK,EAAE;YAC1E,oBAAoB,EAAE,KAAK,CAAC,oBAAoB,IAAI,IAAI,GAAG,EAAmC;YAC9F,qBAAqB,EAAE,KAAK,CAAC,qBAAqB,IAAI,IAAI,GAAG,EAAU;YACvE,iBAAiB,EAAE,YAAY;YAC/B,cAAc;YACd,UAAU;YACV,WAAW;YACX,kBAAkB,EAAE,IAAI,kBAAkB,CAAC,WAAW,CAAC;YACvD,aAAa;YACb,WAAW;SACZ,CAAC;IACJ,CAAC;IAEO,yBAAyB,CAAC,GAAW,EAAE,SAA0B;QACvE,MAAM,IAAI,GAAG,IAAI,CAAC,4BAA4B,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;QACxE,OAAO,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;IACxC,CAAC;IAEO,qBAAqB,CAAC,GAAa,EAAE,IAAY;QACvD,KAAK,MAAM,OAAO,IAAI,GAAG,CAAC,QAAQ,EAAE,CAAC;YACnC,IAAI,OAAO,CAAC,IAAI,KAAK,IAAI;gBAAE,SAAS;YACpC,KAAK,MAAM,IAAI,IAAI,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC;gBACtC,IAAI,IAAI,CAAC,UAAU;oBAAE,OAAO,IAAI,CAAC;YACnC,CAAC;QACH,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC;CACF"}

package/dist/modules/rendering/subtitle/SegmentAnchorVarsBuilder.d.ts

@@ -0,0 +1,28 @@
+import type { InlineStyleMap } from '../../rendering/types/InlineStyleMap';
+/**
+ * Where a subtree's anchor sits, in the terms a stylesheet needs to
+ * reason about it.
+ */
+export interface AnchorPlacement {
+    /** Anchor position down the frame, as a fraction of its height. */
+    readonly verticalOffset: number;
+    /** Share of the box's own height that sits above the anchor: 0, 50 or 100. */
+    readonly vAnchorPct: number;
+}
+/**
+ * Publishes a subtree's vertical anchor so a stylesheet can address the
+ * frame rather than the anchor it happens to hang from.
+ *
+ * Positioning is resolved before any stylesheet runs, which leaves CSS
+ * able to move a caption only *relative* to wherever it was placed. A
+ * rule wanting an absolute position therefore has to undo the placement
+ * first, and these two values are what that costs: the offset says where
+ * the anchor landed, and the origin says which part of the box was put
+ * on it. Emitted as a percentage, the origin resolves against the box's
+ * own height inside a `translate`, so a rule can convert any anchor to a
+ * top-edge one without knowing how tall the caption grew.
+ */
+export declare class SegmentAnchorVarsBuilder {
+    build(placement: AnchorPlacement): InlineStyleMap;
+}
+//# sourceMappingURL=SegmentAnchorVarsBuilder.d.ts.map

package/dist/modules/rendering/subtitle/SegmentAnchorVarsBuilder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentAnchorVarsBuilder.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/SegmentAnchorVarsBuilder.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAE9E;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,mEAAmE;IACnE,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,8EAA8E;IAC9E,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;CAC7B;AAED;;;;;;;;;;;;GAYG;AACH,qBAAa,wBAAwB;IAEnC,KAAK,CAAC,SAAS,EAAE,eAAe,GAAG,cAAc;CAMlD"}

package/dist/modules/rendering/subtitle/SegmentAnchorVarsBuilder.js

@@ -0,0 +1,23 @@
+import { CssVariable } from '../../document/CssVariable';
+/**
+ * Publishes a subtree's vertical anchor so a stylesheet can address the
+ * frame rather than the anchor it happens to hang from.
+ *
+ * Positioning is resolved before any stylesheet runs, which leaves CSS
+ * able to move a caption only *relative* to wherever it was placed. A
+ * rule wanting an absolute position therefore has to undo the placement
+ * first, and these two values are what that costs: the offset says where
+ * the anchor landed, and the origin says which part of the box was put
+ * on it. Emitted as a percentage, the origin resolves against the box's
+ * own height inside a `translate`, so a rule can convert any anchor to a
+ * top-edge one without knowing how tall the caption grew.
+ */
+export class SegmentAnchorVarsBuilder {
+    build(placement) {
+        return {
+            [CssVariable.SEGMENT_ANCHOR_Y]: String(placement.verticalOffset),
+            [CssVariable.SEGMENT_ANCHOR_ORIGIN_Y]: `${placement.vAnchorPct}%`,
+        };
+    }
+}
+//# sourceMappingURL=SegmentAnchorVarsBuilder.js.map

package/dist/modules/rendering/subtitle/SegmentAnchorVarsBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentAnchorVarsBuilder.js","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/SegmentAnchorVarsBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAc5D;;;;;;;;;;;;GAYG;AACH,MAAM,OAAO,wBAAwB;IAEnC,KAAK,CAAC,SAA0B;QAC9B,OAAO;YACL,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;YAChE,CAAC,WAAW,CAAC,uBAAuB,CAAC,EAAE,GAAG,SAAS,CAAC,UAAU,GAAG;SAClE,CAAC;IACJ,CAAC;CACF"}

package/dist/modules/rendering/subtitle/SegmentSubtreeHtmlBuilder.d.ts

@@ -1,6 +1,7 @@
 import type { Segment } from '../../document/Segment';
 import type { Line } from '../../document/Line';
 import type { Word } from '../../document/Word';
+import { ElementWidths } from '../../rendering/subtitle/ElementWidths';
 import type { InlineStyleMap } from '../../rendering/types/InlineStyleMap';
 import type { InlineStyleEmitter } from '../../rendering/styles/InlineStyleEmitter';
 import type { ElementRenderOverrides } from '../../rendering/types/ElementRenderOverrides';
@@ -34,6 +35,8 @@ export interface SegmentSubtreeStyleInput {
      * stamping everything grows it by roughly a quarter.
      */
     readonly addressableElementIds: ReadonlySet<string>;
+    /** Measured widths of this segment's elements; empty when nothing reads them. */
+    readonly elementWidths: ElementWidths;
 }
 /**
  * Builds the `wrapper → segment → lines → words/letters` HTML

package/dist/modules/rendering/subtitle/SegmentSubtreeHtmlBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentSubtreeHtmlBuilder.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/SegmentSubtreeHtmlBuilder.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"SegmentSubtreeHtmlBuilder.d.ts","sourceRoot":"","sources":["../../../../src/modules/rendering/subtitle/SegmentSubtreeHtmlBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAI1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAC9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iDAAiD,CAAC;AAC9F,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kDAAkD,CAAC;AAChG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAGpE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAEjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAOnE;;;;GAIG;AACH,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,gBAAgB,EAAE,cAAc,CAAC;IAC1C,QAAQ,CAAC,aAAa,EAAE,sBAAsB,CAAC;IAC/C,QAAQ,CAAC,qBAAqB,EAAE,OAAO,CAAC;IACxC,QAAQ,CAAC,sBAAsB,EAAE,OAAO,CAAC;IACzC,QAAQ,CAAC,kBAAkB,EAAE,cAAc,CAAC;IAC5C,0FAA0F;IAC1F,QAAQ,CAAC,mBAAmB,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACpD,qHAAqH;IACrH,QAAQ,CAAC,oBAAoB,EAAE,WAAW,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAC;IAC5E,QAAQ,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;IAChD,0DAA0D;IAC1D,QAAQ,CAAC,aAAa,EAAE,aAAa,CAAC;IACtC;;;;;OAKG;IACH,QAAQ,CAAC,qBAAqB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACpD,iFAAiF;IACjF,QAAQ,CAAC,aAAa,EAAE,aAAa,CAAC;CACvC;AAiBD;;;;;;;;;;GAUG;AACH,qBAAa,yBAAyB;IAGlC,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,cAAc;gBADd,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc;IAGjD;;;;;;;;OAQG;IACH,mBAAmB,CACjB,KAAK,EAAE,wBAAwB,EAC/B,GAAG,EAAE,OAAO,EACZ,CAAC,EAAE,MAAM,EACT,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,EACpC,cAAc,EAAE,MAAM,GACrB,MAAM;IAWT;;;;;;;;;OASG;IACH,sBAAsB,CACpB,KAAK,EAAE,wBAAwB,EAC/B,GAAG,EAAE,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,CAAC,EAAE,MAAM,EACT,cAAc,EAAE,MAAM,EACtB,WAAW,EAAE,MAAM,GAClB,MAAM;IAQT;;;;;OAKG;IACH,4BAA4B,CAC1B,KAAK,EAAE,wBAAwB,EAC/B,GAAG,EAAE,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,CAAC,EAAE,MAAM,EACT,cAAc,EAAE,MAAM,GACrB,MAAM;IAQT,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,kBAAkB;IAe1B,OAAO,CAAC,oBAAoB;IAgB5B,OAAO,CAAC,aAAa;IAsBrB;;;;;OAKG;IACH,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,qBAAqB;IA4C7B,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,0BAA0B;IAQlC,OAAO,CAAC,qCAAqC;IAc7C,OAAO,CAAC,8BAA8B;IAuBtC,OAAO,CAAC,uBAAuB;IAa/B;;;OAGG;IACH,OAAO,CAAC,aAAa;IAKrB,OAAO,CAAC,UAAU;CAGnB"}

package/dist/modules/rendering/subtitle/SegmentSubtreeHtmlBuilder.js

@@ -90,13 +90,19 @@ export class SegmentSubtreeHtmlBuilder {
     // from them.
     composeSegmentHtml(style, seg, t, indexInSection, innerHtml) {
         const classes = [...seg.getCssClasses(t), ...style.extraSegmentClasses].join(' ');
-        const segStyle = style.inlineStyleEmitter.serializeStyles(seg.getCssVariables(t, { indexInSection }));
+        const segStyle = style.inlineStyleEmitter.serializeStyles({
+            ...seg.getCssVariables(t, { indexInSection }),
+            ...style.elementWidths.varsFor(CssVariable.SEGMENT_WIDTH_EM, seg.id),
+        });
         return `<div class="${classes}" style="${segStyle}"${this.elementIdAttr(style, seg.id)}>${innerHtml}</div>`;
     }
     buildLineWrapperHtml(style, line, t, segTime, innerHtml) {
         const classes = line.getCssClasses(t).join(' ');
         const lineStyle = LINE_LAYOUT_STYLE
-            + style.inlineStyleEmitter.serializeStyles(line.getCssVariables(t, { segTime }));
+            + style.inlineStyleEmitter.serializeStyles({
+                ...line.getCssVariables(t, { segTime }),
+                ...style.elementWidths.varsFor(CssVariable.LINE_WIDTH_EM, line.id),
+            });
         return `<div class="${classes}" style="${lineStyle}"${this.elementIdAttr(style, line.id)}>${innerHtml}</div>`;
     }
     buildLineHtml(style, line, t, excludedWordIds, segTime) {
@@ -154,7 +160,10 @@ export class SegmentSubtreeHtmlBuilder {
     buildWordFragmentHtml(style, input, t, segTime) {
         const { fragment, word, indexInLine } = input;
         const wordClasses = word.getCssClasses(t);
-        const wordVars = word.getCssVariables(t, { segTime, indexInLine });
+        const wordVars = {
+            ...word.getCssVariables(t, { segTime, indexInLine }),
+            ...style.elementWidths.varsFor(CssVariable.WORD_WIDTH_EM, word.id),
+        };
         const overrideStyle = style.inlineStyleEmitter.serializeStyles(style.wordOverrides.get(word.id)?.inlineStyles);
         const decorationHtml = fragment.carriesWordTail && this.shouldEmitInlineDecoration(style, word)
             ? this.buildDecorationSpanHtml(style, word.decoration, t, segTime, word.time)