@vectojs/core 1.20.0 → 1.22.0

package/dist/{chunk-YLH7F4ZV.js → chunk-AGP4VLF4.js}

@@ -964,6 +964,38 @@ var Entity = (_class2 = class {
    *
    * @returns The {@link A11yAttributes} for this entity's shadow node.
    */
+  /**
+   * Describe this entity's own debug surface for DevTools.
+   *
+   * Returns `null` by default, meaning "nothing beyond the generic `Entity`
+   * fields the inspector already shows". Override in a component to expose the
+   * state that makes it inspectable — see {@link DevtoolsDescriptor}.
+   *
+   * Called only while a panel is inspecting this entity, never per frame, so it
+   * may compute values that would be too expensive to track continuously.
+   *
+   * @returns A descriptor, or `null` to opt out.
+   */
+  getDevtoolsDescriptor() {
+    return null;
+  }
+  /**
+   * Which of a child's properties this entity computes during layout.
+   *
+   * Returns an empty array by default, meaning "this entity does not position its
+   * children". A container that lays out children — `Stack`, `Table`, `Tabs` —
+   * overrides it so tooling can mark those values as parent-owned: editing `x` on
+   * a `Stack` child is reverted by the next layout, and knowing that in advance is
+   * the difference between a confusing tool and a correct one.
+   *
+   * @param child - The child being asked about. Containers whose control depends
+   *   on the child (a `Table` cell versus its header) can answer per child.
+   * @returns Property names this entity overwrites on that child.
+   */
+  getLayoutControlledProperties(child) {
+    void child;
+    return [];
+  }
   getA11yAttributes() {
     return {};
   }

package/dist/{chunk-TJCXB2F6.mjs → chunk-FRMLD4PP.mjs}

@@ -962,6 +962,38 @@ var Entity = class {
    *
    * @returns The {@link A11yAttributes} for this entity's shadow node.
    */
+  /**
+   * Describe this entity's own debug surface for DevTools.
+   *
+   * Returns `null` by default, meaning "nothing beyond the generic `Entity`
+   * fields the inspector already shows". Override in a component to expose the
+   * state that makes it inspectable — see {@link DevtoolsDescriptor}.
+   *
+   * Called only while a panel is inspecting this entity, never per frame, so it
+   * may compute values that would be too expensive to track continuously.
+   *
+   * @returns A descriptor, or `null` to opt out.
+   */
+  getDevtoolsDescriptor() {
+    return null;
+  }
+  /**
+   * Which of a child's properties this entity computes during layout.
+   *
+   * Returns an empty array by default, meaning "this entity does not position its
+   * children". A container that lays out children — `Stack`, `Table`, `Tabs` —
+   * overrides it so tooling can mark those values as parent-owned: editing `x` on
+   * a `Stack` child is reverted by the next layout, and knowing that in advance is
+   * the difference between a confusing tool and a correct one.
+   *
+   * @param child - The child being asked about. Containers whose control depends
+   *   on the child (a `Table` cell versus its header) can answer per child.
+   * @returns Property names this entity overwrites on that child.
+   */
+  getLayoutControlledProperties(child) {
+    void child;
+    return [];
+  }
   getA11yAttributes() {
     return {};
   }

package/dist/{chunk-L4SWVP2H.js → chunk-LHONR3GO.js}

@@ -1,6 +1,21 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3; var _class4;const __vecto_cjs_url=require("url").pathToFileURL(__filename).href;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3; var _class4; var _class5;const __vecto_cjs_url=require("url").pathToFileURL(__filename).href;
 
 // src/renderer/CanvasRenderer.ts
+function emptyDrawCounters() {
+  return {
+    fills: 0,
+    strokes: 0,
+    texts: 0,
+    images: 0,
+    circles: 0,
+    flushes: 0,
+    saves: 0,
+    restores: 0,
+    clips: 0,
+    stateSwitches: 0,
+    overdrawRatio: 0
+  };
+}
 var TWO_PI = Math.PI * 2;
 function getDevicePixelRatio() {
   return typeof window !== "undefined" ? window.devicePixelRatio || 1 : 1;
@@ -41,6 +56,17 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   __init6() {this.batchCount = 0}
   __init7() {this._cachedFont = ""}
   __init8() {this._cachedFill = ""}
+  /** Backend discriminator; see {@link IRenderer.kind}. */
+  __init9() {this.kind = "canvas2d"}
+  /**
+   * Draw counters, allocated only once counting is enabled.
+   *
+   * Null when off, so the guard on every op is a single null test and an inactive
+   * renderer carries no counter object at all.
+   */
+  __init10() {this.counters = null}
+  /** Accumulated primitive area, kept separately so the ratio is derived on read. */
+  __init11() {this.drawnArea = 0}
   /**
    * @param canvas - The target canvas. Its backing store is resized to the
    *   logical size × devicePixelRatio.
@@ -50,7 +76,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
    *   set) so the canvas's own dimensions aren't clobbered by the window's.
    * @param maxDPR - See {@link maxDPR}.
    */
-  constructor(canvas, size, maxDPR) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);
+  constructor(canvas, size, maxDPR) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);_class.prototype.__init9.call(this);_class.prototype.__init10.call(this);_class.prototype.__init11.call(this);
     this.maxDPR = maxDPR;
     const dpr = this.effectiveDPR();
     this.width = _nullishCoalesce(_optionalChain([size, 'optionalAccess', _ => _.width]), () => ( (typeof window !== "undefined" ? window.innerWidth : canvas.width || 0)));
@@ -137,19 +163,47 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
     return this.contextLost;
   }
   /** @inheritdoc */
+  /** @inheritdoc */
+  setDrawCounters(enabled) {
+    if (!enabled) {
+      this.counters = null;
+      this.drawnArea = 0;
+      return;
+    }
+    if (!this.counters) this.counters = emptyDrawCounters();
+  }
+  /** @inheritdoc */
+  getDrawCounters() {
+    if (!this.counters) return null;
+    const area = this.width * this.height;
+    return {
+      ...this.counters,
+      // Derived on read rather than maintained: the ratio is only meaningful
+      // against the current surface size, which can change under resize.
+      overdrawRatio: area > 0 ? Math.round(this.drawnArea / area * 100) / 100 : 0
+    };
+  }
+  /** @inheritdoc */
+  clearDrawCounters() {
+    if (this.counters) this.counters = emptyDrawCounters();
+    this.drawnArea = 0;
+  }
   clear() {
     if (this.contextLost) return;
     this.flush();
+    if (this.counters) this.drawnArea = 0;
     this.ctx.clearRect(0, 0, this.width, this.height);
   }
   /** @inheritdoc */
   save() {
     this.flush();
+    if (this.counters) this.counters.saves++;
     this.ctx.save();
   }
   /** @inheritdoc */
   restore() {
     this.flush();
+    if (this.counters) this.counters.restores++;
     this.ctx.restore();
     this._cachedFont = "";
     this._cachedFill = "";
@@ -173,6 +227,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   clip(x, y, width, height) {
     this.flush();
+    if (this.counters) this.counters.clips++;
     this.ctx.beginPath();
     this.ctx.rect(x, y, width, height);
     this.ctx.clip();
@@ -209,9 +264,22 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   drawImage(source, dx, dy, dw, dh) {
     this.flush();
+    if (this.counters) {
+      this.counters.images++;
+      this.drawnArea += Math.abs(dw * dh);
+    }
     this.ctx.drawImage(source, dx, dy, dw, dh);
   }
   /** @inheritdoc */
+  drawImageRect(source, sx, sy, sw, sh, dx, dy, dw, dh) {
+    this.flush();
+    if (this.counters) {
+      this.counters.images++;
+      this.drawnArea += Math.abs(dw * dh);
+    }
+    this.ctx.drawImage(source, sx, sy, sw, sh, dx, dy, dw, dh);
+  }
+  /** @inheritdoc */
   fillCircle(cx, cy, radius, color, alpha = 1) {
     if (this.batchActive && (color !== this.batchColor || alpha !== this.batchAlpha)) {
       this.flush();
@@ -222,6 +290,10 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
       this.batchColor = color;
       this.batchAlpha = alpha;
     }
+    if (this.counters) {
+      this.counters.circles++;
+      this.drawnArea += Math.PI * radius * radius;
+    }
     this.ctx.moveTo(cx + radius, cy);
     this.ctx.arc(cx, cy, radius, 0, TWO_PI);
     this.batchCount++;
@@ -230,6 +302,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   flush() {
     if (!this.batchActive) return;
+    if (this.counters) this.counters.flushes++;
     this.ctx.globalAlpha = this.batchAlpha;
     this.ctx.fillStyle = this.batchColor;
     this.ctx.fill();
@@ -240,7 +313,9 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   fill(color) {
     this.flush();
+    if (this.counters) this.counters.fills++;
     if (this._cachedFill !== color) {
+      if (this.counters) this.counters.stateSwitches++;
       this.ctx.fillStyle = color;
       this._cachedFill = color;
     }
@@ -249,6 +324,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   stroke(color, lineWidth = 1) {
     this.flush();
+    if (this.counters) this.counters.strokes++;
     this.ctx.strokeStyle = color;
     this.ctx.lineWidth = lineWidth;
     this.ctx.lineCap = "round";
@@ -258,11 +334,14 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   /** @inheritdoc */
   fillText(text, x, y, font, color) {
     this.flush();
+    if (this.counters) this.counters.texts++;
     if (this._cachedFont !== font) {
+      if (this.counters) this.counters.stateSwitches++;
       this.ctx.font = font;
       this._cachedFont = font;
     }
     if (this._cachedFill !== color) {
+      if (this.counters) this.counters.stateSwitches++;
       this.ctx.fillStyle = color;
       this._cachedFill = color;
     }
@@ -373,41 +452,43 @@ function fontFamilyFromShorthand(font, sizeToken) {
   return family || "sans-serif";
 }
 var SVGRenderer = (_class2 = class {
+  /** Backend discriminator; see {@link IRenderer.kind}. */
+  __init12() {this.kind = "svg"}
   
   
-  __init9() {this.buffer = []}
-  __init10() {this.defsBuffer = []}
-  __init11() {this.currentPath = []}
+  __init13() {this.buffer = []}
+  __init14() {this.defsBuffer = []}
+  __init15() {this.currentPath = []}
   // Inline matrix states (3x3 representation)
   // [a, b, c, d, e, f] corresponding to:
   // | a c e |
   // | b d f |
   // | 0 0 1 |
-  __init12() {this.mStack = []}
-  __init13() {this.ma = 1}
-  __init14() {this.mb = 0}
-  __init15() {this.mc = 0}
-  __init16() {this.md = 1}
-  __init17() {this.me = 0}
-  __init18() {this.mf = 0}
+  __init16() {this.mStack = []}
+  __init17() {this.ma = 1}
+  __init18() {this.mb = 0}
+  __init19() {this.mc = 0}
+  __init20() {this.md = 1}
+  __init21() {this.me = 0}
+  __init22() {this.mf = 0}
   // Alpha stack
-  __init19() {this.alphaStack = []}
-  __init20() {this.globalAlpha = 1}
+  __init23() {this.alphaStack = []}
+  __init24() {this.globalAlpha = 1}
   // Clipping stack
-  __init21() {this.clipDepthStack = []}
-  __init22() {this.clipDepth = 0}
-  __init23() {this.clipCounter = 0}
+  __init25() {this.clipDepthStack = []}
+  __init26() {this.clipDepth = 0}
+  __init27() {this.clipCounter = 0}
   // uniquely identifies clipPaths
   // Batch circles states (local coordinates)
-  __init24() {this.batchCircles = []}
-  __init25() {this.batchMatrix = [1, 0, 0, 1, 0, 0]}
-  __init26() {this.batchColor = ""}
-  __init27() {this.batchAlpha = 1}
-  __init28() {this.batchActive = false}
+  __init28() {this.batchCircles = []}
+  __init29() {this.batchMatrix = [1, 0, 0, 1, 0, 0]}
+  __init30() {this.batchColor = ""}
+  __init31() {this.batchAlpha = 1}
+  __init32() {this.batchActive = false}
   // Cache for generated gradient defs
-  __init29() {this.gradientCounter = 0}
-  __init30() {this.gradientCache = /* @__PURE__ */ new Map()}
-  constructor(width, height) {;_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);_class2.prototype.__init16.call(this);_class2.prototype.__init17.call(this);_class2.prototype.__init18.call(this);_class2.prototype.__init19.call(this);_class2.prototype.__init20.call(this);_class2.prototype.__init21.call(this);_class2.prototype.__init22.call(this);_class2.prototype.__init23.call(this);_class2.prototype.__init24.call(this);_class2.prototype.__init25.call(this);_class2.prototype.__init26.call(this);_class2.prototype.__init27.call(this);_class2.prototype.__init28.call(this);_class2.prototype.__init29.call(this);_class2.prototype.__init30.call(this);
+  __init33() {this.gradientCounter = 0}
+  __init34() {this.gradientCache = /* @__PURE__ */ new Map()}
+  constructor(width, height) {;_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);_class2.prototype.__init16.call(this);_class2.prototype.__init17.call(this);_class2.prototype.__init18.call(this);_class2.prototype.__init19.call(this);_class2.prototype.__init20.call(this);_class2.prototype.__init21.call(this);_class2.prototype.__init22.call(this);_class2.prototype.__init23.call(this);_class2.prototype.__init24.call(this);_class2.prototype.__init25.call(this);_class2.prototype.__init26.call(this);_class2.prototype.__init27.call(this);_class2.prototype.__init28.call(this);_class2.prototype.__init29.call(this);_class2.prototype.__init30.call(this);_class2.prototype.__init31.call(this);_class2.prototype.__init32.call(this);_class2.prototype.__init33.call(this);_class2.prototype.__init34.call(this);
     this.width = width;
     this.height = height;
   }
@@ -1225,6 +1306,12 @@ function createWebGLPointRenderer(canvas) {
   let spriteCount = 0;
   let glyphData = new Float32Array(FLOATS_PER_SPRITE_VERT * VERTS_PER_QUAD * 1024);
   let glyphCount = 0;
+  let frameDrawCalls = 0;
+  let lastFrameDrawCalls = 0;
+  let totalDrawCalls = 0;
+  let atlasSwitches = 0;
+  let circleQuadFallbacks = 0;
+  let circlePoints = 0;
   let circleQuadData = new Float32Array(FLOATS_PER_SPRITE_VERT * VERTS_PER_QUAD * 64);
   let circleQuadCount = 0;
   let logicalW = 0;
@@ -1247,6 +1334,7 @@ function createWebGLPointRenderer(canvas) {
     gl.uniform1f(gURange, distanceRange);
     ensureQuadIndices(glyphCount);
     gl.drawElements(gl.TRIANGLES, glyphCount * INDICES_PER_QUAD, gl.UNSIGNED_INT, 0);
+    frameDrawCalls++;
     gl.bindVertexArray(null);
     glyphCount = 0;
   };
@@ -1263,7 +1351,23 @@ function createWebGLPointRenderer(canvas) {
       canvas.style.height = `${height}px`;
       gl.viewport(0, 0, canvas.width, canvas.height);
     },
+    stats() {
+      return {
+        drawCalls: lastFrameDrawCalls,
+        totalDrawCalls,
+        atlasSwitches,
+        // Fixed at creation: five programs compiled once, never per frame, so
+        // these are capability facts rather than counters.
+        programs: 5,
+        textures: (texture ? 1 : 0) + (msdfTexture ? 1 : 0),
+        circleQuadFallbacks,
+        circlePoints
+      };
+    },
     begin() {
+      lastFrameDrawCalls = frameDrawCalls;
+      totalDrawCalls += frameDrawCalls;
+      frameDrawCalls = 0;
       pointCount = 0;
       rectCount = 0;
       spriteCount = 0;
@@ -1316,6 +1420,7 @@ function createWebGLPointRenderer(canvas) {
         distanceRange = range;
         return;
       }
+      atlasSwitches++;
       drawGlyphs();
       distanceRange = range;
       if (!msdfTexture) {
@@ -1358,6 +1463,7 @@ function createWebGLPointRenderer(canvas) {
     addCircle(x, y, radius, color, alpha = 1) {
       const needsQuad = logicalW > 0 && (x < radius || y < radius || x > logicalW - radius || y > logicalH - radius) || radius * 2 * dpr > maxPointSize;
       if (needsQuad) {
+        circleQuadFallbacks++;
         const stride = FLOATS_PER_SPRITE_VERT * VERTS_PER_QUAD;
         circleQuadData = grow(circleQuadData, (circleQuadCount + 1) * stride);
         const rgba = parseColorToRGBA(color);
@@ -1382,6 +1488,7 @@ function createWebGLPointRenderer(canvas) {
         circleQuadCount++;
         return;
       }
+      circlePoints++;
       pointData = grow(pointData, (pointCount + 1) * FLOATS_PER_POINT);
       const [r, g, b, a] = parseColorToRGBA(color);
       const o = pointCount * FLOATS_PER_POINT;
@@ -1423,6 +1530,7 @@ function createWebGLPointRenderer(canvas) {
         gl.uniform2f(rURes, logicalW, logicalH);
         ensureQuadIndices(rectCount);
         gl.drawElements(gl.TRIANGLES, rectCount * INDICES_PER_QUAD, gl.UNSIGNED_INT, 0);
+        frameDrawCalls++;
       }
       if (pointCount > 0) {
         gl.useProgram(pointProgram);
@@ -1436,6 +1544,7 @@ function createWebGLPointRenderer(canvas) {
         gl.uniform2f(pURes, logicalW, logicalH);
         gl.uniform1f(pUDpr, dpr);
         gl.drawArrays(gl.POINTS, 0, pointCount);
+        frameDrawCalls++;
       }
       if (circleQuadCount > 0) {
         const floats = circleQuadCount * VERTS_PER_QUAD * FLOATS_PER_SPRITE_VERT;
@@ -1446,6 +1555,7 @@ function createWebGLPointRenderer(canvas) {
         gl.uniform2f(cURes, logicalW, logicalH);
         ensureQuadIndices(circleQuadCount);
         gl.drawElements(gl.TRIANGLES, circleQuadCount * INDICES_PER_QUAD, gl.UNSIGNED_INT, 0);
+        frameDrawCalls++;
       }
       if (spriteCount > 0 && texture) {
         const floats = spriteCount * VERTS_PER_QUAD * FLOATS_PER_SPRITE_VERT;
@@ -1459,6 +1569,7 @@ function createWebGLPointRenderer(canvas) {
         gl.uniform2f(sURes, logicalW, logicalH);
         ensureQuadIndices(spriteCount);
         gl.drawElements(gl.TRIANGLES, spriteCount * INDICES_PER_QUAD, gl.UNSIGNED_INT, 0);
+        frameDrawCalls++;
       }
       gl.bindVertexArray(null);
       drawGlyphs();
@@ -1664,11 +1775,11 @@ fn fs_main(in: VertexOutput) -> @location(0) vec4<f32> {
 `;
 var WebGPUParticleSystemManager = (_class3 = class {
   
-  __init31() {this.computePipeline = null}
-  __init32() {this.renderPipeline = null}
-  __init33() {this.computeBindGroupLayout = null}
-  __init34() {this.renderBindGroupLayout = null}
-  constructor(device) {;_class3.prototype.__init31.call(this);_class3.prototype.__init32.call(this);_class3.prototype.__init33.call(this);_class3.prototype.__init34.call(this);
+  __init35() {this.computePipeline = null}
+  __init36() {this.renderPipeline = null}
+  __init37() {this.computeBindGroupLayout = null}
+  __init38() {this.renderBindGroupLayout = null}
+  constructor(device) {;_class3.prototype.__init35.call(this);_class3.prototype.__init36.call(this);_class3.prototype.__init37.call(this);_class3.prototype.__init38.call(this);
     this.device = device;
   }
   initPipelines(format) {
@@ -1809,15 +1920,201 @@ var WebGPUParticleSystemManager = (_class3 = class {
   }
 }, _class3);
 
+// src/renderer/GlyphRasterAtlas.ts
+var HARD_MAX_SIZE = 8192;
+var PAD = 2;
+var GlyphRasterAtlas = (_class4 = class {
+  __init39() {this.slots = /* @__PURE__ */ new Map()}
+  
+  
+  __init40() {this.canvas = null}
+  __init41() {this.ctx = null}
+  /**
+   * Shelf packing: glyphs land left-to-right on a row, then a new row starts.
+   * A monospace grid produces near-uniform widths, so shelves waste very little
+   * and cost one comparison per insert — a real 2D packer would buy nothing here.
+   */
+  __init42() {this.penX = PAD}
+  __init43() {this.penY = PAD}
+  __init44() {this.rowHeight = 0}
+  __init45() {this._hits = 0}
+  __init46() {this._misses = 0}
+  __init47() {this._resets = 0}
+  constructor(options = {}) {;_class4.prototype.__init39.call(this);_class4.prototype.__init40.call(this);_class4.prototype.__init41.call(this);_class4.prototype.__init42.call(this);_class4.prototype.__init43.call(this);_class4.prototype.__init44.call(this);_class4.prototype.__init45.call(this);_class4.prototype.__init46.call(this);_class4.prototype.__init47.call(this);
+    this.dpr = Math.max(1, _nullishCoalesce(options.dpr, () => ( 1)));
+    this.maxSize = Math.min(HARD_MAX_SIZE, Math.max(256, _nullishCoalesce(options.maxSize, () => ( 2048))));
+  }
+  /** Live instrumentation snapshot. */
+  get stats() {
+    return {
+      hits: this._hits,
+      misses: this._misses,
+      size: this.slots.size,
+      resets: this._resets
+    };
+  }
+  /**
+   * The atlas canvas, to pass as the blit source.
+   *
+   * `null` until the first successful {@link get}, and in any non-DOM context.
+   */
+  get source() {
+    return this.canvas;
+  }
+  ensureCanvas() {
+    if (this.ctx) return true;
+    if (typeof document === "undefined") return false;
+    const canvas = document.createElement("canvas");
+    canvas.width = this.maxSize;
+    canvas.height = this.maxSize;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return false;
+    this.canvas = canvas;
+    this.ctx = ctx;
+    return true;
+  }
+  /**
+   * Look up a glyph, rasterizing it into the atlas on first request.
+   *
+   * @param font - Full CSS `font` shorthand, used for measuring and painting.
+   * @param color - CSS color baked into the pixels.
+   * @param glyph - A single grapheme cluster. Long strings are rejected
+   *   (`null`): they defeat the atlas's fixed-slot packing and belong in
+   *   `fillText` or {@link TextRasterCache}.
+   * @returns The slot, or `null` when the caller must fall back to `fillText`
+   *   (headless, unrasterizable, or too large to pack).
+   */
+  get(font, color, glyph) {
+    const key = font + "\0" + color + "\0" + glyph;
+    const existing = this.slots.get(key);
+    if (existing !== void 0) {
+      if (existing) this._hits++;
+      return existing;
+    }
+    this._misses++;
+    if (glyph.length === 0 || glyph.length > 8) {
+      this.slots.set(key, null);
+      return null;
+    }
+    if (!this.ensureCanvas()) return null;
+    const ctx = this.ctx;
+    ctx.font = font;
+    const metrics = ctx.measureText(glyph);
+    const advance = metrics.width;
+    const ascent = metrics.actualBoundingBoxAscent || metrics.fontBoundingBoxAscent || advance * 0.9;
+    const descent = metrics.actualBoundingBoxDescent || metrics.fontBoundingBoxDescent || advance * 0.25;
+    const left = metrics.actualBoundingBoxLeft || 0;
+    const right = metrics.actualBoundingBoxRight || advance;
+    const offsetX = Math.ceil(left) + PAD;
+    const offsetY = Math.ceil(ascent) + PAD;
+    const w = offsetX + Math.ceil(right) + PAD;
+    const h = offsetY + Math.ceil(descent) + PAD;
+    if (!(w > 0) || !(h > 0)) {
+      this.slots.set(key, null);
+      return null;
+    }
+    const dpr = this.dpr;
+    const dw = Math.ceil(w * dpr);
+    const dh = Math.ceil(h * dpr);
+    if (dw + PAD * 2 > this.maxSize || dh + PAD * 2 > this.maxSize) {
+      this.slots.set(key, null);
+      return null;
+    }
+    if (this.penX + dw + PAD > this.maxSize) {
+      this.penX = PAD;
+      this.penY += this.rowHeight + PAD;
+      this.rowHeight = 0;
+    }
+    if (this.penY + dh + PAD > this.maxSize) {
+      this.reset();
+      if (!this.ensureCanvas()) return null;
+      this.ctx.font = font;
+    }
+    const sx = this.penX;
+    const sy = this.penY;
+    const c = this.ctx;
+    c.save();
+    c.translate(sx, sy);
+    if (dpr !== 1) c.scale(dpr, dpr);
+    c.font = font;
+    c.textBaseline = "alphabetic";
+    c.fillStyle = color;
+    c.fillText(glyph, offsetX, offsetY);
+    c.restore();
+    this.penX += dw + PAD;
+    if (dh > this.rowHeight) this.rowHeight = dh;
+    const slot = {
+      sx,
+      sy,
+      sw: dw,
+      sh: dh,
+      w,
+      h,
+      offsetX,
+      offsetY,
+      glyph,
+      font,
+      advance,
+      left,
+      right
+    };
+    this.slots.set(key, slot);
+    return slot;
+  }
+  /**
+   * Find the slot occupying a source position, or `null`.
+   *
+   * The inverse of {@link get}: it maps a blit back to the glyph it drew. Exists
+   * for instrumentation — a test or devtool that traces `drawImage` calls sees
+   * only a source rect, and needs this to recover which cluster was painted and
+   * with what metrics. Linear over resident slots, so it is a diagnostic, not a
+   * per-frame call.
+   */
+  slotAt(sx, sy) {
+    for (const slot of this.slots.values()) {
+      if (slot && slot.sx === sx && slot.sy === sy) return slot;
+    }
+    return null;
+  }
+  /**
+   * Drop every glyph and reuse the canvas.
+   *
+   * Call after a font or theme change: slots are keyed by `(font, color, glyph)`
+   * so stale entries are never *returned* wrongly, but they do occupy space.
+   */
+  reset() {
+    this.slots.clear();
+    this.penX = PAD;
+    this.penY = PAD;
+    this.rowHeight = 0;
+    this._resets++;
+    if (this.ctx && this.canvas) {
+      this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+    }
+  }
+  /** Release the backing canvas and all slots. */
+  destroy() {
+    this.slots.clear();
+    this.canvas = null;
+    this.ctx = null;
+    this.penX = PAD;
+    this.penY = PAD;
+    this.rowHeight = 0;
+    this._hits = 0;
+    this._misses = 0;
+    this._resets = 0;
+  }
+}, _class4);
+
 // src/renderer/TextRasterCache.ts
-var TextRasterCache = (_class4 = class {
-  __init35() {this.cache = /* @__PURE__ */ new Map()}
+var TextRasterCache = (_class5 = class {
+  __init48() {this.cache = /* @__PURE__ */ new Map()}
   
   
-  __init36() {this.scratchCtx = null}
-  __init37() {this._hits = 0}
-  __init38() {this._misses = 0}
-  constructor(options = {}) {;_class4.prototype.__init35.call(this);_class4.prototype.__init36.call(this);_class4.prototype.__init37.call(this);_class4.prototype.__init38.call(this);
+  __init49() {this.scratchCtx = null}
+  __init50() {this._hits = 0}
+  __init51() {this._misses = 0}
+  constructor(options = {}) {;_class5.prototype.__init48.call(this);_class5.prototype.__init49.call(this);_class5.prototype.__init50.call(this);_class5.prototype.__init51.call(this);
     this.maxEntries = Math.max(1, _nullishCoalesce(options.maxEntries, () => ( 4096)));
     this.dpr = Math.max(1, _nullishCoalesce(options.dpr, () => ( 1)));
   }
@@ -1892,7 +2189,8 @@ var TextRasterCache = (_class4 = class {
     this._hits = 0;
     this._misses = 0;
   }
-}, _class4);
+}, _class5);
+
 
 
 
@@ -1903,4 +2201,4 @@ var TextRasterCache = (_class4 = class {
 
 
 
-exports.CanvasRenderer = CanvasRenderer; exports.sanitizeUrl = sanitizeUrl; exports.isSafeUrl = isSafeUrl; exports.SVGRenderer = SVGRenderer; exports.parseColorToRGBA = parseColorToRGBA; exports.createWebGLPointRenderer = createWebGLPointRenderer; exports.WebGPUParticleSystemManager = WebGPUParticleSystemManager; exports.TextRasterCache = TextRasterCache;
+exports.CanvasRenderer = CanvasRenderer; exports.sanitizeUrl = sanitizeUrl; exports.isSafeUrl = isSafeUrl; exports.SVGRenderer = SVGRenderer; exports.parseColorToRGBA = parseColorToRGBA; exports.createWebGLPointRenderer = createWebGLPointRenderer; exports.WebGPUParticleSystemManager = WebGPUParticleSystemManager; exports.GlyphRasterAtlas = GlyphRasterAtlas; exports.TextRasterCache = TextRasterCache;