modern-text 0.5.13 → 0.6.1

package/dist/index.cjs

@@ -456,6 +456,9 @@ function filterEmpty(val) {
   }
   return res;
 }
+function needsFetch(source) {
+  return source.startsWith("http://") || source.startsWith("https://") || source.startsWith("blob://");
+}
 
 var __defProp$3 = Object.defineProperty;
 var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -526,9 +529,6 @@ function definePlugin(options) {
 }
 
 class Measurer {
-  constructor(_text) {
-    this._text = _text;
-  }
   _styleToDomStyle(style) {
     const _style = { ...style };
     for (const key in style) {
@@ -560,8 +560,7 @@ class Measurer {
    *   </ul>
    * </section>
    */
-  createDom() {
-    const { paragraphs, computedStyle } = this._text;
+  createParagraphDom(paragraphs, rootStyle) {
     const documentFragment = document.createDocumentFragment();
     const dom = document.createElement("section");
     Object.assign(dom.style, {
@@ -569,7 +568,7 @@ class Measurer {
       height: "max-content",
       whiteSpace: "pre-wrap",
       wordBreak: "break-all",
-      ...this._styleToDomStyle(computedStyle),
+      ...this._styleToDomStyle(rootStyle),
       position: "fixed",
       visibility: "hidden"
     });
@@ -598,12 +597,41 @@ class Measurer {
       destory: () => dom.parentNode?.removeChild(dom)
     };
   }
-  _measureDom(dom) {
+  measureDomText(text) {
+    const range = document.createRange();
+    range.selectNodeContents(text);
+    const data = text.data ?? "";
+    let offset = 0;
+    return Array.from(data).map((char) => {
+      const start = offset += data.substring(offset).indexOf(char);
+      const end = start + char.length;
+      offset += char.length;
+      range.setStart(text, Math.max(start, 0));
+      range.setEnd(text, end);
+      const rects = range.getClientRects?.() ?? [range.getBoundingClientRect()];
+      let rect = rects[rects.length - 1];
+      if (rects.length > 1 && rect.width < 2) {
+        rect = rects[rects.length - 2];
+      }
+      const content = range.toString();
+      if (content !== "" && rect && rect.width + rect.height !== 0) {
+        return {
+          content,
+          top: rect.top,
+          left: rect.left,
+          height: rect.height,
+          width: rect.width
+        };
+      }
+      return void 0;
+    }).filter(Boolean);
+  }
+  measureDom(dom) {
     const paragraphs = [];
     const fragments = [];
     const characters = [];
-    dom.querySelectorAll("li").forEach((li, paragraphIndex) => {
-      const pBox = li.getBoundingClientRect();
+    dom.querySelectorAll("li").forEach((pDom, paragraphIndex) => {
+      const pBox = pDom.getBoundingClientRect();
       paragraphs.push({
         paragraphIndex,
         left: pBox.left,
@@ -611,8 +639,8 @@ class Measurer {
         width: pBox.width,
         height: pBox.height
       });
-      li.querySelectorAll("span").forEach((span, fragmentIndex) => {
-        const fBox = span.getBoundingClientRect();
+      pDom.querySelectorAll(":scope > *").forEach((fDom, fragmentIndex) => {
+        const fBox = fDom.getBoundingClientRect();
         fragments.push({
           paragraphIndex,
           fragmentIndex,
@@ -621,37 +649,32 @@ class Measurer {
           width: fBox.width,
           height: fBox.height
         });
-        const text = span.firstChild;
-        if (text instanceof window.Text) {
-          const range = document.createRange();
-          range.selectNodeContents(text);
-          const data = text.data ?? "";
-          let offset = 0;
-          Array.from(data).forEach((char, index) => {
-            const start = offset += data.substring(offset).indexOf(char);
-            const end = start + char.length;
-            offset += char.length;
-            range.setStart(text, Math.max(start, 0));
-            range.setEnd(text, end);
-            const rects = range.getClientRects?.() ?? [range.getBoundingClientRect()];
-            let rect = rects[rects.length - 1];
-            if (rects.length > 1 && rect.width < 2) {
-              rect = rects[rects.length - 2];
-            }
-            const content = range.toString();
-            if (content !== "" && rect && rect.width + rect.height !== 0) {
-              characters.push({
-                content,
-                newParagraphIndex: -1,
-                paragraphIndex,
-                fragmentIndex,
-                characterIndex: index,
-                top: rect.top,
-                left: rect.left,
-                height: rect.height,
-                width: rect.width,
-                textWidth: -1,
-                textHeight: -1
+        let characterIndex = 0;
+        if (fDom.firstChild instanceof window.Text) {
+          this.measureDomText(fDom.firstChild).forEach((char) => {
+            characters.push({
+              ...char,
+              newParagraphIndex: -1,
+              paragraphIndex,
+              fragmentIndex,
+              characterIndex: characterIndex++,
+              textWidth: -1,
+              textHeight: -1
+            });
+          });
+        } else {
+          fDom.querySelectorAll(":scope > *").forEach((cDom) => {
+            if (cDom.firstChild instanceof window.Text) {
+              this.measureDomText(cDom.firstChild).forEach((char) => {
+                characters.push({
+                  ...char,
+                  newParagraphIndex: -1,
+                  paragraphIndex,
+                  fragmentIndex,
+                  characterIndex: characterIndex++,
+                  textWidth: -1,
+                  textHeight: -1
+                });
               });
             }
           });
@@ -664,10 +687,9 @@ class Measurer {
       characters
     };
   }
-  measureDom(dom) {
-    const { paragraphs } = this._text;
+  measureParagraphDom(paragraphs, dom) {
     const rect = dom.getBoundingClientRect();
-    const measured = this._measureDom(dom);
+    const measured = this.measureDom(dom);
     measured.paragraphs.forEach((p) => {
       const _p = paragraphs[p.paragraphIndex];
       _p.lineBox.left = p.left - rect.left;
@@ -717,12 +739,12 @@ class Measurer {
       boundingBox: new modernPath2d.BoundingBox(0, 0, rect.width, rect.height)
     };
   }
-  measure(dom) {
+  measure(paragraphs, rootStyle, dom) {
     let destory;
     if (!dom) {
-      ({ dom, destory } = this.createDom());
+      ({ dom, destory } = this.createParagraphDom(paragraphs, rootStyle));
     }
-    const result = this.measureDom(dom);
+    const result = this.measureParagraphDom(paragraphs, dom);
     destory?.();
     return result;
   }
@@ -825,33 +847,74 @@ class EventEmitter {
 function highlight() {
   const paths = [];
   const clipRects = [];
-  const svgStringToSvgPaths = /* @__PURE__ */ new Map();
-  async function getPaths(svg) {
-    let result = svgStringToSvgPaths.get(svg);
-    if (!result) {
-      if (svg.startsWith("http")) {
-        svg = await fetch(svg).then((rep) => rep.text());
+  const loaded = /* @__PURE__ */ new Map();
+  const parsed = /* @__PURE__ */ new Map();
+  async function loadSvg(svg) {
+    if (!loaded.has(svg)) {
+      loaded.set(svg, svg);
+      try {
+        loaded.set(svg, await fetch(svg).then((rep) => rep.text()));
+      } catch (err) {
+        console.warn(err);
+        loaded.delete(svg);
       }
-      const dom = modernPath2d.parseSvgToDom(svg);
+    }
+  }
+  function getPaths(svg) {
+    let result = parsed.get(svg);
+    if (!result) {
+      const dom = modernPath2d.parseSvgToDom(
+        needsFetch(svg) ? loaded.get(svg) ?? svg : svg
+      );
       const paths2 = modernPath2d.parseSvg(dom);
       result = { dom, paths: paths2 };
-      svgStringToSvgPaths.set(svg, result);
+      parsed.set(svg, result);
     }
     return result;
   }
   return definePlugin({
     name: "highlight",
     paths,
-    update: async (text) => {
+    load: async (text) => {
+      const promises = [];
+      text.forEachCharacter((character) => {
+        const { computedStyle: style } = character;
+        const { highlightImage, highlightReferImage } = style;
+        if (needsFetch(highlightImage)) {
+          promises.push(loadSvg(highlightImage));
+        }
+        if (needsFetch(highlightReferImage)) {
+          promises.push(loadSvg(highlightReferImage));
+        }
+      });
+      await Promise.all(promises);
+    },
+    update: (text) => {
       clipRects.length = 0;
       paths.length = 0;
       let groups = [];
       let group;
       let prevStyle;
       text.forEachCharacter((character) => {
-        const { isVertical, computedStyle: style, inlineBox } = character;
-        if (!isNone(style.highlightImage) && character.glyphBox) {
-          if ((!prevStyle || isEqualValue(prevStyle.highlightImage, style.highlightImage) && isEqualValue(prevStyle.highlightColormap, style.highlightColormap) && isEqualValue(prevStyle.highlightLine, style.highlightLine) && isEqualValue(prevStyle.highlightSize, style.highlightSize) && isEqualValue(prevStyle.highlightThickness, style.highlightThickness)) && group?.length && (isVertical ? group[0].inlineBox.left === inlineBox.left : group[0].inlineBox.top === inlineBox.top) && group[0].fontSize === style.fontSize) {
+        const {
+          computedStyle: style
+        } = character;
+        const {
+          highlightImage
+        } = style;
+        if (!isNone(highlightImage)) {
+          const {
+            inlineBox,
+            isVertical
+          } = character;
+          const {
+            fontSize,
+            highlightColormap,
+            highlightLine,
+            highlightSize,
+            highlightThickness
+          } = style;
+          if ((!prevStyle || isEqualValue(prevStyle.highlightImage, highlightImage) && isEqualValue(prevStyle.highlightColormap, highlightColormap) && isEqualValue(prevStyle.highlightLine, highlightLine) && isEqualValue(prevStyle.highlightSize, highlightSize) && isEqualValue(prevStyle.highlightThickness, highlightThickness)) && group?.length && (isVertical ? group[0].inlineBox.left === inlineBox.left : group[0].inlineBox.top === inlineBox.top) && group[0].fontSize === fontSize) {
             group.push(character);
           } else {
             group = [];
@@ -870,8 +933,12 @@ function highlight() {
       for (let i = 0; i < groups.length; i++) {
         const characters = groups[i];
         const char = characters[0];
-        const groupBox = modernPath2d.BoundingBox.from(...characters.map((c) => c.glyphBox));
-        const { computedStyle: style } = char;
+        const groupBox = modernPath2d.BoundingBox.from(
+          ...characters.filter((c) => c.glyphBox).map((c) => c.glyphBox)
+        );
+        const {
+          computedStyle: style
+        } = char;
         const {
           fontSize,
           writingMode,
@@ -885,7 +952,7 @@ function highlight() {
         const isVertical = writingMode.includes("vertical");
         const thickness = parseValueNumber(highlightThickness, { fontSize, total: groupBox.width }) / groupBox.width;
         const colormap = parseColormap(highlightColormap);
-        const { paths: svgPaths, dom: svgDom } = await getPaths(highlightImage);
+        const { paths: svgPaths, dom: svgDom } = getPaths(highlightImage);
         const aBox = modernPath2d.getPathsBoundingBox(svgPaths, true);
         const styleScale = fontSize / aBox.width * 2;
         const cBox = new modernPath2d.BoundingBox().copy(groupBox);
@@ -901,7 +968,7 @@ function highlight() {
           cBox.width = userWidth;
         }
         if (!isNone(highlightReferImage) && isNone(highlightLine)) {
-          const bBox = modernPath2d.getPathsBoundingBox((await getPaths(highlightReferImage)).paths, true);
+          const bBox = modernPath2d.getPathsBoundingBox(getPaths(highlightReferImage).paths, true);
           aBox.copy(bBox);
         } else {
           let line;
@@ -1052,8 +1119,16 @@ function listStyle() {
       const { paragraphs, isVertical, fontSize } = text;
       const padding = fontSize * 0.45;
       paragraphs.forEach((paragraph) => {
-        const { computedStyle: style } = paragraph;
-        const { listStyleImage, listStyleColormap, listStyleSize, listStyleType, color } = style;
+        const {
+          computedStyle: style
+        } = paragraph;
+        const {
+          color,
+          listStyleImage,
+          listStyleColormap,
+          listStyleSize,
+          listStyleType
+        } = style;
         const colormap = parseColormap(listStyleColormap);
         let size = listStyleSize;
         let image;
@@ -1082,18 +1157,10 @@ function listStyle() {
           const m = new modernPath2d.Matrix3();
           if (isVertical) {
             const reScale = fontSize / imageBox.height * scale;
-            m.translate(-imageBox.left, -imageBox.top);
-            m.rotate(Math.PI / 2);
-            m.scale(reScale, reScale);
-            m.translate(fontSize / 2 - imageBox.height * reScale / 2, 0);
-            m.translate(box.left + (box.width - fontSize) / 2, fBox.top - padding);
+            m.translate(-imageBox.left, -imageBox.top).rotate(Math.PI / 2).scale(reScale, reScale).translate(fontSize / 2 - imageBox.height * reScale / 2, 0).translate(box.left + (box.width - fontSize) / 2, fBox.top - padding);
           } else {
             const reScale = fontSize / imageBox.height * scale;
-            m.translate(-imageBox.left, -imageBox.top);
-            m.translate(-imageBox.width, 0);
-            m.scale(reScale, reScale);
-            m.translate(0, fontSize / 2 - imageBox.height * reScale / 2);
-            m.translate(fBox.left - padding, box.top + (box.height - fontSize) / 2);
+            m.translate(-imageBox.left, -imageBox.top).translate(-imageBox.width, 0).scale(reScale, reScale).translate(0, fontSize / 2 - imageBox.height * reScale / 2).translate(fBox.left - padding, box.top + (box.height - fontSize) / 2);
           }
           paths.push(...imagePaths.map((p) => {
             const path = p.clone();
@@ -1229,11 +1296,24 @@ function textDecoration() {
       let group;
       let prevStyle;
       text.forEachCharacter((character) => {
-        const { computedStyle: style, isVertical, inlineBox, underlinePosition, underlineThickness, strikeoutPosition, strikeoutSize } = character;
-        if (!isNone(style.textDecoration)) {
+        const {
+          computedStyle: style,
+          isVertical,
+          inlineBox,
+          underlinePosition,
+          underlineThickness,
+          strikeoutPosition,
+          strikeoutSize
+        } = character;
+        const {
+          color,
+          textDecoration: textDecoration2,
+          writingMode
+        } = style;
+        if (!isNone(textDecoration2)) {
           let flag = false;
-          if (prevStyle?.textDecoration === style.textDecoration && prevStyle?.writingMode === style.writingMode && prevStyle?.color === style.color && (isVertical ? group[0].inlineBox.left === inlineBox.left : group[0].inlineBox.top === inlineBox.top)) {
-            switch (style.textDecoration) {
+          if (prevStyle?.textDecoration === textDecoration2 && prevStyle?.writingMode === writingMode && prevStyle?.color === color && (isVertical ? group[0].inlineBox.left === inlineBox.left : group[0].inlineBox.top === inlineBox.top)) {
+            switch (textDecoration2) {
               case "underline":
                 if (group[0].underlinePosition === underlinePosition && group[0].underlineThickness === underlineThickness) {
                   flag = true;
@@ -1259,8 +1339,18 @@ function textDecoration() {
         }
       });
       groups.forEach((group2) => {
-        const { computedStyle: style, isVertical, underlinePosition, underlineThickness, strikeoutPosition, strikeoutSize } = group2[0];
-        const { textDecoration: textDecoration2, color } = style;
+        const {
+          computedStyle: style,
+          isVertical,
+          underlinePosition,
+          underlineThickness,
+          strikeoutPosition,
+          strikeoutSize
+        } = group2[0];
+        const {
+          color,
+          textDecoration: textDecoration2
+        } = style;
         const { left, top, width, height } = modernPath2d.BoundingBox.from(...group2.map((c) => c.inlineBox));
         let position = isVertical ? left + width : top;
         const direction = isVertical ? -1 : 1;
@@ -1403,7 +1493,7 @@ class Text extends EventEmitter {
     __publicField(this, "glyphBox", new modernPath2d.BoundingBox());
     __publicField(this, "pathBox", new modernPath2d.BoundingBox());
     __publicField(this, "boundingBox", new modernPath2d.BoundingBox());
-    __publicField(this, "measurer", new Measurer(this));
+    __publicField(this, "measurer", new Measurer());
     __publicField(this, "plugins", /* @__PURE__ */ new Map());
     __publicField(this, "fonts");
     this.debug = options.debug ?? false;
@@ -1437,6 +1527,9 @@ class Text extends EventEmitter {
     });
     return this;
   }
+  async load() {
+    await Promise.all(Array.from(this.plugins.values()).map((p) => p.load?.(this)));
+  }
   updateParagraphs() {
     this.computedStyle = { ...defaultTextStyles, ...this.style };
     let { content, computedStyle: style } = this;
@@ -1488,7 +1581,7 @@ class Text extends EventEmitter {
     this.paragraphs = paragraphs;
     return this;
   }
-  async measure(dom = this.measureDom) {
+  measure(dom = this.measureDom) {
     const old = {
       paragraphs: this.paragraphs,
       lineBox: this.lineBox,
@@ -1498,18 +1591,16 @@ class Text extends EventEmitter {
       boundingBox: this.boundingBox
     };
     this.updateParagraphs();
-    const result = this.measurer.measure(dom);
+    const result = this.measurer.measure(this.paragraphs, this.computedStyle, dom);
     this.paragraphs = result.paragraphs;
     this.lineBox = result.boundingBox;
     this.characters.forEach((c) => {
       c.update(this.fonts);
     });
     this.rawGlyphBox = this.getGlyphBox();
-    const plugins = Array.from(this.plugins.values());
-    plugins.sort((a, b) => (a.updateOrder ?? 0) - (b.updateOrder ?? 0));
-    for (let i = 0; i < plugins.length; i++) {
-      await plugins[i].update?.(this);
-    }
+    Array.from(this.plugins.values()).sort((a, b) => (a.updateOrder ?? 0) - (b.updateOrder ?? 0)).forEach((plugin) => {
+      plugin.update?.(this);
+    });
     this.glyphBox = this.getGlyphBox();
     this.updatePathBox().updateBoundingBox();
     for (const key in old) {
@@ -1565,30 +1656,28 @@ class Text extends EventEmitter {
     this.needsUpdate = true;
     return this;
   }
-  async update() {
-    const result = await this.measure();
+  update() {
+    const result = this.measure();
     for (const key in result) {
       this[key] = result[key];
     }
     this.emit("update", { text: this });
+    return this;
   }
-  async render(options) {
+  render(options) {
     const { view, pixelRatio = 2 } = options;
     const ctx = view.getContext("2d");
     if (!ctx) {
       return;
     }
     if (this.needsUpdate) {
-      await this.update();
+      this.update();
     }
     setupView(ctx, pixelRatio, this.boundingBox);
     uploadColors(ctx, this);
-    const plugins = Array.from(this.plugins.values());
-    plugins.sort((a, b) => (a.renderOrder ?? 0) - (b.renderOrder ?? 0));
-    for (let i = 0; i < plugins.length; i++) {
-      const plugin = plugins[i];
+    Array.from(this.plugins.values()).sort((a, b) => (a.renderOrder ?? 0) - (b.renderOrder ?? 0)).forEach((plugin) => {
       if (plugin.render) {
-        await plugin.render?.(ctx, this);
+        plugin.render?.(ctx, this);
       } else if (plugin.paths) {
         const style = this.computedStyle;
         plugin.paths.forEach((path) => {
@@ -1599,17 +1688,21 @@ class Text extends EventEmitter {
           });
         });
       }
-    }
+    });
     this.emit("render", { text: this, view, pixelRatio });
   }
 }
 
-function measureText(options) {
-  return new Text(options).measure();
+async function measureText(options) {
+  const text = new Text(options);
+  await text.load();
+  return text.measure();
 }
 
-function renderText(options) {
-  return new Text(options).render(options);
+async function renderText(options) {
+  const text = new Text(options);
+  await text.load();
+  text.render(options);
 }
 
 exports.Character = Character;
@@ -1629,6 +1722,7 @@ exports.isEqualValue = isEqualValue;
 exports.isNone = isNone;
 exports.listStyle = listStyle;
 exports.measureText = measureText;
+exports.needsFetch = needsFetch;
 exports.parseColor = parseColor;
 exports.parseColormap = parseColormap;
 exports.parseValueNumber = parseValueNumber;

package/dist/index.d.cts

@@ -121,8 +121,6 @@ interface MeasureDomResult {
     boundingBox: BoundingBox;
 }
 declare class Measurer {
-    protected _text: Text;
-    constructor(_text: Text);
     protected _styleToDomStyle(style: Partial<TextStyle>): Record<string, any>;
     /**
      * <section style="...">
@@ -134,17 +132,24 @@ declare class Measurer {
      *   </ul>
      * </section>
      */
-    createDom(): {
+    createParagraphDom(paragraphs: Paragraph[], rootStyle: TextStyle): {
         dom: HTMLElement;
         destory: () => void;
     };
-    protected _measureDom(dom: HTMLElement): {
+    measureDomText(text: Text): {
+        content: string;
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+    }[];
+    measureDom(dom: HTMLElement): {
         paragraphs: MeasuredParagraph[];
         fragments: MeasuredFragment[];
         characters: MeasuredCharacter[];
     };
-    measureDom(dom: HTMLElement): MeasureDomResult;
-    measure(dom?: HTMLElement): MeasureDomResult;
+    measureParagraphDom(paragraphs: Paragraph[], dom: HTMLElement): MeasureDomResult;
+    measure(paragraphs: Paragraph[], rootStyle: TextStyle, dom?: HTMLElement): MeasureDomResult;
 }
 
 interface TextRenderOptions {
@@ -162,19 +167,19 @@ interface MeasureResult {
 declare const defaultTextStyles: TextStyle;
 interface TextEventMap {
     update: {
-        text: Text;
+        text: Text$1;
     };
     measure: {
-        text: Text;
+        text: Text$1;
         result: MeasureResult;
     };
     render: {
-        text: Text;
+        text: Text$1;
         view: HTMLCanvasElement;
         pixelRatio: number;
     };
 }
-declare class Text extends EventEmitter<TextEventMap> {
+declare class Text$1 extends EventEmitter<TextEventMap> {
     debug: boolean;
     content: TextContent;
     style: Partial<TextStyle>;
@@ -201,14 +206,15 @@ declare class Text extends EventEmitter<TextEventMap> {
         fragmentIndex: number;
         characterIndex: number;
     }) => void): this;
+    load(): Promise<void>;
     updateParagraphs(): this;
-    measure(dom?: HTMLElement | undefined): Promise<MeasureResult>;
+    measure(dom?: HTMLElement | undefined): MeasureResult;
     getGlyphBox(): BoundingBox;
     updatePathBox(): this;
     updateBoundingBox(): this;
     requestUpdate(): this;
-    update(): Promise<void>;
-    render(options: TextRenderOptions): Promise<void>;
+    update(): this;
+    render(options: TextRenderOptions): void;
 }
 
 type Sizeable = `${number}%` | `${number}rem` | number;
@@ -286,15 +292,15 @@ interface ParagraphContent extends Partial<TextStyle> {
     fragments: FragmentContent[];
 }
 type TextContent = string | FragmentContent | ParagraphContent | (string | FragmentContent | ParagraphContent | (string | FragmentContent)[])[];
-type PromiseLike<T> = T | Promise<T>;
 interface TextPlugin {
     name: string;
     paths?: Path2D[];
-    getBoundingBox?: (text: Text) => BoundingBox | undefined;
+    getBoundingBox?: (text: Text$1) => BoundingBox | undefined;
+    update?: (text: Text$1) => void;
     updateOrder?: number;
-    update?: (text: Text) => PromiseLike<void>;
+    render?: (ctx: CanvasRenderingContext2D, text: Text$1) => void;
     renderOrder?: number;
-    render?: (ctx: CanvasRenderingContext2D, text: Text) => PromiseLike<void>;
+    load?: (text: Text$1) => Promise<void>;
 }
 interface TextOptions {
     debug?: boolean;
@@ -328,23 +334,23 @@ declare function drawPath(options: DrawShapePathsOptions): void;
 
 declare function setupView(ctx: CanvasRenderingContext2D, pixelRatio: number, boundingBox: BoundingBox): void;
 
-declare function uploadColors(ctx: CanvasRenderingContext2D, text: Text): void;
+declare function uploadColors(ctx: CanvasRenderingContext2D, text: Text$1): void;
 
 declare function definePlugin(options: TextPlugin): TextPlugin;
 
 declare function measureText(options: TextOptions): Promise<MeasureResult>;
 
+declare function renderText(options: TextOptions & TextRenderOptions): Promise<void>;
+
 declare function highlight(): TextPlugin;
 
 declare function listStyle(): TextPlugin;
 
 declare function render(): TextPlugin;
-declare function getTransform2D(text: Text, style: Partial<TextStyle>): Matrix3;
+declare function getTransform2D(text: Text$1, style: Partial<TextStyle>): Matrix3;
 
 declare function textDecoration(): TextPlugin;
 
-declare function renderText(options: TextOptions & TextRenderOptions): Promise<void>;
-
 interface ValueContext {
     total: number;
     fontSize: number;
@@ -356,5 +362,6 @@ declare function isEqualObject(obj1: Record<string, any>, obj2: Record<string, a
 declare function isEqualValue(val1: any, val2: any): boolean;
 declare function hexToRgb(hex: string): string | null;
 declare function filterEmpty(val: Record<string, any> | undefined): Record<string, any> | undefined;
+declare function needsFetch(source: string): boolean;
 
-export { Character, type DrawShapePathsOptions, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type HighlightColormap, type HighlightImage, type HighlightLine, type HighlightReferImage, type HighlightSize, type HighlightThickness, type LinearGradient, type ListStyleColormap, type ListStyleImage, type ListStylePosition, type ListStyleSize, type ListStyleType, type MeasureDomResult, type MeasureResult, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, Measurer, Paragraph, type ParagraphContent, type Sizeable, Text, type TextAlign, type TextContent, type TextDecorationLine, type TextDrawStyle, type TextEventMap, type TextInlineStyle, type TextLineStyle, type TextOptions, type TextOrientation, type TextPlugin, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultTextStyles, definePlugin, drawPath, filterEmpty, getTransform2D, hexToRgb, highlight, isEqualObject, isEqualValue, isNone, listStyle, measureText, parseColor, parseColormap, parseValueNumber, render, renderText, setupView, textDecoration, uploadColor, uploadColors };
+export { Character, type DrawShapePathsOptions, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type HighlightColormap, type HighlightImage, type HighlightLine, type HighlightReferImage, type HighlightSize, type HighlightThickness, type LinearGradient, type ListStyleColormap, type ListStyleImage, type ListStylePosition, type ListStyleSize, type ListStyleType, type MeasureDomResult, type MeasureResult, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, Measurer, Paragraph, type ParagraphContent, type Sizeable, Text$1 as Text, type TextAlign, type TextContent, type TextDecorationLine, type TextDrawStyle, type TextEventMap, type TextInlineStyle, type TextLineStyle, type TextOptions, type TextOrientation, type TextPlugin, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultTextStyles, definePlugin, drawPath, filterEmpty, getTransform2D, hexToRgb, highlight, isEqualObject, isEqualValue, isNone, listStyle, measureText, needsFetch, parseColor, parseColormap, parseValueNumber, render, renderText, setupView, textDecoration, uploadColor, uploadColors };