modern-text 0.2.19 → 0.2.21

package/dist/index.cjs

@@ -68,7 +68,7 @@ function drawPath(options) {
     shadowColor: options.shadowColor
   };
   if (clipRect) {
-    ctx.rect(clipRect.x, clipRect.y, clipRect.width, clipRect.height);
+    ctx.rect(clipRect.left, clipRect.top, clipRect.width, clipRect.height);
     ctx.clip();
     ctx.beginPath();
   }
@@ -188,8 +188,8 @@ class Character {
       return this;
     }
     const { unitsPerEm, ascender, descender, os2, post } = font;
-    const { content, computedStyle, boundingBox, isVertical } = this;
-    const { left, top, height } = boundingBox;
+    const { content, computedStyle, boundingBox } = this;
+    const { height } = boundingBox;
     const { fontSize } = computedStyle;
     const rate = unitsPerEm / fontSize;
     const glyphWidth = font.getAdvanceWidth(content, fontSize);
@@ -207,8 +207,6 @@ class Character {
     this.yStrikeoutSize = yStrikeoutSize;
     this.baseline = baseline;
     this.centerDiviation = 0.5 * height - baseline;
-    this.glyphBox = isVertical ? new modernPath2d.BoundingBox(left, top, glyphHeight, glyphWidth) : new modernPath2d.BoundingBox(left, top, glyphWidth, glyphHeight);
-    this.centerPoint = this.glyphBox.getCenterPoint();
     return this;
   }
   updatePath() {
@@ -290,6 +288,8 @@ class Character {
       strokeWidth: computedStyle.textStrokeWidth ? computedStyle.textStrokeWidth * fontSize * 0.03 : 0
     };
     this.path = path;
+    this.glyphBox = this.getGlyphBoundingBox();
+    this.center = this.glyphBox.getCenterPoint();
     return this;
   }
   update() {
@@ -378,11 +378,11 @@ class Character {
       return cmd;
     });
   }
