modern-text 1.12.0 → 2.0.0

package/dist/shared/{modern-text.CrFHIJtB.mjs → modern-text.ChzjFjsk.mjs}

@@ -1,7 +1,7 @@
 import { isNone, isGradient, normalizeGradient, clearUndef, Reactivable, normalizeText, getDefaultStyle, property } from 'modern-idoc';
 import { svgToDom, svgToPath2DSet, Path2DSet, Transform2D, setCanvasContext, Path2D, BoundingBox, Vector2 } from 'modern-path2d';
-import { a as definePlugin, b as deformationPlugin } from './modern-text.JF1ny7A-.mjs';
 import { fonts } from 'modern-font';
+import { a as definePlugin, b as deformationPlugin } from './modern-text.JF1ny7A-.mjs';
 
 function createSvgLoader() {
   const loaded = /* @__PURE__ */ new Map();
@@ -529,6 +529,18 @@ class Character {
     this.fontStyle = fsSelectionMap[os2.fsSelection] ?? macStyleMap[head.macStyle];
     return this;
   }
+  /**
+   * Populate glyph metrics only (advance width/height, ascender/descender,
+   * baseline, …) without building the glyph `path` or touching boxes.
+   *
+   * The DOM {@link DomMeasurer} never needs this — it reads positions back from the
+   * browser. A pure-JS measurer (e.g. `FontMeasurer`) must know advances *before*
+   * it can place characters, so it calls this ahead of layout. `update()` later
+   * recomputes the same metrics while building the path, so this is idempotent.
+   */
+  measureGlyph(fonts) {
+    return this.updateGlyph(this._getFontSFNT(fonts));
+  }
   update(fonts) {
     const sfnt = this._getFontSFNT(fonts);
     if (!sfnt) {
@@ -721,7 +733,7 @@ function getSharedContainer() {
   sharedContainer = container;
   return container;
 }
-class Measurer {
+class DomMeasurer {
   static notZeroStyles = /* @__PURE__ */ new Set([
     "width",
     "height"
@@ -756,7 +768,7 @@ class Measurer {
       return cached;
     }
     const domStyle = {};
-    const { notZeroStyles, pxStyles } = Measurer;
+    const { notZeroStyles, pxStyles } = DomMeasurer;
     for (const key in style) {
       const value = style[key];
       if (notZeroStyles.has(key) && value === 0) {
@@ -1065,6 +1077,253 @@ class Measurer {
   }
 }
 
+function side(style, name, edge) {
+  return style[`${name}${edge}`] ?? style[name] ?? 0;
+}
+class FontMeasurer {
+  measure(paragraphs, rootStyle, _dom, fonts$1) {
+    const _fonts = fonts$1 ?? fonts;
+    for (const paragraph of paragraphs) {
+      for (const fragment of paragraph.fragments) {
+        for (const character of fragment.characters) {
+          character.measureGlyph(_fonts);
+        }
+      }
+    }
+    return rootStyle.writingMode.includes("vertical") ? this._measureVertical(paragraphs, rootStyle) : this._measureHorizontal(paragraphs, rootStyle);
+  }
+  _rootPadding(rootStyle) {
+    return {
+      top: side(rootStyle, "padding", "Top"),
+      right: side(rootStyle, "padding", "Right"),
+      bottom: side(rootStyle, "padding", "Bottom"),
+      left: side(rootStyle, "padding", "Left")
+    };
+  }
+  _measureHorizontal(paragraphs, rootStyle) {
+    const rootPad = this._rootPadding(rootStyle);
+    const hasWidth = typeof rootStyle.width === "number";
+    const availWidth = hasWidth ? rootStyle.width - rootPad.left - rootPad.right : Infinity;
+    let y = rootPad.top;
+    let maxRight = rootPad.left;
+    for (const paragraph of paragraphs) {
+      const pStyle = paragraph.computedStyle;
+      const pBox = paragraph.style;
+      const mTop = side(pBox, "margin", "Top");
+      const mBottom = side(pBox, "margin", "Bottom");
+      const mLeft = side(pBox, "margin", "Left");
+      const mRight = side(pBox, "margin", "Right");
+      const pTop = side(pBox, "padding", "Top");
+      const pBottom = side(pBox, "padding", "Bottom");
+      const pLeft = side(pBox, "padding", "Left");
+      const pRight = side(pBox, "padding", "Right");
+      const liLeft = rootPad.left + mLeft + pLeft;
+      const liAvail = availWidth === Infinity ? Infinity : availWidth - mLeft - mRight - pLeft - pRight;
+      y += mTop + pTop;
+      const paraTop = y;
+      let paraRight = liLeft;
+      const lines = this._breakLines(paragraph, liAvail);
+      const align = pStyle.textAlign;
+      const indent = pStyle.textIndent ?? 0;
+      for (let i = 0; i < lines.length; i++) {
+        const line = lines[i];
+        const lineIndent = i === 0 ? indent : 0;
+        let lineHeight = pStyle.fontSize * pStyle.lineHeight;
+        let contentWidth = 0;
+        for (const c of line) {
+          if (c.fontHeight > lineHeight) {
+            lineHeight = c.fontHeight;
+          }
+          contentWidth += this._advance(c);
+        }
+        let x = liLeft + lineIndent;
+        if (liAvail !== Infinity) {
+          const slack = liAvail - lineIndent - contentWidth;
+          if (align === "center") {
+            x += slack / 2;
+          } else if (align === "end" || align === "right") {
+            x += slack;
+          }
+        }
+        for (const c of line) {
+          const adv = c.advanceWidth;
+          const contentHeight = c.advanceHeight;
+          const fontHeight = c.fontHeight;
+          c.inlineBox.left = x;
+          c.inlineBox.top = y + (lineHeight - contentHeight) / 2;
+          c.inlineBox.width = adv;
+          c.inlineBox.height = contentHeight;
+          c.lineBox.left = x;
+          c.lineBox.top = c.inlineBox.top + (contentHeight - fontHeight) / 2;
+          c.lineBox.width = adv;
+          c.lineBox.height = fontHeight;
+          x += this._advance(c);
+        }
+        if (x > paraRight) {
+          paraRight = x;
+        }
+        y += lineHeight;
+      }
+      if (paraRight > maxRight) {
+        maxRight = paraRight;
+      }
+      for (const fragment of paragraph.fragments) {
+        this._unionInto(fragment.inlineBox, fragment.characters.map((c) => c.inlineBox));
+      }
+      paragraph.lineBox.left = liLeft;
+      paragraph.lineBox.top = paraTop;
+      paragraph.lineBox.width = liAvail === Infinity ? paraRight - liLeft : liAvail;
+      paragraph.lineBox.height = y - paraTop;
+      y += pBottom + mBottom;
+    }
+    const contentBottom = y + rootPad.bottom;
+    const totalWidth = hasWidth ? rootStyle.width : maxRight + rootPad.right;
+    const totalHeight = typeof rootStyle.height === "number" ? rootStyle.height : contentBottom;
+    if (typeof rootStyle.height === "number") {
+      const slack = totalHeight - contentBottom;
+      const va = rootStyle.verticalAlign;
+      const dy = va === "middle" ? slack / 2 : va === "bottom" ? slack : 0;
+      if (dy) {
+        this._shiftAll(paragraphs, dy);
+      }
+    }
+    return {
+      paragraphs,
+      boundingBox: new BoundingBox(0, 0, totalWidth, totalHeight)
+    };
+  }
+  /**
+   * Vertical writing-mode (`vertical-rl`): columns stack right-to-left, glyphs
+   * flow top→bottom. It is the horizontal layout with the inline and block axes
+   * swapped — the inline (down-column) advance is `advanceWidth` (CJK upright = em;
+   * Latin is rotated, so its advance ≈ its width), the cross-axis content box is
+   * `advanceHeight`, and the column thickness is `fontHeight`. The lineBox is
+   * derived exactly as DomMeasurer.measureParagraphDom's vertical branch, so it
+   * stays accurate even though inlineBox carries the content-box rounding residual.
+   *
+   * v1: `vertical-rl` only; no per-paragraph margin/padding or block alignment.
+   */
+  _measureVertical(paragraphs, rootStyle) {
+    const rootPad = this._rootPadding(rootStyle);
+    const hasHeight = typeof rootStyle.height === "number";
+    const availHeight = hasHeight ? rootStyle.height - rootPad.top - rootPad.bottom : Infinity;
+    const columns = [];
+    for (const paragraph of paragraphs) {
+      const strut = paragraph.computedStyle.fontSize * paragraph.computedStyle.lineHeight;
+      for (const line of this._breakLines(paragraph, availHeight)) {
+        let thickness = strut;
+        for (const c of line) {
+          if (c.fontHeight > thickness) {
+            thickness = c.fontHeight;
+          }
+        }
+        columns.push({ chars: line, thickness });
+      }
+    }
+    const totalThickness = columns.reduce((sum, c) => sum + c.thickness, 0);
+    const hasWidth = typeof rootStyle.width === "number";
+    const blockWidth = hasWidth ? Math.max(rootStyle.width - rootPad.left - rootPad.right, totalThickness) : totalThickness;
+    let xRight = rootPad.left + blockWidth;
+    let maxBottom = rootPad.top;
+    for (const column of columns) {
+      xRight -= column.thickness;
+      const colLeft = xRight;
+      let y = rootPad.top;
+      for (const c of column.chars) {
+        const advance = c.advanceWidth;
+        const contentWidth = c.advanceHeight;
+        const fontHeight = c.fontHeight;
+        c.inlineBox.top = y;
+        c.inlineBox.height = advance;
+        c.inlineBox.width = contentWidth;
+        c.inlineBox.left = colLeft + (column.thickness - contentWidth) / 2;
+        c.lineBox.left = c.inlineBox.left + (contentWidth - fontHeight) / 2;
+        c.lineBox.top = y;
+        c.lineBox.width = fontHeight;
+        c.lineBox.height = advance;
+        y += this._advance(c);
+      }
+      if (y > maxBottom) {
+        maxBottom = y;
+      }
+    }
+    for (const paragraph of paragraphs) {
+      for (const fragment of paragraph.fragments) {
+        this._unionInto(fragment.inlineBox, fragment.characters.map((c) => c.inlineBox));
+      }
+      this._unionInto(
+        paragraph.lineBox,
+        paragraph.fragments.flatMap((f) => f.characters.map((c) => c.inlineBox))
+      );
+    }
+    const totalWidth = hasWidth ? rootStyle.width : blockWidth + rootPad.left + rootPad.right;
+    const totalHeight = hasHeight ? rootStyle.height : maxBottom + rootPad.bottom;
+    return {
+      paragraphs,
+      boundingBox: new BoundingBox(0, 0, totalWidth, totalHeight)
+    };
+  }
+  /** Advance step including CSS letter-spacing (px). */
+  _advance(character) {
+    return character.advanceWidth + (character.computedStyle.letterSpacing ?? 0);
+  }
+  /**
+   * Break a paragraph's characters into visual lines.
+   * v1: `word-break: break-all` (break before any character that would overflow)
+   * plus explicit `\n`/`\r` hard breaks. The newline itself occupies no line box.
+   */
+  _breakLines(paragraph, avail) {
+    const lines = [];
+    let current = [];
+    let width = 0;
+    const flush = () => {
+      lines.push(current);
+      current = [];
+      width = 0;
+    };
+    for (const fragment of paragraph.fragments) {
+      for (const c of fragment.characters) {
+        if (c.content === "\n" || c.content === "\r") {
+          flush();
+          continue;
+        }
+        if (avail !== Infinity && current.length > 0 && width + c.advanceWidth > avail) {
+          flush();
+        }
+        current.push(c);
+        width += this._advance(c);
+      }
+    }
+    flush();
+    return lines;
+  }
+  _unionInto(target, boxes) {
+    const used = boxes.filter((b) => b.width !== 0 || b.height !== 0);
+    if (!used.length) {
+      return;
+    }
+    const u = BoundingBox.from(...used);
+    target.left = u.left;
+    target.top = u.top;
+    target.width = u.width;
+    target.height = u.height;
+  }
+  _shiftAll(paragraphs, dy) {
+    for (const paragraph of paragraphs) {
+      paragraph.lineBox.top += dy;
+      for (const fragment of paragraph.fragments) {
+        fragment.inlineBox.top += dy;
+        for (const character of fragment.characters) {
+          character.inlineBox.top += dy;
+          character.lineBox.top += dy;
+        }
+      }
+    }
+  }
+  dispose() {
+  }
+}
+
 function backgroundPlugin() {
   const pathSet = new Path2DSet();
   const loader = createSvgLoader();
@@ -1823,7 +2082,7 @@ class Text extends Reactivable {
   glyphBox = new BoundingBox();
   pathBox = new BoundingBox();
   boundingBox = new BoundingBox();
-  measurer = new Measurer();
+  measurer = new DomMeasurer();
   plugins = /* @__PURE__ */ new Map();
   pathSets = [];
   _paragraphs = [];
@@ -1881,6 +2140,12 @@ class Text extends Reactivable {
       outline,
       deformation
     } = normalizeText(options);
+    if (options.measurer && typeof options.measurer !== "string") {
+      this.measurer = options.measurer;
+    } else {
+      const kind = options.measurer ?? (fonts ? "font" : "dom");
+      this.measurer = kind === "font" ? new FontMeasurer() : new DomMeasurer();
+    }
     this.debug = options.debug ?? false;
     this.content = content;
     this.effects = effects;
@@ -1955,6 +2220,9 @@ class Text extends Reactivable {
   }
   createDom() {
     this._update();
+    if (!this.measurer.createDom) {
+      throw new Error("current measurer does not support createDom()");
+    }
     return this.measurer.createDom(this.paragraphs, this.computedStyle);
   }
   measure(dom = this.measureDom) {
@@ -1968,7 +2236,7 @@ class Text extends Reactivable {
       boundingBox: this.boundingBox
     };
     this._update();
-    const result = this.measurer.measure(this.paragraphs, this.computedStyle, dom);
+    const result = this.measurer.measure(this.paragraphs, this.computedStyle, dom, this.fonts);
     this.paragraphs = result.paragraphs;
     this.lineBox = result.boundingBox;
     const characters = this.characters;
@@ -2100,7 +2368,7 @@ class Text extends Reactivable {
     options.onContext?.(ctx);
   }
   dispose() {
-    this.measurer.dispose();
+    this.measurer.dispose?.();
     this._renderer = void 0;
     this._rendererCtx = void 0;
   }
@@ -2136,4 +2404,4 @@ __decorateClass([
   property({ internal: true })
 ], Text.prototype, "fonts");
 
-export { Canvas2DRenderer as C, Fragment as F, Measurer as M, Paragraph as P, Text as T, Character as a, backgroundPlugin as b, createSvgLoader as c, createSvgParser as d, getHighlightStyle as e, isEqualValue as f, getEffectTransform2D as g, highlightPlugin as h, isEqualObject as i, parseTransformOrigin as j, parseValueNumber as k, listStylePlugin as l, textDefaultStyle as m, outlinePlugin as o, parseColormap as p, renderPlugin as r, textDecorationPlugin as t };
+export { Canvas2DRenderer as C, DomMeasurer as D, FontMeasurer as F, Paragraph as P, Text as T, Character as a, Fragment as b, backgroundPlugin as c, createSvgLoader as d, createSvgParser as e, getHighlightStyle as f, getEffectTransform2D as g, highlightPlugin as h, isEqualObject as i, isEqualValue as j, parseTransformOrigin as k, listStylePlugin as l, parseValueNumber as m, textDefaultStyle as n, outlinePlugin as o, parseColormap as p, renderPlugin as r, textDecorationPlugin as t };

package/dist/shared/{modern-text.C8g4NZgY.d.cts → modern-text.D4WopQCu.d.cts}

@@ -57,6 +57,16 @@ declare class Character {
     constructor(content: string, index: number, parent: Fragment);
     protected _getFontSFNT(fonts?: Fonts): SFNT | undefined;
     updateGlyph(sfnt?: SFNT | undefined): this;
+    /**
+     * Populate glyph metrics only (advance width/height, ascender/descender,
+     * baseline, …) without building the glyph `path` or touching boxes.
+     *
+     * The DOM {@link DomMeasurer} never needs this — it reads positions back from the
+     * browser. A pure-JS measurer (e.g. `FontMeasurer`) must know advances *before*
+     * it can place characters, so it calls this ahead of layout. `update()` later
+     * recomputes the same metrics while building the path, so this is idempotent.
+     */
+    measureGlyph(fonts?: Fonts): this;
     update(fonts?: Fonts): this;
     protected _italic(path: Path2D, startPoint?: Vector2Like): void;
     getGlyphMinMax(min?: Vector2, max?: Vector2, withStyle?: boolean): {
@@ -66,24 +76,6 @@ declare class Character {
     getGlyphBoundingBox(withStyle?: boolean): BoundingBox | undefined;
 }
 
-interface Plugin {
-    name: string;
-    pathSet?: Path2DSet;
-    getBoundingBox?: (text: Text$1) => BoundingBox | undefined;
-    update?: (text: Text$1) => void;
-    updateOrder?: number;
-    render?: (renderer: Canvas2DRenderer) => void;
-    renderOrder?: number;
-    load?: (text: Text$1) => Promise<void>;
-    context?: Record<string, any>;
-}
-interface Options extends TextObject {
-    debug?: boolean;
-    measureDom?: HTMLElement;
-    fonts?: Fonts;
-    plugins?: Plugin[];
-}
-
 interface MeasuredParagraph {
     paragraphIndex: number;
     left: number;
@@ -127,7 +119,7 @@ interface RootDomStyles {
     section: Record<string, any>;
     ul: Record<string, any>;
 }
-declare class Measurer {
+declare class DomMeasurer {
     static notZeroStyles: Set<string>;
     static pxStyles: Set<string>;
     protected _styleCache: WeakMap<object, Record<string, any>>;
@@ -166,6 +158,47 @@ declare class Measurer {
     dispose(): void;
 }
 
+interface Plugin {
+    name: string;
+    pathSet?: Path2DSet;
+    getBoundingBox?: (text: Text$1) => BoundingBox | undefined;
+    update?: (text: Text$1) => void;
+    updateOrder?: number;
+    render?: (renderer: Canvas2DRenderer) => void;
+    renderOrder?: number;
+    load?: (text: Text$1) => Promise<void>;
+    context?: Record<string, any>;
+}
+/**
+ * Pluggable layout backend. Implementations fill the four-level boxes
+ * (`character.inlineBox`/`lineBox`, `fragment.inlineBox`, `paragraph.lineBox`)
+ * in place and return the overall bounding box.
+ *
+ * - `DomMeasurer` — DOM-based, uses the browser as ground truth (default).
+ * - `FontMeasurer` — pure-JS, DOM-free; needs `fonts` to resolve glyph advances.
+ *
+ * `fonts` is passed positionally by `Text.measure()`; DOM-based measurers ignore
+ * it (a method may safely declare fewer parameters than the interface).
+ */
+interface TextMeasurer {
+    measure: (paragraphs: Paragraph[], rootStyle: FullStyle, dom?: HTMLElement, fonts?: Fonts) => MeasureDomResult;
+    createDom?: (paragraphs: Paragraph[], rootStyle: FullStyle) => HTMLElement;
+    dispose?: () => void;
+}
+/** Built-in layout backends. `'font'` → `FontMeasurer`, `'dom'` → `DomMeasurer`. */
+type MeasurerKind = 'dom' | 'font';
+interface Options extends TextObject {
+    debug?: boolean;
+    measureDom?: HTMLElement;
+    fonts?: Fonts;
+    plugins?: Plugin[];
+    /**
+     * Layout backend: `'font'` (pure-JS) or `'dom'` (browser), or a custom
+     * `TextMeasurer`. Defaults to `'font'` when `fonts` are provided, else `'dom'`.
+     */
+    measurer?: MeasurerKind | TextMeasurer;
+}
+
 interface RenderOptions {
     view: HTMLCanvasElement;
     pixelRatio?: number;
@@ -221,7 +254,7 @@ declare class Text$1 extends Reactivable {
     glyphBox: BoundingBox;
     pathBox: BoundingBox;
     boundingBox: BoundingBox;
-    measurer: Measurer;
+    measurer: TextMeasurer;
     plugins: Map<string, Plugin>;
     pathSets: Path2DSet[];
     protected _paragraphs: Paragraph[];
@@ -304,5 +337,5 @@ declare class Canvas2DRenderer {
     drawCharacter: (character: Character, effect?: NormalizedEffect) => void;
 }
 
-export { Canvas2DRenderer as C, Fragment as F, Paragraph as P, Text$1 as T, Character as a, Measurer as g, textDefaultStyle as t };
-export type { DrawShapePathsOptions as D, MeasureDomResult as M, Options as O, RenderOptions as R, MeasureResult as b, MeasuredCharacter as c, MeasuredCharacterRect as d, MeasuredFragment as e, MeasuredParagraph as f, Plugin as h, TextEvents as i };
+export { Canvas2DRenderer as C, DomMeasurer as D, Fragment as F, Paragraph as P, Text$1 as T, Character as a, textDefaultStyle as t };
+export type { MeasureDomResult as M, Options as O, RenderOptions as R, DrawShapePathsOptions as b, MeasureResult as c, MeasuredCharacter as d, MeasuredCharacterRect as e, MeasuredFragment as f, MeasuredParagraph as g, MeasurerKind as h, Plugin as i, TextEvents as j, TextMeasurer as k };

package/dist/shared/{modern-text.C8g4NZgY.d.mts → modern-text.D4WopQCu.d.mts}

@@ -57,6 +57,16 @@ declare class Character {
     constructor(content: string, index: number, parent: Fragment);
     protected _getFontSFNT(fonts?: Fonts): SFNT | undefined;
     updateGlyph(sfnt?: SFNT | undefined): this;
+    /**
+     * Populate glyph metrics only (advance width/height, ascender/descender,
+     * baseline, …) without building the glyph `path` or touching boxes.
+     *
+     * The DOM {@link DomMeasurer} never needs this — it reads positions back from the
+     * browser. A pure-JS measurer (e.g. `FontMeasurer`) must know advances *before*
+     * it can place characters, so it calls this ahead of layout. `update()` later
+     * recomputes the same metrics while building the path, so this is idempotent.
+     */
+    measureGlyph(fonts?: Fonts): this;
     update(fonts?: Fonts): this;
     protected _italic(path: Path2D, startPoint?: Vector2Like): void;
     getGlyphMinMax(min?: Vector2, max?: Vector2, withStyle?: boolean): {
@@ -66,24 +76,6 @@ declare class Character {
     getGlyphBoundingBox(withStyle?: boolean): BoundingBox | undefined;
 }
 
-interface Plugin {
-    name: string;
-    pathSet?: Path2DSet;
-    getBoundingBox?: (text: Text$1) => BoundingBox | undefined;
-    update?: (text: Text$1) => void;
-    updateOrder?: number;
-    render?: (renderer: Canvas2DRenderer) => void;
-    renderOrder?: number;
-    load?: (text: Text$1) => Promise<void>;
-    context?: Record<string, any>;
-}
-interface Options extends TextObject {
-    debug?: boolean;
-    measureDom?: HTMLElement;
-    fonts?: Fonts;
-    plugins?: Plugin[];
-}
-
 interface MeasuredParagraph {
     paragraphIndex: number;
     left: number;
@@ -127,7 +119,7 @@ interface RootDomStyles {
     section: Record<string, any>;
     ul: Record<string, any>;
 }
-declare class Measurer {
+declare class DomMeasurer {
     static notZeroStyles: Set<string>;
     static pxStyles: Set<string>;
     protected _styleCache: WeakMap<object, Record<string, any>>;
@@ -166,6 +158,47 @@ declare class Measurer {
     dispose(): void;
 }
 
+interface Plugin {
+    name: string;
+    pathSet?: Path2DSet;
+    getBoundingBox?: (text: Text$1) => BoundingBox | undefined;
+    update?: (text: Text$1) => void;
+    updateOrder?: number;
+    render?: (renderer: Canvas2DRenderer) => void;
+    renderOrder?: number;
+    load?: (text: Text$1) => Promise<void>;
+    context?: Record<string, any>;
+}
+/**
+ * Pluggable layout backend. Implementations fill the four-level boxes
+ * (`character.inlineBox`/`lineBox`, `fragment.inlineBox`, `paragraph.lineBox`)
+ * in place and return the overall bounding box.
+ *
+ * - `DomMeasurer` — DOM-based, uses the browser as ground truth (default).
+ * - `FontMeasurer` — pure-JS, DOM-free; needs `fonts` to resolve glyph advances.
+ *
+ * `fonts` is passed positionally by `Text.measure()`; DOM-based measurers ignore
+ * it (a method may safely declare fewer parameters than the interface).
+ */
+interface TextMeasurer {
+    measure: (paragraphs: Paragraph[], rootStyle: FullStyle, dom?: HTMLElement, fonts?: Fonts) => MeasureDomResult;
+    createDom?: (paragraphs: Paragraph[], rootStyle: FullStyle) => HTMLElement;
+    dispose?: () => void;
+}
+/** Built-in layout backends. `'font'` → `FontMeasurer`, `'dom'` → `DomMeasurer`. */
+type MeasurerKind = 'dom' | 'font';
+interface Options extends TextObject {
+    debug?: boolean;
+    measureDom?: HTMLElement;
+    fonts?: Fonts;
+    plugins?: Plugin[];
+    /**
+     * Layout backend: `'font'` (pure-JS) or `'dom'` (browser), or a custom
+     * `TextMeasurer`. Defaults to `'font'` when `fonts` are provided, else `'dom'`.
+     */
+    measurer?: MeasurerKind | TextMeasurer;
+}
+
 interface RenderOptions {
     view: HTMLCanvasElement;
     pixelRatio?: number;
@@ -221,7 +254,7 @@ declare class Text$1 extends Reactivable {
     glyphBox: BoundingBox;
     pathBox: BoundingBox;
     boundingBox: BoundingBox;
-    measurer: Measurer;
+    measurer: TextMeasurer;
     plugins: Map<string, Plugin>;
     pathSets: Path2DSet[];
     protected _paragraphs: Paragraph[];
@@ -304,5 +337,5 @@ declare class Canvas2DRenderer {
     drawCharacter: (character: Character, effect?: NormalizedEffect) => void;
 }
 
-export { Canvas2DRenderer as C, Fragment as F, Paragraph as P, Text$1 as T, Character as a, Measurer as g, textDefaultStyle as t };
-export type { DrawShapePathsOptions as D, MeasureDomResult as M, Options as O, RenderOptions as R, MeasureResult as b, MeasuredCharacter as c, MeasuredCharacterRect as d, MeasuredFragment as e, MeasuredParagraph as f, Plugin as h, TextEvents as i };
+export { Canvas2DRenderer as C, DomMeasurer as D, Fragment as F, Paragraph as P, Text$1 as T, Character as a, textDefaultStyle as t };
+export type { MeasureDomResult as M, Options as O, RenderOptions as R, DrawShapePathsOptions as b, MeasureResult as c, MeasuredCharacter as d, MeasuredCharacterRect as e, MeasuredFragment as f, MeasuredParagraph as g, MeasurerKind as h, Plugin as i, TextEvents as j, TextMeasurer as k };