@graphrefly/graphrefly 0.45.0 → 0.46.0

package/dist/utils/reactive-layout/index.cjs

@@ -0,0 +1,1607 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/utils/reactive-layout/index.ts
+var reactive_layout_exports = {};
+__export(reactive_layout_exports, {
+  CanvasMeasureAdapter: () => CanvasMeasureAdapter,
+  CliMeasureAdapter: () => CliMeasureAdapter,
+  ImageSizeAdapter: () => ImageSizeAdapter,
+  NodeCanvasMeasureAdapter: () => NodeCanvasMeasureAdapter,
+  PrecomputedAdapter: () => PrecomputedAdapter,
+  SvgBoundsAdapter: () => SvgBoundsAdapter,
+  analyzeAndMeasure: () => analyzeAndMeasure,
+  carveTextLineSlots: () => carveTextLineSlots,
+  circleIntervalForBand: () => circleIntervalForBand,
+  computeBlockFlow: () => computeBlockFlow,
+  computeCharPositions: () => computeCharPositions,
+  computeFlowLines: () => computeFlowLines,
+  computeLineBreaks: () => computeLineBreaks,
+  computeTotalHeight: () => computeTotalHeight,
+  layoutNextLine: () => layoutNextLine,
+  measureBlock: () => measureBlock,
+  measureBlocks: () => measureBlocks,
+  reactiveBlockLayout: () => reactiveBlockLayout,
+  reactiveFlowLayout: () => reactiveFlowLayout,
+  reactiveLayout: () => reactiveLayout,
+  rectIntervalForBand: () => rectIntervalForBand
+});
+module.exports = __toCommonJS(reactive_layout_exports);
+
+// src/base/render/_ascii-width.ts
+function cellWidth(code) {
+  if (code >= 768 && code <= 879 || // Combining Diacritical Marks
+  code >= 1155 && code <= 1161 || // Cyrillic combining marks
+  code >= 1425 && code <= 1469 || // Hebrew combining marks
+  code >= 1552 && code <= 1562 || // Arabic combining marks
+  code >= 1611 && code <= 1631 || // Arabic combining marks
+  code >= 1648 && code === 1648 || // Arabic superscript alef
+  code >= 1750 && code <= 1756 || // Arabic combining marks
+  code >= 1759 && code <= 1764 || // Arabic combining marks
+  code >= 1767 && code <= 1768 || // Arabic combining marks
+  code >= 1770 && code <= 1773 || // Arabic combining marks
+  code >= 1840 && code <= 1866 || // Syriac combining marks
+  code >= 1958 && code <= 1968 || // Thaana combining marks
+  code >= 2304 && code <= 2307 || // Devanagari combining marks
+  code >= 2362 && code <= 2383 || // Devanagari combining marks
+  code >= 2385 && code <= 2391 || // Devanagari combining marks
+  code >= 2402 && code <= 2403 || // Devanagari combining marks
+  code >= 2433 && code <= 2435 || // Bengali combining marks
+  code >= 2492 && code <= 2509 || // Bengali combining marks
+  code >= 2561 && code <= 2563 || // Gurmukhi combining marks
+  code >= 2620 && code <= 2641 || // Gurmukhi combining marks
+  code >= 2672 && code <= 2673 || // Gurmukhi combining marks
+  code >= 2677 && code === 2677 || // Gurmukhi combining mark
+  code >= 3633 && code === 3633 || // Thai combining mark
+  code >= 3636 && code <= 3642 || // Thai combining marks
+  code >= 3655 && code <= 3662 || // Thai combining marks
+  code >= 3761 && code === 3761 || // Lao combining mark
+  code >= 3764 && code <= 3772 || // Lao combining marks
+  code >= 3784 && code <= 3790 || // Lao combining marks
+  code >= 7616 && code <= 7679 || // Combining Diacritical Marks Supplement
+  code >= 8400 && code <= 8447 || // Combining Diacritical Marks for Symbols
+  code >= 65024 && code <= 65039 || // Variation Selectors
+  code >= 65056 && code <= 65071 || // Combining Half Marks
+  code === 8205) {
+    return 0;
+  }
+  if (code >= 4352 && code <= 4447 || // Hangul Jamo
+  code >= 8986 && code <= 8987 || // Watch, Hourglass
+  code >= 9001 && code <= 9002 || // Angle brackets
+  code >= 9193 && code <= 9203 || // Media control symbols
+  code >= 9208 && code <= 9210 || // Media control symbols
+  code >= 9725 && code <= 9726 || // Medium squares
+  code >= 9748 && code <= 9749 || // Umbrella, Hot Beverage
+  code >= 9800 && code <= 9811 || // Zodiac symbols
+  code === 9855 || // Wheelchair
+  code === 9875 || // Anchor
+  code === 9889 || // High Voltage
+  code >= 9898 && code <= 9899 || // Medium circles
+  code >= 9917 && code <= 9918 || // Soccer, Baseball
+  code >= 9924 && code <= 9925 || // Snowman, Sun behind cloud
+  code === 9934 || // Ophiuchus
+  code === 9940 || // No Entry
+  code === 9962 || // Church
+  code >= 9970 && code <= 9971 || // Fountain, Golf
+  code === 9973 || // Sailboat
+  code === 9978 || // Tent
+  code === 9981 || // Fuel Pump
+  code === 9986 || // Scissors
+  code === 9989 || // Check Mark
+  code >= 9992 && code <= 9997 || // Airplane...Writing Hand
+  code === 9999 || // Pencil
+  code >= 10067 && code <= 10069 || // Question marks
+  code === 10071 || // Exclamation
+  code >= 10133 && code <= 10135 || // Plus, Minus, Divide
+  code === 10160 || // Curly Loop
+  code === 10175 || // Double Curly Loop
+  code >= 10548 && code <= 10549 || // Arrows
+  code >= 11013 && code <= 11015 || // Arrows
+  code >= 11035 && code <= 11036 || // Squares
+  code === 11088 || // Star
+  code === 11093 || // Circle
+  code >= 11904 && code <= 12350 || // CJK Radicals, Symbols, Punctuation
+  code >= 12352 && code <= 12447 || // Hiragana
+  code >= 12448 && code <= 12543 || // Katakana
+  code >= 12549 && code <= 12591 || // Bopomofo
+  code >= 12593 && code <= 12686 || // Hangul Compatibility Jamo
+  code >= 12688 && code <= 12771 || // Kanbun, CJK Strokes
+  code >= 12784 && code <= 12830 || // Katakana Phonetic Extensions
+  code >= 12832 && code <= 12871 || // Enclosed CJK
+  code >= 12880 && code <= 19903 || // CJK Extensions + Unified block
+  code >= 19968 && code <= 40959 || // CJK Unified Ideographs
+  code >= 43360 && code <= 43388 || // Hangul Jamo Extended-A
+  code >= 44032 && code <= 55203 || // Hangul Syllables
+  code >= 63744 && code <= 64255 || // CJK Compatibility Ideographs
+  code >= 65040 && code <= 65049 || // Vertical forms
+  code >= 65072 && code <= 65131 || // CJK Compatibility Forms
+  code >= 65281 && code <= 65376 || // Fullwidth Forms (excl. halfwidth)
+  code >= 65504 && code <= 65510 || // Fullwidth Signs
+  code >= 126980 && code === 126980 || // Mahjong Red Dragon
+  code === 127183 || // Joker
+  code >= 127344 && code <= 127345 || // A/B buttons
+  code === 127358 || // O button
+  code === 127359 || // P button
+  code === 127374 || // AB button
+  code >= 127377 && code <= 127386 || // Squared symbols
+  code >= 127456 && code <= 127487 || // Regional Indicator Symbols
+  code >= 127488 && code <= 127490 || // Enclosed ideographic
+  code === 127514 || // Squared CJK
+  code === 127535 || // Squared CJK
+  code >= 127538 && code <= 127546 || // Squared CJK
+  code >= 127568 && code <= 127569 || // Circled ideographic
+  code >= 127744 && code <= 129535 || // Misc Symbols / Emoticons / Emoji
+  code >= 129536 && code <= 129791 || // Chess, Symbols Extended-A
+  code >= 129792 && code <= 130047 || // Symbols for Legacy Computing
+  code >= 131072 && code <= 196605 || // CJK Extension B-F (excl. nonchars)
+  code >= 196608 && code <= 262141) {
+    return 2;
+  }
+  return 1;
+}
+function countCells(text) {
+  let cells = 0;
+  for (const ch of text) {
+    cells += cellWidth(ch.codePointAt(0));
+  }
+  return cells;
+}
+
+// src/utils/reactive-layout/measurement-adapters.ts
+var CliMeasureAdapter = class {
+  cellPx;
+  constructor(opts) {
+    this.cellPx = opts?.cellPx ?? 8;
+  }
+  measureSegment(text, _font) {
+    return { width: countCells(text) * this.cellPx };
+  }
+};
+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-block-layout.ts
+var import_core3 = require("@graphrefly/pure-ts/core");
+var import_graph2 = require("@graphrefly/pure-ts/graph");
+
+// src/base/meta/emit-to-meta.ts
+var import_core = require("@graphrefly/pure-ts/core");
+function emitToMeta(metaNode, value) {
+  if (metaNode == null) return;
+  (0, import_core.downWithBatch)((msgs) => metaNode.down(msgs), [[import_core.DATA, value]], import_core.defaultConfig.tierOf);
+}
+
+// src/utils/reactive-layout/reactive-layout.ts
+var import_core2 = require("@graphrefly/pure-ts/core");
+var import_graph = require("@graphrefly/pure-ts/graph");
+function isCJK(s) {
+  for (const ch of s) {
+    const c = ch.codePointAt(0);
+    if (c >= 19968 && c <= 40959 || // CJK Unified Ideographs
+    c >= 13312 && c <= 19903 || // CJK Extension A
+    c >= 12288 && c <= 12351 || // CJK Symbols and Punctuation
+    c >= 12352 && c <= 12447 || // Hiragana
+    c >= 12448 && c <= 12543 || // Katakana
+    c >= 44032 && c <= 55215 || // Hangul
+    c >= 65280 && c <= 65519) {
+      return true;
+    }
+  }
+  return false;
+}
+var kinsokuStart = /* @__PURE__ */ new Set([
+  "\uFF0C",
+  "\uFF0E",
+  "\uFF01",
+  "\uFF1A",
+  "\uFF1B",
+  "\uFF1F",
+  "\u3001",
+  "\u3002",
+  "\u30FB",
+  "\uFF09",
+  "\u3015",
+  "\u3009",
+  "\u300B",
+  "\u300D",
+  "\u300F",
+  "\u3011"
+]);
+var leftStickyPunctuation = /* @__PURE__ */ new Set([
+  ".",
+  ",",
+  "!",
+  "?",
+  ":",
+  ";",
+  ")",
+  "]",
+  "}",
+  "%",
+  '"',
+  "\u201D",
+  "\u2019",
+  "\xBB",
+  "\u203A",
+  "\u2026"
+]);
+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" });
+  const pieces = [];
+  for (const s of wordSegmenter.segment(normalized)) {
+    const text = s.segment;
+    const isWordLike = s.isWordLike ?? false;
+    const texts = [];
+    const wordLikes = [];
+    const kinds = [];
+    let currentText = "";
+    let currentKind = null;
+    for (const ch of text) {
+      let kind;
+      if (ch === " ") kind = "space";
+      else if (ch === "\u200B") kind = "zero-width-break";
+      else if (ch === "\xAD") kind = "soft-hyphen";
+      else if (ch === "\n") kind = "hard-break";
+      else kind = "text";
+      if (currentKind !== null && kind === currentKind) {
+        currentText += ch;
+      } else {
+        if (currentKind !== null) {
+          texts.push(currentText);
+          wordLikes.push(currentKind === "text" && isWordLike);
+          kinds.push(currentKind);
+        }
+        currentText = ch;
+        currentKind = kind;
+      }
+    }
+    if (currentKind !== null) {
+      texts.push(currentText);
+      wordLikes.push(currentKind === "text" && isWordLike);
+      kinds.push(currentKind);
+    }
+    pieces.push({ texts, isWordLike: wordLikes, kinds });
+  }
+  return pieces;
+}
+function analyzeAndMeasure(text, font, adapter, cache, stats) {
+  const normalized = normalizeWhitespace(text);
+  if (normalized.length === 0) return [];
+  const pieces = segmentText(normalized);
+  const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
+    granularity: "grapheme"
+  });
+  const rawTexts = [];
+  const rawKinds = [];
+  const rawWordLike = [];
+  for (const piece of pieces) {
+    for (let i = 0; i < piece.texts.length; i++) {
+      rawTexts.push(piece.texts[i]);
+      rawKinds.push(piece.kinds[i]);
+      rawWordLike.push(piece.isWordLike[i]);
+    }
+  }
+  const mergedTexts = [];
+  const mergedKinds = [];
+  const mergedWordLike = [];
+  for (let i = 0; i < rawTexts.length; i++) {
+    const t = rawTexts[i];
+    const k = rawKinds[i];
+    const wl = rawWordLike[i];
+    if (k === "text" && !wl && mergedTexts.length > 0 && mergedKinds[mergedKinds.length - 1] === "text") {
+      const isSticky = t.length === 1 && (leftStickyPunctuation.has(t) || kinsokuStart.has(t));
+      if (isSticky) {
+        mergedTexts[mergedTexts.length - 1] += t;
+        continue;
+      }
+    }
+    if (t === "-" && mergedTexts.length > 0 && mergedKinds[mergedKinds.length - 1] === "text" && mergedWordLike[mergedWordLike.length - 1]) {
+      mergedTexts[mergedTexts.length - 1] += t;
+      continue;
+    }
+    mergedTexts.push(t);
+    mergedKinds.push(k);
+    mergedWordLike.push(wl);
+  }
+  let fontCache = cache.get(font);
+  if (!fontCache) {
+    fontCache = /* @__PURE__ */ new Map();
+    cache.set(font, fontCache);
+  }
+  function measureCached(seg) {
+    let w = fontCache.get(seg);
+    if (w === void 0) {
+      if (stats) stats.misses += 1;
+      const raw = adapter.measureSegment(seg, font).width;
+      w = Number.isFinite(raw) && raw >= 0 ? raw : 0;
+      fontCache.set(seg, w);
+    } else if (stats) {
+      stats.hits += 1;
+    }
+    return w;
+  }
+  const segments = [];
+  for (let i = 0; i < mergedTexts.length; i++) {
+    const t = mergedTexts[i];
+    const k = mergedKinds[i];
+    if (k !== "text") {
+      segments.push({
+        text: t,
+        width: k === "space" ? measureCached(" ") * t.length : 0,
+        kind: k,
+        graphemeWidths: null
+      });
+      continue;
+    }
+    if (isCJK(t)) {
+      let unitText = "";
+      for (const gs of graphemeSegmenter2.segment(t)) {
+        const grapheme = gs.segment;
+        if (unitText.length > 0 && kinsokuStart.has(grapheme)) {
+          unitText += grapheme;
+          continue;
+        }
+        if (unitText.length > 0) {
+          const w2 = measureCached(unitText);
+          segments.push({
+            text: unitText,
+            width: w2,
+            kind: "text",
+            graphemeWidths: null
+          });
+        }
+        unitText = grapheme;
+      }
+      if (unitText.length > 0) {
+        const w2 = measureCached(unitText);
+        segments.push({
+          text: unitText,
+          width: w2,
+          kind: "text",
+          graphemeWidths: null
+        });
+      }
+      continue;
+    }
+    const w = measureCached(t);
+    let graphemeWidths = null;
+    if (mergedWordLike[i] && t.length > 1) {
+      const gWidths = [];
+      for (const gs of graphemeSegmenter2.segment(t)) {
+        gWidths.push(measureCached(gs.segment));
+      }
+      if (gWidths.length > 1) {
+        graphemeWidths = gWidths;
+      }
+    }
+    segments.push({ text: t, width: w, kind: "text", graphemeWidths });
+  }
+  return segments;
+}
+function computeLineBreaks(segments, maxWidth, adapter, font, cache) {
+  if (segments.length === 0) {
+    return { lines: [], lineCount: 0 };
+  }
+  const lines = [];
+  let lineW = 0;
+  let hasContent = false;
+  let lineStartSeg = 0;
+  let lineStartGrapheme = 0;
+  let lineEndSeg = 0;
+  let lineEndGrapheme = 0;
+  let pendingBreakSeg = -1;
+  let pendingBreakWidth = 0;
+  let fontCache = cache.get(font);
+  if (!fontCache) {
+    fontCache = /* @__PURE__ */ new Map();
+    cache.set(font, fontCache);
+  }
+  let hyphenWidth = fontCache.get("-");
+  if (hyphenWidth === void 0) {
+    hyphenWidth = adapter.measureSegment("-", font).width;
+    fontCache.set("-", hyphenWidth);
+  }
+  function flushLine(endSeg = lineEndSeg, endGrapheme = lineEndGrapheme, width = lineW) {
+    let text = "";
+    for (let i = lineStartSeg; i < endSeg; i++) {
+      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);
+        text += graphemes.slice(lineStartGrapheme).join("");
+      } else {
+        text += seg.text;
+      }
+    }
+    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 startG = lineStartSeg === endSeg ? lineStartGrapheme : 0;
+      text += graphemes.slice(startG, endGrapheme).join("");
+    }
+    if (endSeg > 0 && segments[endSeg - 1]?.kind === "soft-hyphen" && !(lineStartSeg === endSeg && lineStartGrapheme > 0)) {
+      text += "-";
+    }
+    lines.push({
+      text,
+      width,
+      startSegment: lineStartSeg,
+      startGrapheme: lineStartGrapheme,
+      endSegment: endSeg,
+      endGrapheme
+    });
+    lineW = 0;
+    hasContent = false;
+    pendingBreakSeg = -1;
+    pendingBreakWidth = 0;
+  }
+  function canBreakAfter2(kind) {
+    return kind === "space" || kind === "zero-width-break" || kind === "soft-hyphen";
+  }
+  function startLine(segIdx, graphemeIdx, width) {
+    hasContent = true;
+    lineStartSeg = segIdx;
+    lineStartGrapheme = graphemeIdx;
+    lineEndSeg = segIdx + 1;
+    lineEndGrapheme = 0;
+    lineW = width;
+  }
+  function startLineAtGrapheme(segIdx, graphemeIdx, width) {
+    hasContent = true;
+    lineStartSeg = segIdx;
+    lineStartGrapheme = graphemeIdx;
+    lineEndSeg = segIdx;
+    lineEndGrapheme = graphemeIdx + 1;
+    lineW = width;
+  }
+  for (let i = 0; i < segments.length; i++) {
+    const seg = segments[i];
+    if (seg.kind === "hard-break") {
+      if (hasContent) {
+        flushLine();
+      } else {
+        lines.push({
+          text: "",
+          width: 0,
+          startSegment: i,
+          startGrapheme: 0,
+          endSegment: i,
+          endGrapheme: 0
+        });
+      }
+      lineStartSeg = i + 1;
+      lineStartGrapheme = 0;
+      continue;
+    }
+    const w = seg.width;
+    if (!hasContent) {
+      if (w > maxWidth && seg.graphemeWidths) {
+        appendBreakableSegment(i, 0, seg.graphemeWidths);
+      } else {
+        startLine(i, 0, w);
+      }
+      if (canBreakAfter2(seg.kind)) {
+        pendingBreakSeg = i + 1;
+        pendingBreakWidth = seg.kind === "space" ? lineW - w : lineW;
+      }
+      continue;
+    }
+    const newW = lineW + w;
+    if (newW > maxWidth + 5e-3) {
+      if (canBreakAfter2(seg.kind)) {
+        lineW += w;
+        lineEndSeg = i + 1;
+        lineEndGrapheme = 0;
+        flushLine(i + 1, 0, seg.kind === "space" ? lineW - w : lineW);
+        continue;
+      }
+      if (pendingBreakSeg >= 0) {
+        flushLine(pendingBreakSeg, 0, pendingBreakWidth);
+        i--;
+        continue;
+      }
+      if (w > maxWidth && seg.graphemeWidths) {
+        flushLine();
+        appendBreakableSegment(i, 0, seg.graphemeWidths);
+        continue;
+      }
+      flushLine();
+      i--;
+      continue;
+    }
+    lineW = newW;
+    lineEndSeg = i + 1;
+    lineEndGrapheme = 0;
+    if (canBreakAfter2(seg.kind)) {
+      pendingBreakSeg = i + 1;
+      pendingBreakWidth = seg.kind === "space" ? lineW - w : lineW;
+    }
+  }
+  if (hasContent) {
+    flushLine();
+  }
+  return { lines, lineCount: lines.length };
+  function appendBreakableSegment(segIdx, startG, gWidths) {
+    for (let g = startG; g < gWidths.length; g++) {
+      const gw = gWidths[g];
+      if (!hasContent) {
+        startLineAtGrapheme(segIdx, g, gw);
+        continue;
+      }
+      if (lineW + gw > maxWidth + 5e-3) {
+        flushLine();
+        startLineAtGrapheme(segIdx, g, gw);
+      } else {
+        lineW += gw;
+        lineEndSeg = segIdx;
+        lineEndGrapheme = g + 1;
+      }
+    }
+    if (hasContent && lineEndSeg === segIdx && lineEndGrapheme === gWidths.length) {
+      lineEndSeg = segIdx + 1;
+      lineEndGrapheme = 0;
+    }
+  }
+}
+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) {
+  if (startG === 0 && endG < 0) return seg.text;
+  const graphemes = [...graphemeSegmenter().segment(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) {
+  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);
+    } else {
+      text += seg.text;
+    }
+  }
+  if (endG > 0 && endSeg < segments.length) {
+    const seg = segments[endSeg];
+    const from = startSeg === endSeg ? startG : 0;
+    text += sliceSegmentText(seg, from, endG);
+  }
+  if (appendHyphen) text += "-";
+  return text;
+}
+function resolveHyphenWidth(ctx) {
+  if (!ctx?.adapter || !ctx.font) return 0;
+  const cache = ctx.cache;
+  if (cache) {
+    let fc = cache.get(ctx.font);
+    if (!fc) {
+      fc = /* @__PURE__ */ new Map();
+      cache.set(ctx.font, fc);
+    }
+    let hw = fc.get("-");
+    if (hw === void 0) {
+      hw = ctx.adapter.measureSegment("-", ctx.font).width;
+      fc.set("-", hw);
+    }
+    return hw;
+  }
+  return ctx.adapter.measureSegment("-", ctx.font).width;
+}
+function layoutNextLine(segments, cursor, slotWidth, ctx) {
+  let i = cursor.segmentIndex;
+  const initialG = cursor.graphemeIndex;
+  if (i >= segments.length) return null;
+  if (initialG === 0) {
+    while (i < segments.length) {
+      const seg = segments[i];
+      if (seg.kind === "hard-break") {
+        return {
+          text: "",
+          width: 0,
+          start: { segmentIndex: cursor.segmentIndex, graphemeIndex: 0 },
+          end: { segmentIndex: i + 1, graphemeIndex: 0 }
+        };
+      }
+      if (seg.kind === "space" || seg.kind === "zero-width-break" || seg.kind === "soft-hyphen") {
+        i += 1;
+        continue;
+      }
+      break;
+    }
+    if (i >= segments.length) return null;
+  }
+  const hyphenWidth = resolveHyphenWidth(ctx);
+  const startSeg = i;
+  const startG = i === cursor.segmentIndex ? initialG : 0;
+  let lineW = 0;
+  let lineEndSeg = startSeg;
+  let lineEndG = 0;
+  let hasContent = false;
+  let pendingBreakSeg = -1;
+  let pendingBreakG = 0;
+  let pendingBreakWidth = 0;
+  let pendingBreakSoftHyphen = false;
+  const recordPending = (sIdx, gIdx, widthAtBreak, kind) => {
+    pendingBreakSeg = sIdx;
+    pendingBreakG = gIdx;
+    pendingBreakWidth = widthAtBreak;
+    pendingBreakSoftHyphen = kind === "soft-hyphen";
+  };
+  const consumeBreakable = (segIdx, gStart, gWidths) => {
+    for (let g = gStart; g < gWidths.length; g++) {
+      const gw = gWidths[g];
+      if (!hasContent) {
+        lineW = gw;
+        lineEndSeg = segIdx;
+        lineEndG = g + 1;
+        hasContent = true;
+        continue;
+      }
+      if (lineW + gw > slotWidth + 5e-3) {
+        return true;
+      }
+      lineW += gw;
+      lineEndSeg = segIdx;
+      lineEndG = g + 1;
+    }
+    if (lineEndSeg === segIdx && lineEndG === gWidths.length) {
+      lineEndSeg = segIdx + 1;
+      lineEndG = 0;
+    }
+    return false;
+  };
+  if (startG > 0 && startSeg < segments.length) {
+    const seg = segments[startSeg];
+    if (seg.graphemeWidths) {
+      const overflowed = consumeBreakable(startSeg, startG, seg.graphemeWidths);
+      if (overflowed) {
+        const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+        return {
+          text: text2,
+          width: lineW,
+          start: { segmentIndex: startSeg, graphemeIndex: startG },
+          end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+        };
+      }
+      i = lineEndSeg;
+    } else {
+    }
+  }
+  for (; i < segments.length; ) {
+    const seg = segments[i];
+    if (seg.kind === "hard-break") {
+      if (hasContent) {
+        const endsAtSoftHyphen2 = lineEndSeg > 0 && segments[lineEndSeg - 1]?.kind === "soft-hyphen";
+        const text2 = buildLineText(
+          segments,
+          startSeg,
+          startG,
+          lineEndSeg,
+          lineEndG,
+          endsAtSoftHyphen2
+        );
+        return {
+          text: text2,
+          width: lineW + (endsAtSoftHyphen2 ? hyphenWidth : 0),
+          start: { segmentIndex: startSeg, graphemeIndex: startG },
+          end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+        };
+      }
+      return {
+        text: "",
+        width: 0,
+        start: { segmentIndex: startSeg, graphemeIndex: startG },
+        end: { segmentIndex: i + 1, graphemeIndex: 0 }
+      };
+    }
+    const w = seg.width;
+    if (!hasContent) {
+      if (w > slotWidth && seg.graphemeWidths) {
+        const overflowed = consumeBreakable(i, 0, seg.graphemeWidths);
+        if (overflowed) {
+          const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+          return {
+            text: text2,
+            width: lineW,
+            start: { segmentIndex: startSeg, graphemeIndex: startG },
+            end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+          };
+        }
+        i = lineEndSeg;
+        continue;
+      }
+      lineW = w;
+      lineEndSeg = i + 1;
+      lineEndG = 0;
+      hasContent = true;
+      if (canBreakAfter(seg.kind)) {
+        recordPending(i + 1, 0, seg.kind === "space" ? lineW - w : lineW, seg.kind);
+      }
+      i += 1;
+      continue;
+    }
+    const newW = lineW + w;
+    if (newW > slotWidth + 5e-3) {
+      if (canBreakAfter(seg.kind)) {
+        lineEndSeg = i + 1;
+        lineEndG = 0;
+        const endsAtSoftHyphen2 = seg.kind === "soft-hyphen";
+        const finalWidth = seg.kind === "space" ? lineW : lineW + (endsAtSoftHyphen2 ? hyphenWidth : 0);
+        const text3 = buildLineText(
+          segments,
+          startSeg,
+          startG,
+          lineEndSeg,
+          lineEndG,
+          endsAtSoftHyphen2
+        );
+        return {
+          text: text3,
+          width: finalWidth,
+          start: { segmentIndex: startSeg, graphemeIndex: startG },
+          end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+        };
+      }
+      if (pendingBreakSeg >= 0) {
+        const text3 = buildLineText(
+          segments,
+          startSeg,
+          startG,
+          pendingBreakSeg,
+          pendingBreakG,
+          pendingBreakSoftHyphen
+        );
+        return {
+          text: text3,
+          width: pendingBreakWidth + (pendingBreakSoftHyphen ? hyphenWidth : 0),
+          start: { segmentIndex: startSeg, graphemeIndex: startG },
+          end: { segmentIndex: pendingBreakSeg, graphemeIndex: pendingBreakG }
+        };
+      }
+      if (w > slotWidth && seg.graphemeWidths) {
+        const text3 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+        return {
+          text: text3,
+          width: lineW,
+          start: { segmentIndex: startSeg, graphemeIndex: startG },
+          end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+        };
+      }
+      const text2 = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, false);
+      return {
+        text: text2,
+        width: lineW,
+        start: { segmentIndex: startSeg, graphemeIndex: startG },
+        end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+      };
+    }
+    lineW = newW;
+    lineEndSeg = i + 1;
+    lineEndG = 0;
+    if (canBreakAfter(seg.kind)) {
+      recordPending(i + 1, 0, seg.kind === "space" ? lineW - w : lineW, seg.kind);
+    }
+    i += 1;
+  }
+  if (!hasContent) return null;
+  const endsAtSoftHyphen = lineEndSeg > 0 && segments[lineEndSeg - 1]?.kind === "soft-hyphen";
+  const text = buildLineText(segments, startSeg, startG, lineEndSeg, lineEndG, endsAtSoftHyphen);
+  return {
+    text,
+    width: lineW + (endsAtSoftHyphen ? hyphenWidth : 0),
+    start: { segmentIndex: startSeg, graphemeIndex: startG },
+    end: { segmentIndex: lineEndSeg, graphemeIndex: lineEndG }
+  };
+}
+function carveTextLineSlots(base, blocked, minSlotWidth = 0) {
+  let slots = [base];
+  for (let bi = 0; bi < blocked.length; bi++) {
+    const block = blocked[bi];
+    const next = [];
+    for (let si = 0; si < slots.length; si++) {
+      const slot = slots[si];
+      if (block.right <= slot.left || block.left >= slot.right) {
+        next.push(slot);
+        continue;
+      }
+      if (block.left > slot.left) next.push({ left: slot.left, right: block.left });
+      if (block.right < slot.right) next.push({ left: block.right, right: slot.right });
+    }
+    slots = next;
+  }
+  if (minSlotWidth > 0) {
+    return slots.filter((s) => s.right - s.left >= minSlotWidth);
+  }
+  return slots;
+}
+function computeCharPositions(lineBreaks, segments, lineHeight) {
+  const positions = [];
+  const graphemeSegmenter2 = new Intl.Segmenter(void 0, {
+    granularity: "grapheme"
+  });
+  for (let lineIdx = 0; lineIdx < lineBreaks.lines.length; lineIdx++) {
+    const line = lineBreaks.lines[lineIdx];
+    const y = lineIdx * lineHeight;
+    let x = 0;
+    for (let si = line.startSegment; si < segments.length; si++) {
+      const seg = segments[si];
+      if (seg.kind === "soft-hyphen" || seg.kind === "hard-break") {
+        if (si >= line.endSegment && line.endGrapheme === 0) break;
+        continue;
+      }
+      const graphemes = [...graphemeSegmenter2.segment(seg.text)].map((g) => g.segment);
+      if (graphemes.length === 0) continue;
+      const startG = si === line.startSegment ? line.startGrapheme : 0;
+      let endG;
+      if (si < line.endSegment) {
+        endG = graphemes.length;
+      } else if (si === line.endSegment && line.endGrapheme > 0) {
+        endG = line.endGrapheme;
+      } else {
+        break;
+      }
+      for (let g = startG; g < endG; g++) {
+        const gWidth = seg.graphemeWidths ? seg.graphemeWidths[g] : seg.width / graphemes.length;
+        positions.push({ x, y, width: gWidth, height: lineHeight, line: lineIdx });
+        x += gWidth;
+      }
+    }
+  }
+  return positions;
+}
+function reactiveLayout(opts) {
+  const { adapter, name = "reactive-layout" } = opts;
+  const g = new import_graph.Graph(name);
+  const measureCache = /* @__PURE__ */ new Map();
+  const textNode = (0, import_core2.node)([], { name: "text", initial: opts.text ?? "" });
+  const fontNode = (0, import_core2.node)([], {
+    name: "font",
+    initial: opts.font ?? "16px sans-serif"
+  });
+  const lineHeightNode = (0, import_core2.node)([], {
+    name: "line-height",
+    initial: opts.lineHeight ?? 20
+  });
+  const maxWidthNode = (0, import_core2.node)([], {
+    name: "max-width",
+    initial: Math.max(0, opts.maxWidth ?? 800)
+  });
+  function graphemeWidthsEqual(a, b) {
+    if (a === null || b === null) return a === b;
+    if (a.length !== b.length) return false;
+    for (let i = 0; i < a.length; i++) {
+      if (a[i] !== b[i]) return false;
+    }
+    return true;
+  }
+  const segmentsNode = (0, import_core2.node)(
+    [textNode, fontNode],
+    (data, actions, ctx) => {
+      const b0 = data[0];
+      const textVal = b0 != null && b0.length > 0 ? b0.at(-1) : ctx.prevData[0];
+      const b1 = data[1];
+      const fontVal = b1 != null && b1.length > 0 ? b1.at(-1) : ctx.prevData[1];
+      const t0 = (0, import_core2.monotonicNs)();
+      const measureStats = { hits: 0, misses: 0 };
+      const result = analyzeAndMeasure(
+        textVal,
+        fontVal,
+        adapter,
+        measureCache,
+        measureStats
+      );
+      const elapsed = (0, import_core2.monotonicNs)() - t0;
+      const lookups = measureStats.hits + measureStats.misses;
+      const hitRate = lookups === 0 ? 1 : measureStats.hits / lookups;
+      const meta = segmentsNode.meta;
+      if (meta) {
+        emitToMeta(meta["cache-hit-rate"], hitRate);
+        emitToMeta(meta["segment-count"], result.length);
+        emitToMeta(meta["layout-time-ns"], elapsed);
+      }
+      actions.emit(result);
+      const flush = () => {
+        measureCache.clear();
+        adapter.clearCache?.();
+      };
+      return { onDeactivation: flush, onInvalidate: flush };
+    },
+    {
+      name: "segments",
+      describeKind: "derived",
+      meta: {
+        "cache-hit-rate": 0,
+        "segment-count": 0,
+        "layout-time-ns": 0
+      },
+      equals: (a, b) => {
+        const sa = a;
+        const sb = b;
+        if (sa == null || sb == null) return sa === sb;
+        if (sa.length !== sb.length) return false;
+        for (let i = 0; i < sa.length; i++) {
+          const pa = sa[i];
+          const pb = sb[i];
+          if (pa.text !== pb.text || pa.width !== pb.width || pa.kind !== pb.kind || !graphemeWidthsEqual(pa.graphemeWidths ?? null, pb.graphemeWidths ?? null))
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  const lineBreaksNode = (0, import_core2.node)(
+    [segmentsNode, maxWidthNode, fontNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      actions.emit(
+        computeLineBreaks(
+          data[0],
+          data[1],
+          adapter,
+          data[2],
+          measureCache
+        )
+      );
+    },
+    {
+      name: "line-breaks",
+      describeKind: "derived",
+      equals: (a, b) => {
+        const la = a;
+        const lb = b;
+        if (la == null || lb == null) return la === lb;
+        if (la.lineCount !== lb.lineCount) return false;
+        for (let i = 0; i < la.lines.length; i++) {
+          const lineA = la.lines[i];
+          const lineB = lb.lines[i];
+          if (lineA.text !== lineB.text || lineA.width !== lineB.width || lineA.startSegment !== lineB.startSegment || lineA.startGrapheme !== lineB.startGrapheme || lineA.endSegment !== lineB.endSegment || lineA.endGrapheme !== lineB.endGrapheme)
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  const heightNode = (0, import_core2.node)(
+    [lineBreaksNode, lineHeightNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      actions.emit(data[0].lineCount * data[1]);
+    },
+    { describeKind: "derived", name: "height" }
+  );
+  const charPositionsNode = (0, import_core2.node)(
+    [lineBreaksNode, segmentsNode, lineHeightNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      actions.emit(
+        computeCharPositions(
+          data[0],
+          data[1],
+          data[2]
+        )
+      );
+    },
+    {
+      name: "char-positions",
+      describeKind: "derived",
+      equals: (a, b) => {
+        const ca = a;
+        const cb = b;
+        if (ca == null || cb == null) return ca === cb;
+        if (ca.length !== cb.length) return false;
+        for (let i = 0; i < ca.length; i++) {
+          if (ca[i].x !== cb[i].x || ca[i].y !== cb[i].y || ca[i].width !== cb[i].width)
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  g.add(textNode, { name: "text" });
+  g.add(fontNode, { name: "font" });
+  g.add(lineHeightNode, { name: "line-height" });
+  g.add(maxWidthNode, { name: "max-width" });
+  g.add(segmentsNode, { name: "segments" });
+  g.add(lineBreaksNode, { name: "line-breaks" });
+  g.add(heightNode, { name: "height" });
+  g.add(charPositionsNode, { name: "char-positions" });
+  return {
+    graph: g,
+    setText: (text) => g.set("text", text),
+    setFont: (font) => g.set("font", font),
+    setLineHeight: (lh) => g.set("line-height", lh),
+    setMaxWidth: (mw) => g.set("max-width", Math.max(0, mw)),
+    segments: segmentsNode,
+    lineBreaks: lineBreaksNode,
+    height: heightNode,
+    charPositions: charPositionsNode
+  };
+}
+
+// src/utils/reactive-layout/reactive-block-layout.ts
+function measureBlock(block, maxWidth, adapters, measureCache, defaultFont, defaultLineHeight, index) {
+  switch (block.type) {
+    case "text": {
+      const font = block.font ?? defaultFont;
+      const lineHeight = block.lineHeight ?? defaultLineHeight;
+      const segments = analyzeAndMeasure(block.text, font, adapters.text, measureCache);
+      const lineBreaks = computeLineBreaks(segments, maxWidth, adapters.text, font, measureCache);
+      const charPositions = computeCharPositions(lineBreaks, segments, lineHeight);
+      const height = lineBreaks.lineCount * lineHeight;
+      let width = 0;
+      for (const line of lineBreaks.lines) {
+        if (line.width > width) width = line.width;
+      }
+      return {
+        index,
+        type: "text",
+        width: Math.min(width, maxWidth),
+        height,
+        textSegments: segments,
+        textLineBreaks: lineBreaks,
+        textCharPositions: charPositions
+      };
+    }
+    case "image": {
+      let w;
+      let h;
+      if (block.naturalWidth != null && block.naturalHeight != null) {
+        w = block.naturalWidth;
+        h = block.naturalHeight;
+      } else if (adapters.image) {
+        const dims = adapters.image.measureImage(block.src);
+        w = dims.width;
+        h = dims.height;
+      } else {
+        throw new Error(
+          `Image block at index ${index} has no naturalWidth/naturalHeight and no ImageMeasurer adapter`
+        );
+      }
+      if (w > maxWidth) {
+        h = h * maxWidth / w;
+        w = maxWidth;
+      }
+      return { index, type: "image", width: w, height: h };
+    }
+    case "svg": {
+      let w;
+      let h;
+      if (block.viewBox) {
+        w = block.viewBox.width;
+        h = block.viewBox.height;
+      } else if (adapters.svg) {
+        const dims = adapters.svg.measureSvg(block.content);
+        w = dims.width;
+        h = dims.height;
+      } else {
+        throw new Error(`SVG block at index ${index} has no viewBox and no SvgMeasurer adapter`);
+      }
+      if (w > maxWidth) {
+        h = h * maxWidth / w;
+        w = maxWidth;
+      }
+      return { index, type: "svg", width: w, height: h };
+    }
+  }
+}
+function measureBlocks(blocks, maxWidth, adapters, measureCache, defaultFont, defaultLineHeight) {
+  return blocks.map(
+    (block, i) => measureBlock(block, maxWidth, adapters, measureCache, defaultFont, defaultLineHeight, i)
+  );
+}
+function computeBlockFlow(measured, gap) {
+  const result = [];
+  let y = 0;
+  for (let i = 0; i < measured.length; i++) {
+    const m = measured[i];
+    result.push({ ...m, x: 0, y });
+    y += m.height + (i < measured.length - 1 ? gap : 0);
+  }
+  return result;
+}
+function computeTotalHeight(flow) {
+  if (flow.length === 0) return 0;
+  const last = flow[flow.length - 1];
+  return last.y + last.height;
+}
+function reactiveBlockLayout(opts) {
+  const {
+    adapters,
+    name = "reactive-block-layout",
+    defaultFont = "16px sans-serif",
+    defaultLineHeight = 20
+  } = opts;
+  const g = new import_graph2.Graph(name);
+  const measureCache = /* @__PURE__ */ new Map();
+  const blocksNode = (0, import_core3.node)([], { name: "blocks", initial: opts.blocks ?? [] });
+  const maxWidthNode = (0, import_core3.node)([], {
+    name: "max-width",
+    initial: Math.max(0, opts.maxWidth ?? 800)
+  });
+  const gapNode = (0, import_core3.node)([], { name: "gap", initial: opts.gap ?? 0 });
+  const measuredBlocksNode = (0, import_core3.node)(
+    [blocksNode, maxWidthNode],
+    (data, actions, ctx) => {
+      const blocksVal = data[0] != null && data[0].length > 0 ? data[0].at(-1) : ctx.prevData[0];
+      const mwVal = data[1] != null && data[1].length > 0 ? data[1].at(-1) : ctx.prevData[1];
+      const t0 = (0, import_core3.monotonicNs)();
+      const result = measureBlocks(
+        blocksVal,
+        mwVal,
+        adapters,
+        measureCache,
+        defaultFont,
+        defaultLineHeight
+      );
+      const elapsed = (0, import_core3.monotonicNs)() - t0;
+      const meta = measuredBlocksNode.meta;
+      if (meta) {
+        emitToMeta(meta["block-count"], result.length);
+        emitToMeta(meta["layout-time-ns"], elapsed);
+      }
+      actions.emit(result);
+      const flush = () => {
+        measureCache.clear();
+        adapters.text.clearCache?.();
+      };
+      return { onDeactivation: flush, onInvalidate: flush };
+    },
+    {
+      name: "measured-blocks",
+      describeKind: "derived",
+      meta: { "block-count": 0, "layout-time-ns": 0 },
+      equals: (a, b) => {
+        const ma = a;
+        const mb = b;
+        if (ma == null || mb == null) return ma === mb;
+        if (ma.length !== mb.length) return false;
+        for (let i = 0; i < ma.length; i++) {
+          const ba = ma[i];
+          const bb = mb[i];
+          if (ba.type !== bb.type || ba.width !== bb.width || ba.height !== bb.height || ba.index !== bb.index)
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  const blockFlowNode = (0, import_core3.node)(
+    [measuredBlocksNode, gapNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      actions.emit(computeBlockFlow(data[0], data[1]));
+    },
+    {
+      name: "block-flow",
+      describeKind: "derived",
+      equals: (a, b) => {
+        const fa = a;
+        const fb = b;
+        if (fa == null || fb == null) return fa === fb;
+        if (fa.length !== fb.length) return false;
+        for (let i = 0; i < fa.length; i++) {
+          const pa = fa[i];
+          const pb = fb[i];
+          if (pa.x !== pb.x || pa.y !== pb.y || pa.width !== pb.width || pa.height !== pb.height)
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  const totalHeightNode = (0, import_core3.node)(
+    [blockFlowNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      actions.emit(computeTotalHeight(data[0]));
+    },
+    { describeKind: "derived", name: "total-height" }
+  );
+  g.add(blocksNode, { name: "blocks" });
+  g.add(maxWidthNode, { name: "max-width" });
+  g.add(gapNode, { name: "gap" });
+  g.add(measuredBlocksNode, { name: "measured-blocks" });
+  g.add(blockFlowNode, { name: "block-flow" });
+  g.add(totalHeightNode, { name: "total-height" });
+  return {
+    graph: g,
+    setBlocks: (blocks) => g.set("blocks", blocks),
+    setMaxWidth: (mw) => g.set("max-width", Math.max(0, mw)),
+    setGap: (gap) => g.set("gap", gap),
+    measuredBlocks: measuredBlocksNode,
+    blockFlow: blockFlowNode,
+    totalHeight: totalHeightNode
+  };
+}
+
+// src/utils/reactive-layout/reactive-flow-layout.ts
+var import_core4 = require("@graphrefly/pure-ts/core");
+var import_graph3 = require("@graphrefly/pure-ts/graph");
+function circleIntervalForBand(o, bandTop, bandBottom) {
+  const hPad = o.hPad ?? 0;
+  const vPad = o.vPad ?? 0;
+  const top = bandTop - vPad;
+  const bottom = bandBottom + vPad;
+  if (top >= o.cy + o.r || bottom <= o.cy - o.r) return null;
+  const minDy = o.cy >= top && o.cy <= bottom ? 0 : o.cy < top ? top - o.cy : o.cy - bottom;
+  if (minDy >= o.r) return null;
+  const maxDx = Math.sqrt(o.r * o.r - minDy * minDy);
+  return { left: o.cx - maxDx - hPad, right: o.cx + maxDx + hPad };
+}
+function rectIntervalForBand(o, bandTop, bandBottom) {
+  const hPad = o.hPad ?? 0;
+  const vPad = o.vPad ?? 0;
+  if (bandBottom <= o.y - vPad) return null;
+  if (bandTop >= o.y + o.h + vPad) return null;
+  return { left: o.x - hPad, right: o.x + o.w + hPad };
+}
+function obstacleIntervalForBand(o, bandTop, bandBottom) {
+  return o.kind === "circle" ? circleIntervalForBand(o, bandTop, bandBottom) : rectIntervalForBand(o, bandTop, bandBottom);
+}
+function computeFlowLines(segments, container, columns, obstacles, lineHeight, minSlotWidth, opts) {
+  const paragraphSpacing = opts?.paragraphSpacing ?? lineHeight;
+  const lines = [];
+  let cursor = { segmentIndex: 0, graphemeIndex: 0 };
+  if (segments.length === 0 || columns.count <= 0 || lineHeight <= 0) {
+    return { lines, cursor };
+  }
+  const padX = container.paddingX ?? 0;
+  const padY = container.paddingY ?? 0;
+  const availWidth = Math.max(0, container.width - padX * 2);
+  const availHeight = Math.max(0, container.height - padY * 2);
+  const gapTotal = columns.gap * Math.max(0, columns.count - 1);
+  const colWidth = Math.max(0, (availWidth - gapTotal) / columns.count);
+  if (colWidth <= 0) return { lines, cursor };
+  outerCol: for (let col = 0; col < columns.count; col++) {
+    const colLeft = padX + col * (colWidth + columns.gap);
+    const colRight = colLeft + colWidth;
+    let bandTop = padY;
+    while (bandTop + lineHeight <= padY + availHeight) {
+      const bandBottom = bandTop + lineHeight;
+      const blocked = [];
+      for (let oi = 0; oi < obstacles.length; oi++) {
+        const iv = obstacleIntervalForBand(obstacles[oi], bandTop, bandBottom);
+        if (iv !== null) blocked.push(iv);
+      }
+      const slots = carveTextLineSlots({ left: colLeft, right: colRight }, blocked, minSlotWidth);
+      if (slots.length === 0) {
+        bandTop += lineHeight;
+        continue;
+      }
+      let hardBreakThisBand = false;
+      for (let si = 0; si < slots.length; si++) {
+        const slot = slots[si];
+        const slotW = slot.right - slot.left;
+        const line = layoutNextLine(segments, cursor, slotW);
+        if (line === null) {
+          return { lines, cursor };
+        }
+        if (line.text.length === 0 && line.width === 0) {
+          cursor = line.end;
+          hardBreakThisBand = true;
+          break;
+        }
+        lines.push({
+          x: slot.left,
+          y: bandTop,
+          width: line.width,
+          slotWidth: slotW,
+          text: line.text,
+          columnIndex: col,
+          flushToRight: slot.right < colRight - 0.5
+        });
+        cursor = line.end;
+      }
+      if (hardBreakThisBand) {
+        bandTop += paragraphSpacing;
+        continue;
+      }
+      bandTop += lineHeight;
+      if (cursor.segmentIndex >= segments.length) break outerCol;
+    }
+    if (cursor.segmentIndex >= segments.length) break;
+  }
+  return { lines, cursor };
+}
+function reactiveFlowLayout(opts) {
+  const { adapter, name = "reactive-flow-layout", minSlotWidth = 20 } = opts;
+  const g = new import_graph3.Graph(name);
+  const measureCache = /* @__PURE__ */ new Map();
+  const textNode = (0, import_core4.node)([], { name: "text", initial: opts.text ?? "" });
+  const fontNode = (0, import_core4.node)([], { name: "font", initial: opts.font ?? "16px sans-serif" });
+  const lineHeightNode = (0, import_core4.node)([], { name: "line-height", initial: opts.lineHeight ?? 20 });
+  const containerNode = (0, import_core4.node)([], {
+    name: "container",
+    initial: opts.container ?? { width: 800, height: 600, paddingX: 0, paddingY: 0 }
+  });
+  const columnsNode = (0, import_core4.node)([], {
+    name: "columns",
+    initial: opts.columns ?? { count: 1, gap: 0 }
+  });
+  const obstaclesNode = (0, import_core4.node)([], { name: "obstacles", initial: opts.obstacles ?? [] });
+  const paragraphSpacingNode = (0, import_core4.node)([], {
+    name: "paragraph-spacing",
+    initial: opts.paragraphSpacing ?? null
+  });
+  const segmentsNode = (0, import_core4.node)(
+    [textNode, fontNode],
+    (data, actions, ctx) => {
+      const b0 = data[0];
+      const textVal = b0 != null && b0.length > 0 ? b0.at(-1) : ctx.prevData[0];
+      const b1 = data[1];
+      const fontVal = b1 != null && b1.length > 0 ? b1.at(-1) : ctx.prevData[1];
+      const result = analyzeAndMeasure(textVal, fontVal, adapter, measureCache);
+      actions.emit(result);
+      const flush = () => {
+        measureCache.clear();
+        adapter.clearCache?.();
+      };
+      return { onDeactivation: flush, onInvalidate: flush };
+    },
+    { name: "segments", describeKind: "derived" }
+  );
+  const flowLinesNode = (0, import_core4.node)(
+    [segmentsNode, containerNode, columnsNode, obstaclesNode, lineHeightNode, paragraphSpacingNode],
+    (batchData, actions, ctx) => {
+      const data = batchData.map(
+        (batch, i) => batch != null && batch.length > 0 ? batch.at(-1) : ctx.prevData[i]
+      );
+      const segments = data[0];
+      const t0 = (0, import_core4.monotonicNs)();
+      const effectiveSpacing = data[5] ?? data[4];
+      const { lines: result, cursor } = computeFlowLines(
+        segments,
+        data[1],
+        data[2],
+        data[3],
+        data[4],
+        minSlotWidth,
+        { paragraphSpacing: effectiveSpacing }
+      );
+      const elapsed = (0, import_core4.monotonicNs)() - t0;
+      const overflow = Math.max(0, segments.length - cursor.segmentIndex);
+      const meta = flowLinesNode.meta;
+      if (meta) {
+        emitToMeta(meta["line-count"], result.length);
+        emitToMeta(meta["layout-time-ns"], elapsed);
+        emitToMeta(meta["overflow-segments"], overflow);
+      }
+      actions.emit(result);
+    },
+    {
+      describeKind: "derived",
+      name: "flow-lines",
+      meta: {
+        "line-count": 0,
+        "layout-time-ns": 0,
+        "overflow-segments": 0
+      },
+      equals: (a, b) => {
+        const la = a;
+        const lb = b;
+        if (la.length !== lb.length) return false;
+        for (let i = 0; i < la.length; i++) {
+          const pa = la[i];
+          const pb = lb[i];
+          if (pa.x !== pb.x || pa.y !== pb.y || pa.width !== pb.width || pa.slotWidth !== pb.slotWidth || pa.text !== pb.text || pa.columnIndex !== pb.columnIndex || pa.flushToRight !== pb.flushToRight)
+            return false;
+        }
+        return true;
+      }
+    }
+  );
+  g.add(textNode, { name: "text" });
+  g.add(fontNode, { name: "font" });
+  g.add(lineHeightNode, { name: "line-height" });
+  g.add(containerNode, { name: "container" });
+  g.add(columnsNode, { name: "columns" });
+  g.add(obstaclesNode, { name: "obstacles" });
+  g.add(paragraphSpacingNode, { name: "paragraph-spacing" });
+  g.add(segmentsNode, { name: "segments" });
+  g.add(flowLinesNode, { name: "flow-lines" });
+  return {
+    graph: g,
+    setText: (t) => g.set("text", t),
+    setFont: (f) => g.set("font", f),
+    setLineHeight: (lh) => g.set("line-height", lh),
+    setContainer: (c) => g.set("container", c),
+    setColumns: (c) => g.set("columns", c),
+    setObstacles: (o) => g.set("obstacles", o),
+    setParagraphSpacing: (ps) => g.set("paragraph-spacing", ps),
+    segments: segmentsNode,
+    flowLines: flowLinesNode
+  };
+}
+//# sourceMappingURL=index.cjs.map