@graphrefly/graphrefly 0.47.2 → 0.48.0

package/dist/{chunk-3PSLNJDU.js → chunk-6DQYBIHW.js}

@@ -1,6 +1,230 @@
 import {
   emitToMeta
 } from "./chunk-KN3H5CNT.js";
+import {
+  countCells
+} from "./chunk-36NMM65U.js";
+
+// src/utils/reactive-layout/measurement-adapters.ts
+var IntlSegmentAdapter = class {
+  wordSeg = null;
+  graphemeSeg = null;
+  constructor() {
+    if (typeof Intl === "undefined" || typeof Intl.Segmenter !== "function") {
+      throw new TypeError(
+        "IntlSegmentAdapter: Intl.Segmenter is not available in this runtime (Hermes / older embedded JS engines). Pass a custom SegmentAdapter via `reactiveLayout({ segmentAdapter })` \u2014 see the SegmentAdapter JSDoc for the polyfill recipe (e.g. `intl-segmenter-polyfill` or `@formatjs/intl-segmenter`)."
+      );
+    }
+  }
+  segmentWords(text) {
+    if (this.wordSeg === null) {
+      this.wordSeg = new Intl.Segmenter(void 0, { granularity: "word" });
+    }
+    return this.wordSeg.segment(text);
+  }
+  segmentGraphemes(text) {
+    if (this.graphemeSeg === null) {
+      this.graphemeSeg = new Intl.Segmenter(void 0, { granularity: "grapheme" });
+    }
+    return this.graphemeSeg.segment(text);
+  }
+};
+var _defaultSegmentAdapter = null;
+function getDefaultSegmentAdapter() {
+  if (_defaultSegmentAdapter === null) {
+    _defaultSegmentAdapter = new IntlSegmentAdapter();
+  }
+  return _defaultSegmentAdapter;
+}
+function _resetDefaultSegmentAdapterForTests() {
+  _defaultSegmentAdapter = null;
+}
+var CliMeasureAdapter = class {
+  cellPx;
+  constructor(opts) {
+    this.cellPx = opts?.cellPx ?? 8;
+  }
+  measureSegment(text, _font) {
+    return { width: countCells(text) * this.cellPx };
+  }
+};
+var InjectedMeasureAdapter = class {
+  fn;
+  cache;
+  constructor(fn, opts) {
+    if (typeof fn !== "function") {
+      throw new TypeError(
+        "InjectedMeasureAdapter: a synchronous (text, font) => widthPx function is required"
+      );
+    }
+    this.fn = fn;
+    this.cache = opts?.cache ? /* @__PURE__ */ new Map() : null;
+  }
+  measureSegment(text, font) {
+    if (this.cache) {
+      const key = `${font}\0${text}`;
+      const hit = this.cache.get(key);
+      if (hit !== void 0) return { width: hit };
+      const w = this.fn(text, font);
+      this.cache.set(key, w);
+      return { width: w };
+    }
+    return { width: this.fn(text, font) };
+  }
+  clearCache() {
+    this.cache?.clear();
+  }
+};
+var PrecomputedAdapterKeyError = class extends Error {
+  name = "KeyError";
+};
+var PrecomputedAdapter = class {
+  metrics;
+  fallback;
+  constructor(opts) {
+    this.metrics = opts.metrics;
+    const fb = opts.fallback ?? "per-char";
+    if (fb !== "per-char" && fb !== "error") {
+      throw new Error(
+        `fallback must be 'per-char' or 'error', got ${JSON.stringify(opts.fallback)}`
+      );
+    }
+    this.fallback = fb;
+  }
+  measureSegment(text, font) {
+    const fontMap = this.metrics[font];
+    if (fontMap) {
+      const w = fontMap[text];
+      if (w !== void 0) return { width: w };
+    }
+    if (this.fallback === "error") {
+      throw new PrecomputedAdapterKeyError(
+        `PrecomputedAdapter: no metrics for segment ${JSON.stringify(text)} in font ${JSON.stringify(font)}`
+      );
+    }
+    let total = 0;
+    if (fontMap) {
+      for (const ch of text) {
+        const cw = fontMap[ch];
+        if (cw !== void 0) {
+          total += cw;
+        }
+      }
+    }
+    return { width: total };
+  }
+};
+var CanvasMeasureAdapter = class {
+  ctx = null;
+  currentFont = "";
+  emojiCorrection;
+  constructor(opts) {
+    this.emojiCorrection = opts?.emojiCorrection ?? 1;
+  }
+  getContext() {
+    if (!this.ctx) {
+      if (typeof OffscreenCanvas === "undefined") {
+        throw new Error(
+          "CanvasMeasureAdapter requires a browser environment with OffscreenCanvas support. Use CliMeasureAdapter or NodeCanvasMeasureAdapter for Node.js."
+        );
+      }
+      const canvas = new OffscreenCanvas(0, 0);
+      const ctx = canvas.getContext("2d");
+      if (!ctx) throw new Error("CanvasMeasureAdapter: failed to get 2d context");
+      this.ctx = ctx;
+    }
+    return this.ctx;
+  }
+  measureSegment(text, font) {
+    const ctx = this.getContext();
+    if (font !== this.currentFont) {
+      ctx.font = font;
+      this.currentFont = font;
+    }
+    let width = ctx.measureText(text).width;
+    if (this.emojiCorrection !== 1 && /\p{Emoji_Presentation}/u.test(text)) {
+      width *= this.emojiCorrection;
+    }
+    return { width };
+  }
+  clearCache() {
+    this.currentFont = "";
+  }
+};
+var NodeCanvasMeasureAdapter = class {
+  ctx = null;
+  currentFont = "";
+  canvasModule;
+  constructor(canvasModule) {
+    this.canvasModule = canvasModule;
+  }
+  getContext() {
+    if (!this.ctx) {
+      const canvas = this.canvasModule.createCanvas(0, 0);
+      const ctx = canvas.getContext("2d");
+      if (!ctx) throw new Error("NodeCanvasMeasureAdapter: failed to get 2d context");
+      this.ctx = ctx;
+    }
+    return this.ctx;
+  }
+  measureSegment(text, font) {
+    const ctx = this.getContext();
+    if (font !== this.currentFont) {
+      ctx.font = font;
+      this.currentFont = font;
+    }
+    return { width: ctx.measureText(text).width };
+  }
+  clearCache() {
+    this.currentFont = "";
+  }
+};
+var SvgBoundsAdapter = class {
+  measureSvg(content) {
+    const viewBoxMatch = content.match(/viewBox\s*=\s*["']([^"']+)["']/);
+    if (viewBoxMatch) {
+      const parts = viewBoxMatch[1].trim().split(/[\s,]+/);
+      if (parts.length >= 4) {
+        const w = Number.parseFloat(parts[2]);
+        const h = Number.parseFloat(parts[3]);
+        if (Number.isFinite(w) && Number.isFinite(h) && w > 0 && h > 0) {
+          return { width: w, height: h };
+        }
+        throw new Error(
+          "SvgBoundsAdapter: viewBox width/height are missing, non-finite, or not positive"
+        );
+      }
+    }
+    const widthMatch = content.match(/<svg[^>]*\bwidth\s*=\s*["']?([\d.]+)/);
+    const heightMatch = content.match(/<svg[^>]*\bheight\s*=\s*["']?([\d.]+)/);
+    if (widthMatch && heightMatch) {
+      const w = Number.parseFloat(widthMatch[1]);
+      const h = Number.parseFloat(heightMatch[1]);
+      if (Number.isFinite(w) && Number.isFinite(h) && w > 0 && h > 0) {
+        return { width: w, height: h };
+      }
+      throw new Error(
+        "SvgBoundsAdapter: svg width/height attributes are non-finite or not positive"
+      );
+    }
+    throw new Error(
+      "SvgBoundsAdapter: cannot determine dimensions \u2014 SVG has no viewBox or width/height attributes"
+    );
+  }
+};
+var ImageSizeAdapter = class {
+  sizes;
+  constructor(sizes) {
+    this.sizes = new Map(Object.entries(sizes));
+  }
+  measureImage(src) {
+    const dims = this.sizes.get(src);
+    if (!dims) {
+      throw new Error(`ImageSizeAdapter: no dimensions registered for ${JSON.stringify(src)}`);
+    }
+    return { width: dims.width, height: dims.height };
+  }
+};
 
 // src/utils/reactive-layout/reactive-layout.ts
 import { monotonicNs, node } from "@graphrefly/pure-ts/core";
@@ -59,10 +283,9 @@ var leftStickyPunctuation = /* @__PURE__ */ new Set([
 function normalizeWhitespace(text) {
   return text.replace(/[\t\n\r\f ]+/g, " ").replace(/^ | $/g, "");
 }
-function segmentText(normalized) {
-  const wordSegmenter = new Intl.Segmenter(void 0, { granularity: "word" });
+function segmentText(normalized, segmentAdapter) {
   const pieces = [];
-  for (const s of wordSegmenter.segment(normalized)) {
+  for (const s of segmentAdapter.segmentWords(normalized)) {
     const text = s.segment;
     const isWordLike = s.isWordLike ?? false;
     const texts = [];
@@ -98,13 +321,11 @@ function segmentText(normalized) {
   }
   return pieces;
 }
-function analyzeAndMeasure(text, font, adapter, cache, stats) {
+function analyzeAndMeasure(text, font, adapter, cache, stats, segmentAdapter) {
   const normalized = normalizeWhitespace(text);
   if (normalized.length === 0) return [];
-  const pieces = segmentText(normalized);
-  const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
-    granularity: "grapheme"
-  });
+  const segAdapter = segmentAdapter ?? getDefaultSegmentAdapter();
+  const pieces = segmentText(normalized, segAdapter);
   const rawTexts = [];
   const rawKinds = [];
   const rawWordLike = [];
@@ -169,7 +390,7 @@ function analyzeAndMeasure(text, font, adapter, cache, stats) {
     }
     if (isCJK(t)) {
       let unitText = "";
-      for (const gs of graphemeSegmenter2.segment(t)) {
+      for (const gs of segAdapter.segmentGraphemes(t)) {
         const grapheme = gs.segment;
         if (unitText.length > 0 && kinsokuStart.has(grapheme)) {
           unitText += grapheme;
@@ -201,7 +422,7 @@ function analyzeAndMeasure(text, font, adapter, cache, stats) {
     let graphemeWidths = null;
     if (mergedWordLike[i] && t.length > 1) {
       const gWidths = [];
-      for (const gs of graphemeSegmenter2.segment(t)) {
+      for (const gs of segAdapter.segmentGraphemes(t)) {
         gWidths.push(measureCached(gs.segment));
       }
       if (gWidths.length > 1) {
@@ -212,10 +433,11 @@ function analyzeAndMeasure(text, font, adapter, cache, stats) {
   }
   return segments;
 }
-function computeLineBreaks(segments, maxWidth, adapter, font, cache) {
+function computeLineBreaks(segments, maxWidth, adapter, font, cache, segmentAdapter) {
   if (segments.length === 0) {
     return { lines: [], lineCount: 0 };
   }
+  const segAdapter = segmentAdapter ?? getDefaultSegmentAdapter();
   const lines = [];
   let lineW = 0;
   let hasContent = false;
@@ -241,10 +463,7 @@ function computeLineBreaks(segments, maxWidth, adapter, font, cache) {
       const seg = segments[i];
       if (seg.kind === "soft-hyphen" || seg.kind === "hard-break") continue;
       if (i === lineStartSeg && lineStartGrapheme > 0 && seg.graphemeWidths) {
-        const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
-          granularity: "grapheme"
-        });
-        const graphemes = [...graphemeSegmenter2.segment(seg.text)].map((g) => g.segment);
+        const graphemes = [...segAdapter.segmentGraphemes(seg.text)].map((g) => g.segment);
         text += graphemes.slice(lineStartGrapheme).join("");
       } else {
         text += seg.text;
@@ -252,10 +471,7 @@ function computeLineBreaks(segments, maxWidth, adapter, font, cache) {
     }
     if (endGrapheme > 0 && endSeg < segments.length) {
       const seg = segments[endSeg];
-      const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
-        granularity: "grapheme"
-      });
-      const graphemes = [...graphemeSegmenter2.segment(seg.text)].map((g) => g.segment);
+      const graphemes = [...segAdapter.segmentGraphemes(seg.text)].map((g) => g.segment);
       const startG = lineStartSeg === endSeg ? lineStartGrapheme : 0;
       text += graphemes.slice(startG, endGrapheme).join("");
     }
@@ -386,26 +602,19 @@ function computeLineBreaks(segments, maxWidth, adapter, font, cache) {
 function canBreakAfter(kind) {
   return kind === "space" || kind === "zero-width-break" || kind === "soft-hyphen";
 }
-var _graphemeSegmenter = null;
-function graphemeSegmenter() {
-  if (_graphemeSegmenter === null) {
-    _graphemeSegmenter = new Intl.Segmenter(void 0, { granularity: "grapheme" });
-  }
-  return _graphemeSegmenter;
-}
-function sliceSegmentText(seg, startG, endG) {
+function sliceSegmentText(seg, startG, endG, segmentAdapter) {
   if (startG === 0 && endG < 0) return seg.text;
-  const graphemes = [...graphemeSegmenter().segment(seg.text)].map((g) => g.segment);
+  const graphemes = [...segmentAdapter.segmentGraphemes(seg.text)].map((g) => g.segment);
   const stop = endG < 0 ? graphemes.length : endG;
   return graphemes.slice(startG, stop).join("");
 }
-function buildLineText(segments, startSeg, startG, endSeg, endG, appendHyphen) {
+function buildLineText(segments, startSeg, startG, endSeg, endG, appendHyphen, segmentAdapter) {
   let text = "";
   for (let i = startSeg; i < endSeg; i++) {
     const seg = segments[i];
     if (seg.kind === "soft-hyphen" || seg.kind === "hard-break") continue;
     if (i === startSeg && startG > 0) {
-      text += sliceSegmentText(seg, startG, -1);
+      text += sliceSegmentText(seg, startG, -1, segmentAdapter);
     } else {
       text += seg.text;
     }
@@ -413,7 +622,7 @@ function buildLineText(segments, startSeg, startG, endSeg, endG, appendHyphen) {
   if (endG > 0 && endSeg < segments.length) {
     const seg = segments[endSeg];
     const from = startSeg === endSeg ? startG : 0;
-    text += sliceSegmentText(seg, from, endG);
+    text += sliceSegmentText(seg, from, endG, segmentAdapter);
   }
   if (appendHyphen) text += "-";
   return text;
@@ -439,6 +648,7 @@ function resolveHyphenWidth(ctx) {
 function layoutNextLine(segments, cursor, slotWidth, ctx) {
   let i = cursor.segmentIndex;
   const initialG = cursor.graphemeIndex;
+  const segAdapter = ctx?.segmentAdapter ?? getDefaultSegmentAdapter();
   if (i >= segments.length) return null;
   if (initialG === 0) {
     while (i < segments.length) {
@@ -504,7 +714,15 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
     if (seg.graphemeWidths) {
       const overflowed = consumeBreakable(startSeg, startG, seg.graphemeWidths);
       if (overflowed) {
-        const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+        const text2 = buildLineText(
+          segments,
+          startSeg,
+          startG,
+          lineEndSeg,
+          lineEndG,
+          false,
+          segAdapter
+        );
         return {
           text: text2,
           width: lineW,
@@ -527,7 +745,8 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
           startG,
           lineEndSeg,
           lineEndG,
-          endsAtSoftHyphen2
+          endsAtSoftHyphen2,
+          segAdapter
         );
         return {
           text: text2,
@@ -548,7 +767,15 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
       if (w > slotWidth && seg.graphemeWidths) {
         const overflowed = consumeBreakable(i, 0, seg.graphemeWidths);
         if (overflowed) {
-          const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+          const text2 = buildLineText(
+            segments,
+            startSeg,
+            startG,
+            lineEndSeg,
+            lineEndG,
+            false,
+            segAdapter
+          );
           return {
             text: text2,
             width: lineW,
@@ -582,7 +809,8 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
           startG,
           lineEndSeg,
           lineEndG,
-          endsAtSoftHyphen2
+          endsAtSoftHyphen2,
+          segAdapter
         );
         return {
           text: text3,
@@ -598,7 +826,8 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
           startG,
           pendingBreakSeg,
           pendingBreakG,
-          pendingBreakSoftHyphen
+          pendingBreakSoftHyphen,
+          segAdapter
         );
         return {
           text: text3,
@@ -608,7 +837,15 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
         };
       }
       if (w > slotWidth && seg.graphemeWidths) {
-        const text3 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+        const text3 = buildLineText(
+          segments,
+          startSeg,
+          startG,
+          lineEndSeg,
+          lineEndG,
+          false,
+          segAdapter
+        );
         return {
           text: text3,
           width: lineW,
@@ -616,7 +853,15 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
           end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
         };
       }
-      const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+      const text2 = buildLineText(
+        segments,
+        startSeg,
+        startG,
+        lineEndSeg,
+        lineEndG,
+        false,
+        segAdapter
+      );
       return {
         text: text2,
         width: lineW,
@@ -634,7 +879,15 @@ function layoutNextLine(segments, cursor, slotWidth, ctx) {
   }
   if (!hasContent) return null;
   const endsAtSoftHyphen = lineEndSeg > 0 && segments[lineEndSeg - 1]?.kind === "soft-hyphen";
-  const text = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, endsAtSoftHyphen);
+  const text = buildLineText(
+    segments,
+    startSeg,
+    startG,
+    lineEndSeg,
+    lineEndG,
+    endsAtSoftHyphen,
+    segAdapter
+  );
   return {
     text,
     width: lineW + (endsAtSoftHyphen ? hyphenWidth : 0),
@@ -663,11 +916,9 @@ function carveTextLineSlots(base, blocked, minSlotWidth = 0) {
   }
   return slots;
 }
-function computeCharPositions(lineBreaks, segments, lineHeight) {
+function computeCharPositions(lineBreaks, segments, lineHeight, segmentAdapter) {
   const positions = [];
-  const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
-    granularity: "grapheme"
-  });
+  const segAdapter = segmentAdapter ?? getDefaultSegmentAdapter();
   for (let lineIdx = 0; lineIdx < lineBreaks.lines.length; lineIdx++) {
     const line = lineBreaks.lines[lineIdx];
     const y = lineIdx * lineHeight;
@@ -678,7 +929,7 @@ function computeCharPositions(lineBreaks, segments, lineHeight) {
         if (si >= line.endSegment && line.endGrapheme === 0) break;
         continue;
       }
-      const graphemes = [...graphemeSegmenter2.segment(seg.text)].map((g) => g.segment);
+      const graphemes = [...segAdapter.segmentGraphemes(seg.text)].map((g) => g.segment);
       if (graphemes.length === 0) continue;
       const startG = si === line.startSegment ? line.startGrapheme : 0;
       let endG;
@@ -699,7 +950,8 @@ function computeCharPositions(lineBreaks, segments, lineHeight) {
   return positions;
 }
 function reactiveLayout(opts) {
-  const { adapter, name = "reactive-layout" } = opts;
+  const { adapter, segmentAdapter: segmentAdapterOpt, name = "reactive-layout" } = opts;
+  const segmentAdapter = segmentAdapterOpt ?? getDefaultSegmentAdapter();
   const g = new Graph(name);
   const measureCache = /* @__PURE__ */ new Map();
   const textNode = node([], { name: "text", initial: opts.text ?? "" });
@@ -737,7 +989,8 @@ function reactiveLayout(opts) {
         fontVal,
         adapter,
         measureCache,
-        measureStats
+        measureStats,
+        segmentAdapter
       );
       const elapsed = monotonicNs() - t0;
       const lookups = measureStats.hits + measureStats.misses;
@@ -790,7 +1043,8 @@ function reactiveLayout(opts) {
           data[1],
           adapter,
           data[2],
-          measureCache
+          measureCache,
+          segmentAdapter
         )
       );
     },
@@ -832,7 +1086,8 @@ function reactiveLayout(opts) {
         computeCharPositions(
           data[0],
           data[1],
-          data[2]
+          data[2],
+          segmentAdapter
         )
       );
     },
@@ -874,6 +1129,16 @@ function reactiveLayout(opts) {
 }
 
 export {
+  IntlSegmentAdapter,
+  getDefaultSegmentAdapter,
+  _resetDefaultSegmentAdapterForTests,
+  CliMeasureAdapter,
+  InjectedMeasureAdapter,
+  PrecomputedAdapter,
+  CanvasMeasureAdapter,
+  NodeCanvasMeasureAdapter,
+  SvgBoundsAdapter,
+  ImageSizeAdapter,
   analyzeAndMeasure,
   computeLineBreaks,
   layoutNextLine,
@@ -881,4 +1146,4 @@ export {
   computeCharPositions,
   reactiveLayout
 };
-//# sourceMappingURL=chunk-3PSLNJDU.js.map
+//# sourceMappingURL=chunk-6DQYBIHW.js.map