@vectojs/core 0.2.5 → 0.2.7

package/dist/index.mjs

@@ -3,7 +3,7 @@ import {
   LayoutResultBuffer,
   computeLineSegments,
   createCanvasMeasurer
-} from "./chunk-SB3SCWLT.mjs";
+} from "./chunk-SSOP3F5F.mjs";
 import {
   CanvasRenderer,
   SVGRenderer,
@@ -12,7 +12,7 @@ import {
   isSafeUrl,
   parseColorToRGBA,
   sanitizeUrl
-} from "./chunk-WEQRBXT2.mjs";
+} from "./chunk-HVJHXIKW.mjs";
 import {
   Easing,
   Entity,
@@ -24,12 +24,12 @@ import {
   TweenDriver,
   VectoJSEvent,
   isTweenConfig
-} from "./chunk-P6MDWIEX.mjs";
+} from "./chunk-YVN3PJRC.mjs";
 import {
   ArabicShaper,
   BidiResolver,
   LayoutWorkerManager
-} from "./chunk-B3Z3JEJH.mjs";
+} from "./chunk-STWPTWO4.mjs";
 
 // src/tree/ComputeParticleEntity.ts
 var PARTICLE_STRIDE_FLOATS = 8;
@@ -296,6 +296,11 @@ var ComputeParticleEntity = class extends Entity {
 
 // src/tree/Scene.ts
 var REDUCED_MOTION_FPS = 30;
+function parseInlinePx(value) {
+  if (!value || !value.endsWith("px")) return null;
+  const n = parseFloat(value);
+  return Number.isFinite(n) && n > 0 ? n : null;
+}
 var Scene = class _Scene {
   static webglCreator = null;
   static webgpuManagerClass = null;
@@ -350,6 +355,9 @@ var Scene = class _Scene {
   // server-side (e.g. headless layout / vector export) without jsdom.
   a11yRoot;
   a11yElements = /* @__PURE__ */ new Map();
+  /** DOM nodes mirroring static text content, keyed by entity id. */
+  contentElements = /* @__PURE__ */ new Map();
+  contentProjectionEnabled = true;
   resizeHandler;
   focusedA11yElement = null;
   caretBlinkTimer = null;
@@ -386,6 +394,8 @@ var Scene = class _Scene {
   initializingWebGPU = false;
   gpuCanvas = null;
   gpuContext = null;
+  /** True while the GPU canvas holds a presented particle frame (needs clearing when they leave). */
+  gpuHasContent = false;
   mouseX = -9999;
   mouseY = -9999;
   pointerMoveListener = null;
@@ -396,8 +406,10 @@ var Scene = class _Scene {
     this.debugA11y = options.debugA11y ?? false;
     this.disableWindowResize = options.disableWindowResize ?? false;
     if (this.disableWindowResize) {
-      this.width = canvas.width || canvas.clientWidth || 0;
-      this.height = canvas.height || canvas.clientHeight || 0;
+      const styleWidth = parseInlinePx(canvas.style?.width);
+      const styleHeight = parseInlinePx(canvas.style?.height);
+      this.width = styleWidth ?? (canvas.width || canvas.clientWidth || 0);
+      this.height = styleHeight ?? (canvas.height || canvas.clientHeight || 0);
     } else {
       this.width = typeof window !== "undefined" ? window.innerWidth : canvas.clientWidth || canvas.width || 800;
       this.height = typeof window !== "undefined" ? window.innerHeight : canvas.clientHeight || canvas.height || 600;
@@ -409,6 +421,7 @@ var Scene = class _Scene {
     this.autoThrottle = options.autoThrottle ?? true;
     this.particleBackend = options.particleBackend ?? "auto";
     this.a11ySyncInterval = options.a11ySyncInterval ?? 0;
+    this.contentProjectionEnabled = options.contentProjection ?? true;
     this.reducedMotionQuery = typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)") : null;
     this.root = new class RootEntity extends Entity {
       isPointInside() {
@@ -430,7 +443,10 @@ var Scene = class _Scene {
     if (options.renderer) {
       this.renderer = options.renderer;
     } else {
-      this.renderer = new CanvasRenderer(canvas);
+      this.renderer = new CanvasRenderer(
+        canvas,
+        this.disableWindowResize ? { width: this.width, height: this.height } : void 0
+      );
     }
     if (typeof document !== "undefined") {
       this.a11yRoot = document.createElement("div");
@@ -559,6 +575,11 @@ var Scene = class _Scene {
    * @param entity - The subtree whose shadow nodes should be removed.
    */
   detachA11y(entity) {
+    const contentEl = this.contentElements.get(entity.id);
+    if (contentEl) {
+      contentEl.remove();
+      this.contentElements.delete(entity.id);
+    }
     this.removeA11yRecursively(entity);
   }
   /**
@@ -605,6 +626,8 @@ var Scene = class _Scene {
     this.a11yRoot?.remove();
     this.portalRoot?.remove();
     this.a11yElements.clear();
+    for (const el of this.contentElements.values()) el.remove();
+    this.contentElements.clear();
     this.pointRenderer?.destroy();
     this.renderer.dispose?.();
     this.glCanvas?.remove();
@@ -619,6 +642,10 @@ var Scene = class _Scene {
       this.manager.destroy();
       this.manager = null;
     }
+    if (this.device) {
+      this.device.destroy?.();
+      this.device = null;
+    }
   }
   setupEvents() {
     if (typeof window !== "undefined" && !this.disableWindowResize) {
@@ -963,11 +990,96 @@ var Scene = class _Scene {
         el.style.transform = `matrix(${a}, ${b}, ${c}, ${d}, 0, 0)`;
       }
     }
+    this.syncContentProjection(node);
     for (const child of node.children) this.syncA11y(child);
     if (node === this.root) {
       for (const overlay of this.overlayRoot.children) this.syncA11y(overlay);
     }
   }
+  /**
+   * Mirror one entity's static text ({@link Entity.getContentProjection}) as a
+   * transparent DOM node positioned over the drawn glyphs. Runs on the a11y
+   * sync cadence; all writes are dirty-checked. Off-viewport projections are
+   * hidden (`display: none`) so text-heavy scenes only materialize what is
+   * visible to the browser's text machinery anyway.
+   */
+  syncContentProjection(node) {
+    if (!this.contentProjectionEnabled || !this.a11yRoot) return;
+    const projection = node.getContentProjection();
+    let el = this.contentElements.get(node.id);
+    if (!projection || !projection.text) {
+      if (el) {
+        el.remove();
+        this.contentElements.delete(node.id);
+      }
+      return;
+    }
+    if (!el) {
+      el = document.createElement("div");
+      el.setAttribute("data-vecto-content", node.id);
+      const s = el.style;
+      s.position = "absolute";
+      s.transformOrigin = "0 0";
+      s.margin = "0";
+      s.padding = "0";
+      s.color = "transparent";
+      s.whiteSpace = "pre-wrap";
+      s.overflow = "hidden";
+      s.zIndex = "0";
+      el.addEventListener(
+        "wheel",
+        (e2) => {
+          node.dispatchEvent(new VectoJSEvent("wheel", node, e2));
+        },
+        { passive: false }
+      );
+      this.a11yRoot.appendChild(el);
+      this.contentElements.set(node.id, el);
+    }
+    if (el.textContent !== projection.text) el.textContent = projection.text;
+    const font = projection.font ?? "";
+    if (el.style.font !== font) el.style.font = font;
+    const lineHeight = projection.lineHeight !== void 0 ? `${projection.lineHeight}px` : "";
+    if (el.style.lineHeight !== lineHeight) el.style.lineHeight = lineHeight;
+    const hidden = node.interactive ? "true" : null;
+    if (el.getAttribute("aria-hidden") !== hidden) {
+      if (hidden) el.setAttribute("aria-hidden", hidden);
+      else el.removeAttribute("aria-hidden");
+    }
+    const selectable = projection.selectable === true;
+    const pointerEvents = selectable ? "auto" : "none";
+    if (el.style.pointerEvents !== pointerEvents) {
+      el.style.pointerEvents = pointerEvents;
+      el.style.userSelect = selectable ? "text" : "none";
+      el.style.cursor = selectable ? "text" : "";
+    }
+    const { a, b, c, d, e, f } = node.getWorldTransform();
+    el.style.left = `${e}px`;
+    el.style.top = `${f}px`;
+    if (node.width > 0) el.style.width = `${node.width}px`;
+    if (node.height > 0) el.style.height = `${node.height}px`;
+    el.style.transform = `matrix(${a}, ${b}, ${c}, ${d}, 0, 0)`;
+    let visible = true;
+    if (node.width > 0 && node.height > 0) {
+      let minX = Infinity;
+      let minY = Infinity;
+      let maxX = -Infinity;
+      let maxY = -Infinity;
+      for (let i = 0; i < 4; i++) {
+        const lx = i & 1 ? node.width : 0;
+        const ly = i & 2 ? node.height : 0;
+        const wx = a * lx + c * ly + e;
+        const wy = b * lx + d * ly + f;
+        if (wx < minX) minX = wx;
+        if (wx > maxX) maxX = wx;
+        if (wy < minY) minY = wy;
+        if (wy > maxY) maxY = wy;
+      }
+      visible = maxX >= 0 && minX <= this.width && maxY >= 0 && minY <= this.height;
+    }
+    const display = visible ? "" : "none";
+    if (el.style.display !== display) el.style.display = display;
+  }
   enforceA11yDomOrder() {
     if (!this.a11yRoot) return;
     this.fullViewportElements.length = 0;
@@ -1164,8 +1276,8 @@ var Scene = class _Scene {
   loop(time) {
     if (!this.isRunning) return;
     let cap = this.effectiveMaxFPS();
-    const isStatic = this.autoThrottle && !this.dirty && !this.hasAnyPendingAnimation(this.root) && !this.hasAnyPendingAnimation(this.overlayRoot);
-    if (isStatic && this.renderMode === "always" && this.maxFPS > 0) {
+    const isIdle = !this.dirty && !this.hasAnyPendingAnimation(this.root) && !this.hasAnyPendingAnimation(this.overlayRoot);
+    if (isIdle && this.autoThrottle && this.renderMode === "always" && this.maxFPS > 0) {
       cap = Math.min(cap, 2);
     }
     if (cap > 0 && time - this.lastTime < 1e3 / cap - 1) {
@@ -1174,17 +1286,19 @@ var Scene = class _Scene {
     }
     const dt = time - this.lastTime;
     this.lastTime = time;
-    if (this.renderMode === "onDemand" && isStatic) {
+    if (this.renderMode === "onDemand" && isIdle) {
       this.scheduleFrame();
       return;
     }
+    this.dirty = false;
     this.render(this.renderer, dt, time);
     const hasActiveAnimation = this.hasAnyPendingAnimation(this.root) || this.hasAnyPendingAnimation(this.overlayRoot);
     const hasInteractive = this.hasAnyInteractive(this.root) || this.hasAnyInteractive(this.overlayRoot);
+    const wantsContentSync = this.contentProjectionEnabled;
     const shouldSyncInterval = this.a11ySyncInterval <= 0 || time - this.lastA11ySync >= this.a11ySyncInterval;
-    if ((hasInteractive || this.a11yElements.size > 0) && (shouldSyncInterval || this.a11yPendingSyncAfterAnimation)) {
+    if ((hasInteractive || this.a11yElements.size > 0 || wantsContentSync) && (shouldSyncInterval || this.a11yPendingSyncAfterAnimation)) {
       this.lastA11ySync = time;
-      if (hasInteractive) {
+      if (hasInteractive || wantsContentSync) {
         this.syncA11y(this.root);
       }
       this.enforceA11yDomOrder();
@@ -1192,7 +1306,6 @@ var Scene = class _Scene {
     } else if (hasActiveAnimation) {
       this.a11yPendingSyncAfterAnimation = true;
     }
-    this.dirty = false;
     this.scheduleFrame();
   }
   /**
@@ -1304,6 +1417,7 @@ var Scene = class _Scene {
             renderPass.end();
           }
           this.device.queue.submit([commandEncoder.finish()]);
+          if (this.gpuContext) this.gpuHasContent = true;
         } catch (e) {
           console.error("WebGPU frame execution failed. Falling back.", e);
           this.deviceLost = true;
@@ -1312,9 +1426,23 @@ var Scene = class _Scene {
         }
       } else if (isMainRenderPath) {
         for (const entity of computeEntities) {
-          entity.updateCPU(dt / 1e3, this.mouseX, this.mouseY, this.width, this.height);
+          let mx = this.mouseX;
+          let my = this.mouseY;
+          if (mx > -9e3 && my > -9e3) {
+            const local = entity.worldToLocal(mx, my);
+            if (local) {
+              mx = local.x;
+              my = local.y;
+            } else {
+              mx = -9999;
+              my = -9999;
+            }
+          }
+          entity.updateCPU(dt / 1e3, mx, my, this.width, this.height);
         }
       }
+    } else if (isMainRenderer) {
+      this.clearGPUCanvasIfStale();
     }
     renderer.clear();
     if (isMainRenderer) {
@@ -1412,7 +1540,19 @@ var Scene = class _Scene {
       if (visible) {
         if (node instanceof ComputeParticleEntity) {
           if (this.deviceLost || this.webgpuDisabled || !this.device || !this.manager) {
-            this.renderCPUParticles(renderer, node, worldOpacity);
+            this.renderCPUParticles(
+              renderer,
+              node,
+              worldOpacity,
+              a,
+              b,
+              c,
+              d,
+              te,
+              tf,
+              worldScaleX,
+              isSimilarityTransform
+            );
           }
         } else {
           node.render(renderer);
@@ -1436,6 +1576,7 @@ var Scene = class _Scene {
     if (isMainRenderer) {
       this.pointRenderer?.flush();
     }
+    renderer.present?.();
   }
   /**
    * Export the current scene state to a lightweight, flat SVG XML string.
@@ -1455,6 +1596,10 @@ var Scene = class _Scene {
       this.renderer.resize(width, height);
     }
     this.pointRenderer?.resize(width, height);
+    if (this.gpuCanvas) {
+      this.gpuCanvas.width = width;
+      this.gpuCanvas.height = height;
+    }
     this.markDirty();
   }
   /**
@@ -1477,6 +1622,27 @@ var Scene = class _Scene {
     if (overlayHit) return overlayHit;
     return this.findHitRecursively(this.root, x, y);
   }
+  /** Submit one transparent clear pass when particle content lingers on the GPU canvas. */
+  clearGPUCanvasIfStale() {
+    if (!this.gpuHasContent || !this.device || !this.gpuContext || this.deviceLost) return;
+    try {
+      const encoder = this.device.createCommandEncoder();
+      const pass = encoder.beginRenderPass({
+        colorAttachments: [
+          {
+            view: this.gpuContext.getCurrentTexture().createView(),
+            clearValue: { r: 0, g: 0, b: 0, a: 0 },
+            loadOp: "clear",
+            storeOp: "store"
+          }
+        ]
+      });
+      pass.end();
+      this.device.queue.submit([encoder.finish()]);
+    } catch {
+    }
+    this.gpuHasContent = false;
+  }
   async initWebGPUContext(entities) {
     if (!navigator.gpu) {
       throw new Error("WebGPU not supported on this platform.");
@@ -1569,10 +1735,10 @@ var Scene = class _Scene {
       }).catch(() => this.recreateWebGPUDeviceWithRetry(entities, attempt + 1));
     }, backoff);
   }
-  renderCPUParticles(renderer, entity, worldOpacity) {
+  renderCPUParticles(renderer, entity, worldOpacity, a, b, c, d, e, f, worldScale, isSimilarityTransform) {
     const data = entity.particleData;
     const size = entity.maxParticles;
-    const isMain = renderer === this.renderer;
+    const useGL = renderer === this.renderer && !!this.pointRenderer && isSimilarityTransform;
     for (let i = 0; i < size; i++) {
       const idx = i * 8;
       const x = data[idx];
@@ -1582,8 +1748,14 @@ var Scene = class _Scene {
       if (life === 0) continue;
       const opacity = life < 0 ? worldOpacity : worldOpacity * Math.min(1, life);
       const scale = life >= 0 ? Math.min(1, life) : 1;
-      if (isMain && this.pointRenderer) {
-        this.pointRenderer.addCircle(x, y, pSize * scale, entity.baseColor, opacity);
+      if (useGL) {
+        this.pointRenderer.addCircle(
+          a * x + c * y + e,
+          b * x + d * y + f,
+          pSize * scale * worldScale,
+          entity.baseColor,
+          opacity
+        );
       } else {
         renderer.fillCircle(x, y, pSize * scale, entity.baseColor, opacity);
       }
@@ -1631,6 +1803,14 @@ var TextEntity = class extends Entity {
     this.on("hover", () => this.isHovered = true);
     this.on("pointerleave", () => this.isHovered = false);
   }
+  /**
+   * Mirror the rendered text into the DOM content layer: find-in-page, screen
+   * readers, crawlers, and translation see the same string the canvas draws.
+   */
+  getContentProjection() {
+    if (!this.text) return null;
+    return { text: this.text, font: `${this.fontSize}px sans-serif` };
+  }
   /**
    * Replace the text content. Runs the **cold** measurement pass (re-segment +
    * re-measure) since the glyphs changed, then re-lays out.
@@ -1809,6 +1989,11 @@ var SplineEntity = class extends Entity {
   bounds;
   offscreen = null;
   baked = false;
+  /** Logical (CSS-pixel) size of the baked bitmap — the blit destination size. */
+  bakedWidth = 0;
+  bakedHeight = 0;
+  /** Gradient strokes can't be baked to a solid-color bitmap; they render per-frame. */
+  containsGradient;
   /** Lazily-flattened polylines (one Float32Array of [x,y,...] per segment) for hit-testing. */
   polylines = null;
   /**
@@ -1828,6 +2013,8 @@ var SplineEntity = class extends Entity {
     this.bounds = this.computeBounds();
     this.width = this.bounds.width;
     this.height = this.bounds.height;
+    const isGradient = (c) => c !== null && !Array.isArray(c);
+    this.containsGradient = (this.doc.equations?.some((eq) => isGradient(eq.color_rgb)) ?? false) || (this.doc.paths?.some((p) => isGradient(p.color_rgb)) ?? false);
     this.interactive = true;
   }
   computeBounds() {
@@ -1987,18 +2174,22 @@ var SplineEntity = class extends Entity {
     const pad = this.lineWidth + 2;
     const w = Math.max(1, Math.ceil(this.bounds.width) + pad * 2);
     const h = Math.max(1, Math.ceil(this.bounds.height) + pad * 2);
+    this.bakedWidth = w;
+    this.bakedHeight = h;
+    const dpr = typeof window !== "undefined" && typeof window.devicePixelRatio === "number" ? window.devicePixelRatio || 1 : 1;
     let canvas;
     if (typeof OffscreenCanvas !== "undefined") {
-      canvas = new OffscreenCanvas(w, h);
+      canvas = new OffscreenCanvas(w * dpr, h * dpr);
     } else if (typeof document !== "undefined") {
       canvas = document.createElement("canvas");
-      canvas.width = w;
-      canvas.height = h;
+      canvas.width = w * dpr;
+      canvas.height = h * dpr;
     } else {
       return;
     }
     const ctx = canvas.getContext("2d");
     if (!ctx) return;
+    ctx.scale(dpr, dpr);
     ctx.translate(pad - this.bounds.x, pad - this.bounds.y);
     ctx.lineWidth = this.lineWidth;
     ctx.lineCap = "round";
@@ -2032,7 +2223,7 @@ var SplineEntity = class extends Entity {
   }
   render(r) {
     let rendered = false;
-    if (this.cache) {
+    if (this.cache && !this.containsGradient) {
       if (!this.baked) this.bake();
       if (this.offscreen) {
         const pad = this.lineWidth + 2;
@@ -2040,8 +2231,9 @@ var SplineEntity = class extends Entity {
           this.offscreen,
           this.bounds.x - pad,
           this.bounds.y - pad,
-          this.offscreen.width,
-          this.offscreen.height
+          // Logical size, not the (DPR-scaled) bitmap size.
+          this.bakedWidth,
+          this.bakedHeight
         );
         rendered = true;
       }

package/dist/layout/LayoutWorkerSource.d.ts

@@ -1 +1 @@
-export declare const WORKER_SOURCE_STRING = "\"use strict\";(()=>{var k=new Map;function n(t){return typeof t==\"number\"&&Number.isFinite(t)}function H(t){return t.origin?t.origin===self.location.origin:!0}function M(t){if(!t||typeof t!=\"object\")return!1;let e=t;return typeof e.id==\"string\"&&n(e.seqId)&&typeof e.text==\"string\"&&typeof e.fontId==\"string\"&&(e.fontData===void 0||typeof e.fontData==\"object\")&&n(e.maxWidth)&&n(e.maxHeight)&&n(e.fontSize)&&(e.lineHeight===void 0||n(e.lineHeight))&&(e.letterSpacing===void 0||n(e.letterSpacing))}self.onmessage=t=>{if(!H(t)||!M(t.data))return;let{id:e,seqId:F,text:q,fontId:d,fontData:f,maxWidth:y,maxHeight:I,fontSize:i,lineHeight:A,letterSpacing:D}=t.data;f&&k.set(d,f);let s=k.get(d);if(!s)return;let g=[],l=[],p=[],m=[],o=0,a=0,h=s.metrics?.ascender??.8,W=s.metrics?.descender??-.2,b=A??i*(h-W),x=Array.from(q);for(let c=0;c<x.length;c++){let u=x[c].codePointAt(0),S=(s.glyphs?.find(C=>C.unicode===u)?.advance??1)*i;o+S>y&&u===32&&(o=0,a++),g.push(u),l.push(o);let w=a*b+h*i;p.push(w),m.push(-256),o+=S+(D??0)}let r={id:e,seqId:F,width:Math.min(o,y),height:(a+1)*b,codePoints:new Uint32Array(g),xCoords:new Float32Array(l),yCoords:new Float32Array(p),packedStyles:new Uint32Array(m)};self.postMessage(r,[r.codePoints.buffer,r.xCoords.buffer,r.yCoords.buffer,r.packedStyles.buffer])};})();\n";
+export declare const WORKER_SOURCE_STRING = "\"use strict\";(()=>{var C=new Map;function f(t){return typeof t==\"number\"&&Number.isFinite(t)}function U(t){return t.origin?t.origin===self.location.origin:!0}function j(t){if(!t||typeof t!=\"object\")return!1;let e=t;return typeof e.id==\"string\"&&f(e.seqId)&&typeof e.text==\"string\"&&typeof e.fontId==\"string\"&&(e.fontData===void 0||typeof e.fontData==\"object\")&&f(e.maxWidth)&&f(e.maxHeight)&&f(e.fontSize)&&(e.lineHeight===void 0||f(e.lineHeight))&&(e.letterSpacing===void 0||f(e.letterSpacing))}self.onmessage=t=>{if(!U(t)||!j(t.data))return;let{id:e,seqId:D,text:L,fontId:k,fontData:S,maxWidth:H,maxHeight:z,fontSize:d,lineHeight:I,letterSpacing:M}=t.data;S&&C.set(k,S);let g=C.get(k);if(!g)return;let m=[],i=[],h=[],w=[],n=0,c=0,r=0,o=-1,p=g.metrics?.ascender??.8,R=g.metrics?.descender??-.2,b=I??d*(p-R),P=M??0,F=new Map;for(let s of g.glyphs??[])F.set(s.unicode,s.advance);let x=()=>{n>r&&(r=n),n=0,c++,o=-1},A=Array.from(L);for(let s=0;s<A.length;s++){let a=A[s].codePointAt(0);if(a===10){x();continue}let W=(F.get(a)??1)*d,q=a>=11904;if(q&&(o=-1),n+W>H&&n>0){if(a===32){x();continue}if(o>=0&&i[o]>0){let l=i[o];l>r&&(r=l),c++;let v=c*b+p*d;for(let y=o;y<i.length;y++)i[y]-=l,h[y]=v;n-=l}else x()}a===32?o=-1:o===-1&&!q&&(o=m.length),m.push(a),i.push(n),h.push(c*b+p*d),w.push(-256),n+=W+P}n>r&&(r=n);let u={id:e,seqId:D,width:r,height:(c+1)*b,codePoints:new Uint32Array(m),xCoords:new Float32Array(i),yCoords:new Float32Array(h),packedStyles:new Uint32Array(w)};self.postMessage(u,[u.codePoints.buffer,u.xCoords.buffer,u.yCoords.buffer,u.packedStyles.buffer])};})();\n";

package/dist/layout.js

@@ -3,14 +3,14 @@
 
 
 
-var _chunk5KLB6BEZjs = require('./chunk-5KLB6BEZ.js');
+var _chunkBWLNEJJWjs = require('./chunk-BWLNEJJW.js');
 
 
-var _chunk76NMTLYLjs = require('./chunk-76NMTLYL.js');
+var _chunkCTZQOM5Zjs = require('./chunk-CTZQOM5Z.js');
 
 
 
 
 
 
-exports.LayoutEngine = _chunk5KLB6BEZjs.LayoutEngine; exports.LayoutResultBuffer = _chunk5KLB6BEZjs.LayoutResultBuffer; exports.LayoutWorkerManager = _chunk76NMTLYLjs.LayoutWorkerManager; exports.computeLineSegments = _chunk5KLB6BEZjs.computeLineSegments; exports.createCanvasMeasurer = _chunk5KLB6BEZjs.createCanvasMeasurer;
+exports.LayoutEngine = _chunkBWLNEJJWjs.LayoutEngine; exports.LayoutResultBuffer = _chunkBWLNEJJWjs.LayoutResultBuffer; exports.LayoutWorkerManager = _chunkCTZQOM5Zjs.LayoutWorkerManager; exports.computeLineSegments = _chunkBWLNEJJWjs.computeLineSegments; exports.createCanvasMeasurer = _chunkBWLNEJJWjs.createCanvasMeasurer;

package/dist/layout.mjs

@@ -3,10 +3,10 @@ import {
   LayoutResultBuffer,
   computeLineSegments,
   createCanvasMeasurer
-} from "./chunk-SB3SCWLT.mjs";
+} from "./chunk-SSOP3F5F.mjs";
 import {
   LayoutWorkerManager
-} from "./chunk-B3Z3JEJH.mjs";
+} from "./chunk-STWPTWO4.mjs";
 export {
   LayoutEngine,
   LayoutResultBuffer,

package/dist/renderer/CanvasRenderer.d.ts

@@ -14,7 +14,18 @@ export declare class CanvasRenderer implements IRenderer {
     private batchColor;
     private batchAlpha;
     private batchCount;
-    constructor(canvas: HTMLCanvasElement);
+    /**
+     * @param canvas - The target canvas. Its backing store is resized to the
+     *   logical size × devicePixelRatio.
+     * @param size - Explicit logical size. Without it the renderer assumes a
+     *   fullscreen canvas and sizes to the window — pass this for embedded /
+     *   custom-container canvases (the Scene does when `disableWindowResize` is
+     *   set) so the canvas's own dimensions aren't clobbered by the window's.
+     */
+    constructor(canvas: HTMLCanvasElement, size?: {
+        width: number;
+        height: number;
+    });
     /**
      * Expose the underlying `CanvasRenderingContext2D` for operations not
      * covered by the {@link IRenderer} interface.

package/dist/renderer/IRenderer.d.ts

@@ -175,6 +175,13 @@ export interface IRenderer {
         stop: number;
         color: string;
     }[]): any;
+    /**
+     * Present the completed frame, called by {@link Scene} exactly once at the
+     * end of each render pass (after the final {@link flush}). Retained-scene
+     * backends (e.g. `@vectojs/three`) do their single real GL render here;
+     * immediate-mode backends (Canvas2D, SVG) don't need it. Optional.
+     */
+    present?(): void;
     /**
      * Release any backend-owned GPU textures / GL contexts / caches.
      *

package/dist/renderer/url.d.ts

@@ -18,7 +18,7 @@
  *    returns it verbatim — relative navigation is never script-injectable.
  * 4. If the URL parses with a scheme NOT in {@link SAFE_SCHEMES}, returns `'#'`
  *    to keep the link non-empty but inert.
- * 5. Otherwise returns the canonical `URL.toString()` form.
+ * 5. Otherwise returns the trimmed input unchanged (no canonicalization).
  *
  * The function never throws; malformed input falls back to `'#'`.
  */

package/dist/renderer.js

@@ -4,11 +4,11 @@
 
 
 
-var _chunkTPNADFNNjs = require('./chunk-TPNADFNN.js');
+var _chunkGTQRCY6Wjs = require('./chunk-GTQRCY6W.js');
 
 
 
 
 
 
-exports.CanvasRenderer = _chunkTPNADFNNjs.CanvasRenderer; exports.SVGRenderer = _chunkTPNADFNNjs.SVGRenderer; exports.WebGPUParticleSystemManager = _chunkTPNADFNNjs.WebGPUParticleSystemManager; exports.createWebGLPointRenderer = _chunkTPNADFNNjs.createWebGLPointRenderer; exports.parseColorToRGBA = _chunkTPNADFNNjs.parseColorToRGBA;
+exports.CanvasRenderer = _chunkGTQRCY6Wjs.CanvasRenderer; exports.SVGRenderer = _chunkGTQRCY6Wjs.SVGRenderer; exports.WebGPUParticleSystemManager = _chunkGTQRCY6Wjs.WebGPUParticleSystemManager; exports.createWebGLPointRenderer = _chunkGTQRCY6Wjs.createWebGLPointRenderer; exports.parseColorToRGBA = _chunkGTQRCY6Wjs.parseColorToRGBA;

package/dist/renderer.mjs

@@ -4,7 +4,7 @@ import {
   WebGPUParticleSystemManager,
   createWebGLPointRenderer,
   parseColorToRGBA
-} from "./chunk-WEQRBXT2.mjs";
+} from "./chunk-HVJHXIKW.mjs";
 export {
   CanvasRenderer,
   SVGRenderer,

package/dist/text/MSDFTextEntity.d.ts

@@ -1,4 +1,4 @@
-import { Entity } from '../tree/Entity';
+import { Entity, type ContentProjection } from '../tree/Entity';
 import { MSDFFont } from './MSDFFont';
 export interface MSDFTextEntityOptions {
     font: MSDFFont;
@@ -8,6 +8,10 @@ export interface MSDFTextEntityOptions {
     color?: string;
     lineHeight?: number;
     letterSpacing?: number;
+    /** Wrap boundary in logical pixels. Defaults to 1000. */
+    maxWidth?: number;
+    /** Layout height limit in logical pixels. Defaults to 1000. */
+    maxHeight?: number;
 }
 export declare class MSDFTextEntity extends Entity {
     private font;
@@ -17,13 +21,23 @@ export declare class MSDFTextEntity extends Entity {
     color: string;
     private letterSpacing;
     private lineHeight?;
+    private maxWidth;
+    private maxHeight;
     private text;
     private lastRenderedSeqId;
     private rgbColorCache;
     private fontStringCache;
     private layoutResult;
     constructor(text: string, options: MSDFTextEntityOptions);
+    /** Change the wrap boundary and re-run layout for the current text. */
+    setMaxWidth(maxWidth: number): void;
     setText(text: string): void;
+    private queueLayout;
+    /**
+     * Mirror the rendered text into the DOM content layer: find-in-page, screen
+     * readers, crawlers, and translation see the same string the canvas draws.
+     */
+    getContentProjection(): ContentProjection | null;
     isPointInside(globalX: number, globalY: number): boolean;
     render(renderer: any): void;
     destroy(): void;

package/dist/text.js

@@ -2,15 +2,15 @@
 
 
 
-var _chunkTQ4H357Qjs = require('./chunk-TQ4H357Q.js');
+var _chunkDWMQYHNCjs = require('./chunk-DWMQYHNC.js');
 
 
 
-var _chunk76NMTLYLjs = require('./chunk-76NMTLYL.js');
+var _chunkCTZQOM5Zjs = require('./chunk-CTZQOM5Z.js');
 
 
 
 
 
 
-exports.ArabicShaper = _chunk76NMTLYLjs.ArabicShaper; exports.BidiResolver = _chunk76NMTLYLjs.BidiResolver; exports.MSDFFont = _chunkTQ4H357Qjs.MSDFFont; exports.MSDFTextEntity = _chunkTQ4H357Qjs.MSDFTextEntity; exports.SVGEntity = _chunkTQ4H357Qjs.SVGEntity;
+exports.ArabicShaper = _chunkCTZQOM5Zjs.ArabicShaper; exports.BidiResolver = _chunkCTZQOM5Zjs.BidiResolver; exports.MSDFFont = _chunkDWMQYHNCjs.MSDFFont; exports.MSDFTextEntity = _chunkDWMQYHNCjs.MSDFTextEntity; exports.SVGEntity = _chunkDWMQYHNCjs.SVGEntity;

package/dist/text.mjs

@@ -2,11 +2,11 @@ import {
   MSDFFont,
   MSDFTextEntity,
   SVGEntity
-} from "./chunk-P6MDWIEX.mjs";
+} from "./chunk-YVN3PJRC.mjs";
 import {
   ArabicShaper,
   BidiResolver
-} from "./chunk-B3Z3JEJH.mjs";
+} from "./chunk-STWPTWO4.mjs";
 export {
   ArabicShaper,
   BidiResolver,