-  getMinMax(min, max) {
+  getGlyphMinMax(min, max) {
     return this.path.getMinMax(min, max);
   }
-  getBoundingBox() {
-    return this.path.getBoundingBox();
+  getGlyphBoundingBox(withStyle) {
+    return this.path.getBoundingBox(withStyle);
   }
   drawTo(ctx, config = {}) {
     drawPath({
@@ -502,7 +502,7 @@ class Effector extends Feature {
     const boxes = [];
     characters.forEach((character) => {
       effects?.forEach((style) => {
-        const aabb = character.boundingBox.clone();
+        const aabb = character.glyphBox.clone();
         const m = this.getTransform2D(style);
         tempV1.set(aabb.left, aabb.top);
         tempV1.applyMatrix3(m);
@@ -549,12 +549,31 @@ var __publicField$1 = (obj, key, value) => {
   __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-class Highlighter extends Feature {
+const defaultHighlightRefer = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIgdmlld0JveD0iMCAwIDcyIDcyIiBmaWxsPSJub25lIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMyLjQwMjkgMjhIMzUuMTU5NFYzMy4xNzcxQzM1Ljk4MjEgMzIuMzExNSAzNi45NzEgMzEuODczNyAzOC4wOTQ4IDMxLjg3MzdDMzkuNjY3NiAzMS44NzM3IDQwLjkxNjYgMzIuNDI5NSA0MS44MzkgMzMuNTQzN0w0MS44NDAzIDMzLjU0NTNDNDIuNjcxNyAzNC41NzA1IDQzLjA5MTUgMzUuODU1OSA0My4wOTE1IDM3LjM4NzdDNDMuMDkxNSAzOC45NzYxIDQyLjY3MjkgNDAuMzAyOCA0MS44MTgzIDQxLjMzMDRMNDEuODE3MSA0MS4zMzE4QzQwLjg3MzEgNDIuNDQ2MSAzOS41ODMyIDQzIDM3Ljk3MjEgNDNDMzYuNzQ3NyA0MyAzNS43NDg4IDQyLjY1OTkgMzQuOTk1OCA0MS45NjkzVjQyLjcyNDdIMzIuNDAyOVYyOFpNMzcuNTQyOCAzNC4wOTI0QzM2Ljg1NDkgMzQuMDkyNCAzNi4zMDE0IDM0LjM1NjEgMzUuODQ4NyAzNC45MDA0TDM1Ljg0NTIgMzQuOTA0NkMzNS4zMzU4IDM1LjQ4NTMgMzUuMDc3NiAzNi4yOTc2IDM1LjA3NzYgMzcuMzQ4NFYzNy41MDU3QzM1LjA3NzYgMzguNDY0IDM1LjI3NzIgMzkuMjQ0MyAzNS42OTQzIDM5LjgyNzlDMzYuMTQ0MSA0MC40NTg3IDM2Ljc3MjYgNDAuNzgxMyAzNy42MjQ1IDQwLjc4MTNDMzguNTg3NCA0MC43ODEzIDM5LjI3MDcgNDAuNDUyNyAzOS43MTUyIDM5LjgxMjdDNDAuMDcyOCAzOS4yNjg0IDQwLjI3MzcgMzguNDY3MyA0MC4yNzM3IDM3LjM4NzdDNDAuMjczNyAzNi4zMTA1IDQwLjA1MzMgMzUuNTMxMyAzOS42NzgzIDM1LjAwNzdDMzkuMjM3MSAzNC40MDcxIDM4LjUzNDIgMzQuMDkyNCAzNy41NDI4IDM0LjA5MjRaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZD0iTTQ5Ljg2MTQgMzEuODczN0M0OC4xNTM1IDMxLjg3MzcgNDYuODAxNiAzMi40MjM5IDQ1LjgzNDggMzMuNTM5MkM0NC45MzcgMzQuNTQ3MiA0NC40OTY2IDM1Ljg1NiA0NC40OTY2IDM3LjQyN0M0NC40OTY2IDM5LjAzNjggNDQuOTM2NyA0MC4zNjU5IDQ1Ljg1NTkgNDEuMzk0M0M0Ni44MDMxIDQyLjQ3MDYgNDguMTM0OCA0MyA0OS44MjA1IDQzQzUxLjIyNiA0MyA1Mi4zODI2IDQyLjY1NjMgNTMuMjQ3OSA0MS45Njk3QzU0LjEzNTkgNDEuMjYxNCA1NC43MDYxIDQwLjE4ODcgNTQuOTU3MyAzOC43NzkxTDU1IDM4LjUzOTdINTIuMjQ4NEw1Mi4yMjU5IDM4LjcyMDFDNTIuMTM3OSAzOS40MjUxIDUxLjg5MjUgMzkuOTI3OCA1MS41MTA5IDQwLjI1NThDNTEuMTI5NSA0MC41ODM1IDUwLjU4MzEgNDAuNzYxNiA0OS44NDA5IDQwLjc2MTZDNDkuMDAwMSA0MC43NjE2IDQ4LjM5NDkgNDAuNDcxNSA0Ny45OTA3IDM5LjkyMzdMNDcuOTg3NCAzOS45MTk0QzQ3LjUzNTYgMzkuMzQwMSA0Ny4zMTQ0IDM4LjUwNjIgNDcuMzE0NCAzNy40MDc0QzQ3LjMxNDQgMzYuMzMyMiA0Ny41NTQ0IDM1LjUxNzcgNDguMDA1OCAzNC45NTY4TDQ4LjAwNzggMzQuOTU0M0M0OC40NTM3IDM0LjM4MjUgNDkuMDYxOCAzNC4xMTIxIDQ5Ljg2MTQgMzQuMTEyMUM1MC41MjMgMzQuMTEyMSA1MS4wNDUxIDM0LjI2MTUgNTEuNDI3MiAzNC41NDA3QzUxLjc4ODQgMzQuODE5NCA1Mi4wNTMgMzUuMjQ0NyA1Mi4xODgxIDM1Ljg1NzFMNTIuMjIzOSAzNi4wMTk0SDU0Ljk1NDhMNTQuOTE3IDM1Ljc4MzVDNTQuNzA2MyAzNC40NjYgNTQuMTUzNiAzMy40NzAxIDUzLjI2MzQgMzIuODAxOUw1My4yNjAyIDMyLjc5OTVDNTIuMzk1MSAzMi4xNzU1IDUxLjI2MjEgMzEuODczNyA0OS44NjE0IDMxLjg3MzdaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNS43NTYxIDI4LjI3NTNIMjIuNzQ0TDE3IDQyLjcyNDdIMjAuMDE0MUwyMS4zNDI5IDM5LjIwNDlIMjcuMTU3MkwyOC40ODYgNDIuNzI0N0gzMS41MDAxTDI1Ljc1NjEgMjguMjc1M1pNMjIuMjEyNSAzNi45MDc2TDI0LjI1OTYgMzEuNDUzOUwyNi4yODg1IDM2LjkwNzZIMjIuMjEyNVoiIGZpbGw9IiMyMjI1MjkiLz48L3N2Zz4=";
+const _Highlighter = class _Highlighter extends Feature {
   constructor() {
     super(...arguments);
     __publicField$1(this, "paths", []);
   }
+  static get refer() {
+    return this._refer;
+  }
+  static set refer(refer) {
+    this._refer = refer;
+    this.parsedRefer = modernPath2d.parseSvg(refer);
+  }
+  getReferBoundingBox() {
+    const max = modernPath2d.Vector2.MIN;
+    const min = modernPath2d.Vector2.MAX;
+    _Highlighter.parsedRefer.forEach((path) => {
+      path.getMinMax(min, max);
+    });
+    return new modernPath2d.BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
+  }
   getBoundingBox() {
+    if (!this.paths.length) {
+      return void 0;
+    }
     const min = modernPath2d.Vector2.MAX;
     const max = modernPath2d.Vector2.MIN;
     this.paths.forEach((v) => v.path.getMinMax(min, max));
@@ -568,7 +587,7 @@ class Highlighter extends Feature {
     characters.forEach((character) => {
       const highlight = character.parent.highlight;
       if (highlight?.url) {
-        if (prevHighlight?.url === highlight.url && (group.length && group[0].boundingBox.top === character.boundingBox.top && group[0].fontSize === character.fontSize)) {
+        if (prevHighlight?.url === highlight.url && prevHighlight?.strokeWidth === highlight.strokeWidth && prevHighlight?.repeatXByFontsize === highlight.repeatXByFontsize && prevHighlight?.overflowXHidden === highlight.overflowXHidden && group.length && group[0].boundingBox.top === character.boundingBox.top && group[0].fontSize === character.fontSize) {
           group.push(character);
         } else {
           group = [];
@@ -580,8 +599,8 @@ class Highlighter extends Feature {
     });
     this.paths = groups.filter((characters2) => characters2.length).map((characters2) => {
       return {
-        url: characters2[0].parent.highlight.url,
-        box: modernPath2d.BoundingBox.from(...characters2.map((c) => c.boundingBox)),
+        highlight: characters2[0].parent.highlight,
+        box: modernPath2d.BoundingBox.from(...characters2.map((c) => c.glyphBox)),
         baseline: Math.max(...characters2.map((c) => c.baseline)),
         fontSize: characters2[0].fontSize
       };
@@ -595,60 +614,57 @@ class Highlighter extends Feature {
     paths.forEach((path) => path.getMinMax(min, max));
     return {
       paths,
-      box: new modernPath2d.BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y),
-      viewBox: new modernPath2d.BoundingBox(...svg.getAttribute("viewBox").split(" ").map(Number))
+      box: new modernPath2d.BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y)
     };
   }
   _parseGroup(group) {
-    const { url, box: groupBox, baseline, fontSize } = group;
-    const { box, viewBox, paths } = this._parseSvg(url);
-    const centerY = viewBox.top + viewBox.height / 2;
+    const { highlight, box: groupBox, fontSize } = group;
+    const {
+      strokeWidth = 1,
+      repeatXByFontsize = 0,
+      overflowXHidden = Boolean(repeatXByFontsize)
+    } = highlight;
+    const { box, paths } = this._parseSvg(highlight.url);
     const result = [];
-    const type = centerY > box.top ? 0 : 1;
-    function transformPathStyle(path, scale) {
-      if (path.style.strokeWidth) {
-        path.style.strokeWidth *= scale;
-      }
-      if (path.style.strokeMiterlimit) {
-        path.style.strokeMiterlimit *= scale;
-      }
-      if (path.style.strokeDashoffset) {
-        path.style.strokeDashoffset *= scale;
-      }
-      if (path.style.strokeDasharray) {
-        path.style.strokeDasharray = path.style.strokeDasharray.map((v) => v * scale);
-      }
-    }
-    if (type === 0) {
-      const offset = {
-        x: groupBox.left - fontSize * 0.2,
-        y: groupBox.top
-      };
-      const scaleX = (groupBox.width + fontSize * 0.2 * 2) / box.width;
-      const scaleY = groupBox.height / box.height;
-      const m = new modernPath2d.Matrix3().translate(-box.x, -box.y).scale(scaleX, scaleY).translate(offset.x, offset.y);
+    const referBoundingBox = this.getReferBoundingBox();
+    const scale = {
+      x: repeatXByFontsize ? fontSize * repeatXByFontsize * (box.width / referBoundingBox.width) / box.width : groupBox.width * (box.width / referBoundingBox.width) / box.width,
+      y: groupBox.height * (box.height / referBoundingBox.height) / box.height
+    };
+    const styleScale = fontSize / box.width * 2;
+    const unitWidth = box.width * scale.x;
+    const total = Math.ceil(groupBox.width / unitWidth);
+    const offset = {
+      x: (box.left - referBoundingBox.left) * scale.x,
+      y: (box.top - referBoundingBox.top) * scale.y
+    };
+    const transform = new modernPath2d.Matrix3().translate(-box.left, -box.top).scale(scale.x, scale.y).translate(groupBox.left, groupBox.top).translate(offset.x, offset.y);
+    for (let i = 0; i < total; i++) {
+      const _transform = transform.clone().translate(i * unitWidth, 0);
       paths.forEach((original) => {
-        const path = original.clone().transform(m);
-        transformPathStyle(path, scaleX);
-        result.push({ path });
-      });
-    } else if (type === 1) {
-      const scale = fontSize / box.width;
-      const width = box.width * scale;
-      const length = Math.ceil(groupBox.width / width);
-      const offset = {
-        x: groupBox.left,
-        y: groupBox.top + baseline + fontSize * 0.1
-      };
-      const m = new modernPath2d.Matrix3().translate(-box.x, -box.y).scale(scale, scale).translate(offset.x, offset.y);
-      for (let i = 0; i < length; i++) {
-        const _m = m.clone().translate(i * width, 0);
-        paths.forEach((original) => {
-          const path = original.clone().transform(_m);
-          transformPathStyle(path, scale);
-          result.push({ clipRect: groupBox, path });
+        const path = original.clone().transform(_transform);
+        if (path.style.strokeWidth) {
+          path.style.strokeWidth *= styleScale * strokeWidth;
+        }
+        if (path.style.strokeMiterlimit) {
+          path.style.strokeMiterlimit *= styleScale;
+        }
+        if (path.style.strokeDashoffset) {
+          path.style.strokeDashoffset *= styleScale;
+        }
+        if (path.style.strokeDasharray) {
+          path.style.strokeDasharray = path.style.strokeDasharray.map((v) => v * styleScale);
+        }
+        result.push({
+          clipRect: overflowXHidden ? new modernPath2d.BoundingBox(
+            groupBox.left + offset.x * 2,
+            groupBox.top - groupBox.height,
+            groupBox.width - offset.x * 2,
+            groupBox.height * 3
+          ) : void 0,
+          path
         });
-      }
+      });
     }
     return result;
   }
@@ -663,7 +679,10 @@ class Highlighter extends Feature {
     });
     return this;
   }
-}
+};
+__publicField$1(_Highlighter, "_refer", defaultHighlightRefer);
+__publicField$1(_Highlighter, "parsedRefer", modernPath2d.parseSvg(_Highlighter._refer));
+let Highlighter = _Highlighter;
 
 class Measurer extends Feature {
   _styleToDomStyle(style) {
@@ -1074,13 +1093,13 @@ class Text {
     this.boundingBox = boundingBox;
     const characters = this.characters;
     characters.forEach((c) => c.update());
-    this.highlighter.highlight();
     if (this.deformation) {
       this.deformer.deform();
     }
+    this.highlighter.highlight();
     const min = modernPath2d.Vector2.MAX;
     const max = modernPath2d.Vector2.MIN;
-    characters.forEach((c) => c.getMinMax(min, max));
+    characters.forEach((c) => c.getGlyphMinMax(min, max));
     this.renderBoundingBox = new modernPath2d.BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
     return this;
   }
@@ -1094,16 +1113,16 @@ class Text {
       this.update();
     }
     if (this.effects?.length) {
-      this.renderBoundingBox = modernPath2d.BoundingBox.from(
+      this.renderBoundingBox = modernPath2d.BoundingBox.from(...[
         this.renderBoundingBox,
         this.effector.getBoundingBox(),
         this.highlighter.getBoundingBox()
-      );
+      ].filter(Boolean));
     } else {
-      this.renderBoundingBox = modernPath2d.BoundingBox.from(
+      this.renderBoundingBox = modernPath2d.BoundingBox.from(...[
         this.renderBoundingBox,
         this.highlighter.getBoundingBox()
-      );
+      ].filter(Boolean));
     }
     this.renderer2D.setupView({ pixelRatio, ctx });
     this.renderer2D.uploadColors({ ctx });
@@ -1128,6 +1147,7 @@ exports.Parser = Parser;
 exports.Reflector = Reflector;
 exports.Renderer2D = Renderer2D;
 exports.Text = Text;
+exports.defaultHighlightRefer = defaultHighlightRefer;
 exports.defaultTextStyles = defaultTextStyles;
 exports.drawPath = drawPath;
 exports.filterEmpty = filterEmpty;

package/dist/index.d.cts

@@ -57,6 +57,9 @@ type TextEffect = Partial<TextDrawStyle & {
 type TextDeformation = () => void;
 interface FragmentHighlight {
     url: string;
+    strokeWidth?: number;
+    repeatXByFontsize?: number;
+    overflowXHidden?: boolean;
 }
 
 declare function parseColor(ctx: CanvasRenderingContext2D, source: string | CanvasGradient | CanvasPattern, box: BoundingBox): string | CanvasGradient | CanvasPattern;
@@ -111,7 +114,7 @@ declare class Character {
     baseline: number;
     centerDiviation: number;
     glyphBox: BoundingBox;
-    centerPoint: VectorLike;
+    center: VectorLike;
     get computedStyle(): TextStyle;
     get isVertical(): boolean;
     get fontSize(): number;
@@ -124,11 +127,11 @@ declare class Character {
     protected _italic(commands: GlyphPathCommand[], startPoint?: VectorLike): GlyphPathCommand[];
     protected _rotation90(commands: GlyphPathCommand[], point: VectorLike): GlyphPathCommand[];
     protected _transform(commands: GlyphPathCommand[], cb: (x: number, y: number) => number[]): GlyphPathCommand[];
-    getMinMax(min?: Vector2, max?: Vector2): {
+    getGlyphMinMax(min?: Vector2, max?: Vector2): {
         min: Vector2;
         max: Vector2;
     };
-    getBoundingBox(): BoundingBox;
+    getGlyphBoundingBox(withStyle?: boolean): BoundingBox;
     drawTo(ctx: CanvasRenderingContext2D, config?: Partial<TextEffect>): void;
 }
 
@@ -223,22 +226,27 @@ declare class Effector extends Feature {
 }
 
 interface HighlightGroup {
-    url: string;
+    highlight: FragmentHighlight;
     box: BoundingBox;
     baseline: number;
     fontSize: number;
 }
+declare const defaultHighlightRefer = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIgdmlld0JveD0iMCAwIDcyIDcyIiBmaWxsPSJub25lIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMyLjQwMjkgMjhIMzUuMTU5NFYzMy4xNzcxQzM1Ljk4MjEgMzIuMzExNSAzNi45NzEgMzEuODczNyAzOC4wOTQ4IDMxLjg3MzdDMzkuNjY3NiAzMS44NzM3IDQwLjkxNjYgMzIuNDI5NSA0MS44MzkgMzMuNTQzN0w0MS44NDAzIDMzLjU0NTNDNDIuNjcxNyAzNC41NzA1IDQzLjA5MTUgMzUuODU1OSA0My4wOTE1IDM3LjM4NzdDNDMuMDkxNSAzOC45NzYxIDQyLjY3MjkgNDAuMzAyOCA0MS44MTgzIDQxLjMzMDRMNDEuODE3MSA0MS4zMzE4QzQwLjg3MzEgNDIuNDQ2MSAzOS41ODMyIDQzIDM3Ljk3MjEgNDNDMzYuNzQ3NyA0MyAzNS43NDg4IDQyLjY1OTkgMzQuOTk1OCA0MS45NjkzVjQyLjcyNDdIMzIuNDAyOVYyOFpNMzcuNTQyOCAzNC4wOTI0QzM2Ljg1NDkgMzQuMDkyNCAzNi4zMDE0IDM0LjM1NjEgMzUuODQ4NyAzNC45MDA0TDM1Ljg0NTIgMzQuOTA0NkMzNS4zMzU4IDM1LjQ4NTMgMzUuMDc3NiAzNi4yOTc2IDM1LjA3NzYgMzcuMzQ4NFYzNy41MDU3QzM1LjA3NzYgMzguNDY0IDM1LjI3NzIgMzkuMjQ0MyAzNS42OTQzIDM5LjgyNzlDMzYuMTQ0MSA0MC40NTg3IDM2Ljc3MjYgNDAuNzgxMyAzNy42MjQ1IDQwLjc4MTNDMzguNTg3NCA0MC43ODEzIDM5LjI3MDcgNDAuNDUyNyAzOS43MTUyIDM5LjgxMjdDNDAuMDcyOCAzOS4yNjg0IDQwLjI3MzcgMzguNDY3MyA0MC4yNzM3IDM3LjM4NzdDNDAuMjczNyAzNi4zMTA1IDQwLjA1MzMgMzUuNTMxMyAzOS42NzgzIDM1LjAwNzdDMzkuMjM3MSAzNC40MDcxIDM4LjUzNDIgMzQuMDkyNCAzNy41NDI4IDM0LjA5MjRaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZD0iTTQ5Ljg2MTQgMzEuODczN0M0OC4xNTM1IDMxLjg3MzcgNDYuODAxNiAzMi40MjM5IDQ1LjgzNDggMzMuNTM5MkM0NC45MzcgMzQuNTQ3MiA0NC40OTY2IDM1Ljg1NiA0NC40OTY2IDM3LjQyN0M0NC40OTY2IDM5LjAzNjggNDQuOTM2NyA0MC4zNjU5IDQ1Ljg1NTkgNDEuMzk0M0M0Ni44MDMxIDQyLjQ3MDYgNDguMTM0OCA0MyA0OS44MjA1IDQzQzUxLjIyNiA0MyA1Mi4zODI2IDQyLjY1NjMgNTMuMjQ3OSA0MS45Njk3QzU0LjEzNTkgNDEuMjYxNCA1NC43MDYxIDQwLjE4ODcgNTQuOTU3MyAzOC43NzkxTDU1IDM4LjUzOTdINTIuMjQ4NEw1Mi4yMjU5IDM4LjcyMDFDNTIuMTM3OSAzOS40MjUxIDUxLjg5MjUgMzkuOTI3OCA1MS41MTA5IDQwLjI1NThDNTEuMTI5NSA0MC41ODM1IDUwLjU4MzEgNDAuNzYxNiA0OS44NDA5IDQwLjc2MTZDNDkuMDAwMSA0MC43NjE2IDQ4LjM5NDkgNDAuNDcxNSA0Ny45OTA3IDM5LjkyMzdMNDcuOTg3NCAzOS45MTk0QzQ3LjUzNTYgMzkuMzQwMSA0Ny4zMTQ0IDM4LjUwNjIgNDcuMzE0NCAzNy40MDc0QzQ3LjMxNDQgMzYuMzMyMiA0Ny41NTQ0IDM1LjUxNzcgNDguMDA1OCAzNC45NTY4TDQ4LjAwNzggMzQuOTU0M0M0OC40NTM3IDM0LjM4MjUgNDkuMDYxOCAzNC4xMTIxIDQ5Ljg2MTQgMzQuMTEyMUM1MC41MjMgMzQuMTEyMSA1MS4wNDUxIDM0LjI2MTUgNTEuNDI3MiAzNC41NDA3QzUxLjc4ODQgMzQuODE5NCA1Mi4wNTMgMzUuMjQ0NyA1Mi4xODgxIDM1Ljg1NzFMNTIuMjIzOSAzNi4wMTk0SDU0Ljk1NDhMNTQuOTE3IDM1Ljc4MzVDNTQuNzA2MyAzNC40NjYgNTQuMTUzNiAzMy40NzAxIDUzLjI2MzQgMzIuODAxOUw1My4yNjAyIDMyLjc5OTVDNTIuMzk1MSAzMi4xNzU1IDUxLjI2MjEgMzEuODczNyA0OS44NjE0IDMxLjg3MzdaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNS43NTYxIDI4LjI3NTNIMjIuNzQ0TDE3IDQyLjcyNDdIMjAuMDE0MUwyMS4zNDI5IDM5LjIwNDlIMjcuMTU3MkwyOC40ODYgNDIuNzI0N0gzMS41MDAxTDI1Ljc1NjEgMjguMjc1M1pNMjIuMjEyNSAzNi45MDc2TDI0LjI1OTYgMzEuNDUzOUwyNi4yODg1IDM2LjkwNzZIMjIuMjEyNVoiIGZpbGw9IiMyMjI1MjkiLz48L3N2Zz4=";
 declare class Highlighter extends Feature {
+    protected static _refer: string;
+    static parsedRefer: Path2D[];
+    static get refer(): string;
+    static set refer(refer: string);
     paths: {
         clipRect?: BoundingBox;
         path: Path2D;
     }[];
-    getBoundingBox(): BoundingBox;
+    getReferBoundingBox(): BoundingBox;
+    getBoundingBox(): BoundingBox | undefined;
     highlight(): void;
     protected _parseSvg(url: string): {
         paths: Path2D[];
         box: BoundingBox;
-        viewBox: BoundingBox;
     };
     protected _parseGroup(group: HighlightGroup): {
         clipRect?: BoundingBox;
@@ -348,4 +356,4 @@ declare function getPointPosition(point: {
     y: number;
 };
 
-export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };
+export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultHighlightRefer, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };

package/dist/index.d.mts

@@ -57,6 +57,9 @@ type TextEffect = Partial<TextDrawStyle & {
 type TextDeformation = () => void;
 interface FragmentHighlight {
     url: string;
+    strokeWidth?: number;
+    repeatXByFontsize?: number;
+    overflowXHidden?: boolean;
 }
 
 declare function parseColor(ctx: CanvasRenderingContext2D, source: string | CanvasGradient | CanvasPattern, box: BoundingBox): string | CanvasGradient | CanvasPattern;
@@ -111,7 +114,7 @@ declare class Character {
     baseline: number;
     centerDiviation: number;
     glyphBox: BoundingBox;
-    centerPoint: VectorLike;
+    center: VectorLike;
     get computedStyle(): TextStyle;
     get isVertical(): boolean;
     get fontSize(): number;
@@ -124,11 +127,11 @@ declare class Character {
     protected _italic(commands: GlyphPathCommand[], startPoint?: VectorLike): GlyphPathCommand[];
     protected _rotation90(commands: GlyphPathCommand[], point: VectorLike): GlyphPathCommand[];
     protected _transform(commands: GlyphPathCommand[], cb: (x: number, y: number) => number[]): GlyphPathCommand[];
-    getMinMax(min?: Vector2, max?: Vector2): {
+    getGlyphMinMax(min?: Vector2, max?: Vector2): {
         min: Vector2;
         max: Vector2;
     };
-    getBoundingBox(): BoundingBox;
+    getGlyphBoundingBox(withStyle?: boolean): BoundingBox;
     drawTo(ctx: CanvasRenderingContext2D, config?: Partial<TextEffect>): void;
 }
 
@@ -223,22 +226,27 @@ declare class Effector extends Feature {
 }
 
 interface HighlightGroup {
-    url: string;
+    highlight: FragmentHighlight;
     box: BoundingBox;
     baseline: number;
     fontSize: number;
 }
+declare const defaultHighlightRefer = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIgdmlld0JveD0iMCAwIDcyIDcyIiBmaWxsPSJub25lIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMyLjQwMjkgMjhIMzUuMTU5NFYzMy4xNzcxQzM1Ljk4MjEgMzIuMzExNSAzNi45NzEgMzEuODczNyAzOC4wOTQ4IDMxLjg3MzdDMzkuNjY3NiAzMS44NzM3IDQwLjkxNjYgMzIuNDI5NSA0MS44MzkgMzMuNTQzN0w0MS44NDAzIDMzLjU0NTNDNDIuNjcxNyAzNC41NzA1IDQzLjA5MTUgMzUuODU1OSA0My4wOTE1IDM3LjM4NzdDNDMuMDkxNSAzOC45NzYxIDQyLjY3MjkgNDAuMzAyOCA0MS44MTgzIDQxLjMzMDRMNDEuODE3MSA0MS4zMzE4QzQwLjg3MzEgNDIuNDQ2MSAzOS41ODMyIDQzIDM3Ljk3MjEgNDNDMzYuNzQ3NyA0MyAzNS43NDg4IDQyLjY1OTkgMzQuOTk1OCA0MS45NjkzVjQyLjcyNDdIMzIuNDAyOVYyOFpNMzcuNTQyOCAzNC4wOTI0QzM2Ljg1NDkgMzQuMDkyNCAzNi4zMDE0IDM0LjM1NjEgMzUuODQ4NyAzNC45MDA0TDM1Ljg0NTIgMzQuOTA0NkMzNS4zMzU4IDM1LjQ4NTMgMzUuMDc3NiAzNi4yOTc2IDM1LjA3NzYgMzcuMzQ4NFYzNy41MDU3QzM1LjA3NzYgMzguNDY0IDM1LjI3NzIgMzkuMjQ0MyAzNS42OTQzIDM5LjgyNzlDMzYuMTQ0MSA0MC40NTg3IDM2Ljc3MjYgNDAuNzgxMyAzNy42MjQ1IDQwLjc4MTNDMzguNTg3NCA0MC43ODEzIDM5LjI3MDcgNDAuNDUyNyAzOS43MTUyIDM5LjgxMjdDNDAuMDcyOCAzOS4yNjg0IDQwLjI3MzcgMzguNDY3MyA0MC4yNzM3IDM3LjM4NzdDNDAuMjczNyAzNi4zMTA1IDQwLjA1MzMgMzUuNTMxMyAzOS42NzgzIDM1LjAwNzdDMzkuMjM3MSAzNC40MDcxIDM4LjUzNDIgMzQuMDkyNCAzNy41NDI4IDM0LjA5MjRaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZD0iTTQ5Ljg2MTQgMzEuODczN0M0OC4xNTM1IDMxLjg3MzcgNDYuODAxNiAzMi40MjM5IDQ1LjgzNDggMzMuNTM5MkM0NC45MzcgMzQuNTQ3MiA0NC40OTY2IDM1Ljg1NiA0NC40OTY2IDM3LjQyN0M0NC40OTY2IDM5LjAzNjggNDQuOTM2NyA0MC4zNjU5IDQ1Ljg1NTkgNDEuMzk0M0M0Ni44MDMxIDQyLjQ3MDYgNDguMTM0OCA0MyA0OS44MjA1IDQzQzUxLjIyNiA0MyA1Mi4zODI2IDQyLjY1NjMgNTMuMjQ3OSA0MS45Njk3QzU0LjEzNTkgNDEuMjYxNCA1NC43MDYxIDQwLjE4ODcgNTQuOTU3MyAzOC43NzkxTDU1IDM4LjUzOTdINTIuMjQ4NEw1Mi4yMjU5IDM4LjcyMDFDNTIuMTM3OSAzOS40MjUxIDUxLjg5MjUgMzkuOTI3OCA1MS41MTA5IDQwLjI1NThDNTEuMTI5NSA0MC41ODM1IDUwLjU4MzEgNDAuNzYxNiA0OS44NDA5IDQwLjc2MTZDNDkuMDAwMSA0MC43NjE2IDQ4LjM5NDkgNDAuNDcxNSA0Ny45OTA3IDM5LjkyMzdMNDcuOTg3NCAzOS45MTk0QzQ3LjUzNTYgMzkuMzQwMSA0Ny4zMTQ0IDM4LjUwNjIgNDcuMzE0NCAzNy40MDc0QzQ3LjMxNDQgMzYuMzMyMiA0Ny41NTQ0IDM1LjUxNzcgNDguMDA1OCAzNC45NTY4TDQ4LjAwNzggMzQuOTU0M0M0OC40NTM3IDM0LjM4MjUgNDkuMDYxOCAzNC4xMTIxIDQ5Ljg2MTQgMzQuMTEyMUM1MC41MjMgMzQuMTEyMSA1MS4wNDUxIDM0LjI2MTUgNTEuNDI3MiAzNC41NDA3QzUxLjc4ODQgMzQuODE5NCA1Mi4wNTMgMzUuMjQ0NyA1Mi4xODgxIDM1Ljg1NzFMNTIuMjIzOSAzNi4wMTk0SDU0Ljk1NDhMNTQuOTE3IDM1Ljc4MzVDNTQuNzA2MyAzNC40NjYgNTQuMTUzNiAzMy40NzAxIDUzLjI2MzQgMzIuODAxOUw1My4yNjAyIDMyLjc5OTVDNTIuMzk1MSAzMi4xNzU1IDUxLjI2MjEgMzEuODczNyA0OS44NjE0IDMxLjg3MzdaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNS43NTYxIDI4LjI3NTNIMjIuNzQ0TDE3IDQyLjcyNDdIMjAuMDE0MUwyMS4zNDI5IDM5LjIwNDlIMjcuMTU3MkwyOC40ODYgNDIuNzI0N0gzMS41MDAxTDI1Ljc1NjEgMjguMjc1M1pNMjIuMjEyNSAzNi45MDc2TDI0LjI1OTYgMzEuNDUzOUwyNi4yODg1IDM2LjkwNzZIMjIuMjEyNVoiIGZpbGw9IiMyMjI1MjkiLz48L3N2Zz4=";
 declare class Highlighter extends Feature {
+    protected static _refer: string;
+    static parsedRefer: Path2D[];
+    static get refer(): string;
+    static set refer(refer: string);
     paths: {
         clipRect?: BoundingBox;
         path: Path2D;
     }[];
-    getBoundingBox(): BoundingBox;
+    getReferBoundingBox(): BoundingBox;
+    getBoundingBox(): BoundingBox | undefined;
     highlight(): void;
     protected _parseSvg(url: string): {
         paths: Path2D[];
         box: BoundingBox;
-        viewBox: BoundingBox;
     };
     protected _parseGroup(group: HighlightGroup): {
         clipRect?: BoundingBox;
@@ -348,4 +356,4 @@ declare function getPointPosition(point: {
     y: number;
 };
 
-export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };
+export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultHighlightRefer, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };

package/dist/index.d.ts

@@ -57,6 +57,9 @@ type TextEffect = Partial<TextDrawStyle & {
 type TextDeformation = () => void;
 interface FragmentHighlight {
     url: string;
+    strokeWidth?: number;
+    repeatXByFontsize?: number;
+    overflowXHidden?: boolean;
 }
 
 declare function parseColor(ctx: CanvasRenderingContext2D, source: string | CanvasGradient | CanvasPattern, box: BoundingBox): string | CanvasGradient | CanvasPattern;
@@ -111,7 +114,7 @@ declare class Character {
     baseline: number;
     centerDiviation: number;
     glyphBox: BoundingBox;
-    centerPoint: VectorLike;
+    center: VectorLike;
     get computedStyle(): TextStyle;
     get isVertical(): boolean;
     get fontSize(): number;
@@ -124,11 +127,11 @@ declare class Character {
     protected _italic(commands: GlyphPathCommand[], startPoint?: VectorLike): GlyphPathCommand[];
     protected _rotation90(commands: GlyphPathCommand[], point: VectorLike): GlyphPathCommand[];
     protected _transform(commands: GlyphPathCommand[], cb: (x: number, y: number) => number[]): GlyphPathCommand[];
-    getMinMax(min?: Vector2, max?: Vector2): {
+    getGlyphMinMax(min?: Vector2, max?: Vector2): {
         min: Vector2;
         max: Vector2;
     };
-    getBoundingBox(): BoundingBox;
+    getGlyphBoundingBox(withStyle?: boolean): BoundingBox;
     drawTo(ctx: CanvasRenderingContext2D, config?: Partial<TextEffect>): void;
 }
 
@@ -223,22 +226,27 @@ declare class Effector extends Feature {
 }
 
 interface HighlightGroup {
-    url: string;
+    highlight: FragmentHighlight;
     box: BoundingBox;
     baseline: number;
     fontSize: number;
 }
+declare const defaultHighlightRefer = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIgdmlld0JveD0iMCAwIDcyIDcyIiBmaWxsPSJub25lIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMyLjQwMjkgMjhIMzUuMTU5NFYzMy4xNzcxQzM1Ljk4MjEgMzIuMzExNSAzNi45NzEgMzEuODczNyAzOC4wOTQ4IDMxLjg3MzdDMzkuNjY3NiAzMS44NzM3IDQwLjkxNjYgMzIuNDI5NSA0MS44MzkgMzMuNTQzN0w0MS44NDAzIDMzLjU0NTNDNDIuNjcxNyAzNC41NzA1IDQzLjA5MTUgMzUuODU1OSA0My4wOTE1IDM3LjM4NzdDNDMuMDkxNSAzOC45NzYxIDQyLjY3MjkgNDAuMzAyOCA0MS44MTgzIDQxLjMzMDRMNDEuODE3MSA0MS4zMzE4QzQwLjg3MzEgNDIuNDQ2MSAzOS41ODMyIDQzIDM3Ljk3MjEgNDNDMzYuNzQ3NyA0MyAzNS43NDg4IDQyLjY1OTkgMzQuOTk1OCA0MS45NjkzVjQyLjcyNDdIMzIuNDAyOVYyOFpNMzcuNTQyOCAzNC4wOTI0QzM2Ljg1NDkgMzQuMDkyNCAzNi4zMDE0IDM0LjM1NjEgMzUuODQ4NyAzNC45MDA0TDM1Ljg0NTIgMzQuOTA0NkMzNS4zMzU4IDM1LjQ4NTMgMzUuMDc3NiAzNi4yOTc2IDM1LjA3NzYgMzcuMzQ4NFYzNy41MDU3QzM1LjA3NzYgMzguNDY0IDM1LjI3NzIgMzkuMjQ0MyAzNS42OTQzIDM5LjgyNzlDMzYuMTQ0MSA0MC40NTg3IDM2Ljc3MjYgNDAuNzgxMyAzNy42MjQ1IDQwLjc4MTNDMzguNTg3NCA0MC43ODEzIDM5LjI3MDcgNDAuNDUyNyAzOS43MTUyIDM5LjgxMjdDNDAuMDcyOCAzOS4yNjg0IDQwLjI3MzcgMzguNDY3MyA0MC4yNzM3IDM3LjM4NzdDNDAuMjczNyAzNi4zMTA1IDQwLjA1MzMgMzUuNTMxMyAzOS42NzgzIDM1LjAwNzdDMzkuMjM3MSAzNC40MDcxIDM4LjUzNDIgMzQuMDkyNCAzNy41NDI4IDM0LjA5MjRaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZD0iTTQ5Ljg2MTQgMzEuODczN0M0OC4xNTM1IDMxLjg3MzcgNDYuODAxNiAzMi40MjM5IDQ1LjgzNDggMzMuNTM5MkM0NC45MzcgMzQuNTQ3MiA0NC40OTY2IDM1Ljg1NiA0NC40OTY2IDM3LjQyN0M0NC40OTY2IDM5LjAzNjggNDQuOTM2NyA0MC4zNjU5IDQ1Ljg1NTkgNDEuMzk0M0M0Ni44MDMxIDQyLjQ3MDYgNDguMTM0OCA0MyA0OS44MjA1IDQzQzUxLjIyNiA0MyA1Mi4zODI2IDQyLjY1NjMgNTMuMjQ3OSA0MS45Njk3QzU0LjEzNTkgNDEuMjYxNCA1NC43MDYxIDQwLjE4ODcgNTQuOTU3MyAzOC43NzkxTDU1IDM4LjUzOTdINTIuMjQ4NEw1Mi4yMjU5IDM4LjcyMDFDNTIuMTM3OSAzOS40MjUxIDUxLjg5MjUgMzkuOTI3OCA1MS41MTA5IDQwLjI1NThDNTEuMTI5NSA0MC41ODM1IDUwLjU4MzEgNDAuNzYxNiA0OS44NDA5IDQwLjc2MTZDNDkuMDAwMSA0MC43NjE2IDQ4LjM5NDkgNDAuNDcxNSA0Ny45OTA3IDM5LjkyMzdMNDcuOTg3NCAzOS45MTk0QzQ3LjUzNTYgMzkuMzQwMSA0Ny4zMTQ0IDM4LjUwNjIgNDcuMzE0NCAzNy40MDc0QzQ3LjMxNDQgMzYuMzMyMiA0Ny41NTQ0IDM1LjUxNzcgNDguMDA1OCAzNC45NTY4TDQ4LjAwNzggMzQuOTU0M0M0OC40NTM3IDM0LjM4MjUgNDkuMDYxOCAzNC4xMTIxIDQ5Ljg2MTQgMzQuMTEyMUM1MC41MjMgMzQuMTEyMSA1MS4wNDUxIDM0LjI2MTUgNTEuNDI3MiAzNC41NDA3QzUxLjc4ODQgMzQuODE5NCA1Mi4wNTMgMzUuMjQ0NyA1Mi4xODgxIDM1Ljg1NzFMNTIuMjIzOSAzNi4wMTk0SDU0Ljk1NDhMNTQuOTE3IDM1Ljc4MzVDNTQuNzA2MyAzNC40NjYgNTQuMTUzNiAzMy40NzAxIDUzLjI2MzQgMzIuODAxOUw1My4yNjAyIDMyLjc5OTVDNTIuMzk1MSAzMi4xNzU1IDUxLjI2MjEgMzEuODczNyA0OS44NjE0IDMxLjg3MzdaIiBmaWxsPSIjMjIyNTI5Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNS43NTYxIDI4LjI3NTNIMjIuNzQ0TDE3IDQyLjcyNDdIMjAuMDE0MUwyMS4zNDI5IDM5LjIwNDlIMjcuMTU3MkwyOC40ODYgNDIuNzI0N0gzMS41MDAxTDI1Ljc1NjEgMjguMjc1M1pNMjIuMjEyNSAzNi45MDc2TDI0LjI1OTYgMzEuNDUzOUwyNi4yODg1IDM2LjkwNzZIMjIuMjEyNVoiIGZpbGw9IiMyMjI1MjkiLz48L3N2Zz4=";
 declare class Highlighter extends Feature {
+    protected static _refer: string;
+    static parsedRefer: Path2D[];
+    static get refer(): string;
+    static set refer(refer: string);
     paths: {
         clipRect?: BoundingBox;
         path: Path2D;
     }[];
-    getBoundingBox(): BoundingBox;
+    getReferBoundingBox(): BoundingBox;
+    getBoundingBox(): BoundingBox | undefined;
     highlight(): void;
     protected _parseSvg(url: string): {
         paths: Path2D[];
         box: BoundingBox;
-        viewBox: BoundingBox;
     };
     protected _parseGroup(group: HighlightGroup): {
         clipRect?: BoundingBox;
@@ -348,4 +356,4 @@ declare function getPointPosition(point: {
     y: number;
 };
 
-export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };
+export { Character, Deformer, type DrawShapePathsOptions, type EffectOptions, Effector, type FontKerning, type FontStyle, type FontWeight, Fragment, type FragmentContent, type FragmentHighlight, Highlighter, type LinearGradient, type MeasuredCharacter, type MeasuredFragment, type MeasuredParagraph, type MeasuredResult, Measurer, Paragraph, type ParagraphContent, Parser, Reflector, type Render2dOptions, Renderer2D, Text, type TextAlign, type TextContent, type TextDecoration, type TextDeformation, type TextDrawStyle, type TextEffect, type TextLayoutStyle, type TextOptions, type TextOrientation, type TextRenderOptions, type TextStyle, type TextTransform, type TextWrap, type VerticalAlign, type WritingMode, defaultHighlightRefer, defaultTextStyles, drawPath, filterEmpty, getPointPosition, getRotationPoint, getScalePoint, getSkewPoint, parseColor, uploadColor };