@vectojs/core 1.26.0 → 1.27.1

package/dist/{chunk-KHGHP2J3.js → chunk-K2UGEIT6.js}

@@ -1,5 +1,52 @@
 "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/IRenderer.ts
+var RENDERER_STYLE_PROPERTY_HINTS = {
+  globalAlpha: "setGlobalAlpha(alpha)",
+  strokeStyle: "stroke(color, lineWidth)",
+  lineWidth: "stroke(color, lineWidth)",
+  fillStyle: "fill(color) \u2014 or fillText(text, x, y, font, color)",
+  font: "fillText(text, x, y, font, color)",
+  lineCap: "stroke(color, lineWidth) (cap is backend-chosen)",
+  lineJoin: "stroke(color, lineWidth) (join is backend-chosen)",
+  globalCompositeOperation: "no equivalent \u2014 composite via a separate canvas",
+  shadowBlur: "no equivalent \u2014 draw the shadow explicitly",
+  shadowColor: "no equivalent \u2014 draw the shadow explicitly",
+  textAlign: "no equivalent \u2014 measure and offset x yourself",
+  textBaseline: "no equivalent \u2014 measure and offset y yourself"
+};
+var rendererDevMode = false;
+function setRendererDevMode(active) {
+  rendererDevMode = active;
+}
+function isRendererDevMode() {
+  if (rendererDevMode) return true;
+  const g = typeof globalThis !== "undefined" ? globalThis : void 0;
+  if (_optionalChain([g, 'optionalAccess', _ => _.__DEV__])) return true;
+  return _optionalChain([g, 'optionalAccess', _2 => _2.process, 'optionalAccess', _3 => _3.env, 'optionalAccess', _4 => _4.NODE_ENV]) === "development";
+}
+function installRendererDevTraps(renderer, label) {
+  if (!isRendererDevMode()) return;
+  for (const [prop, hint] of Object.entries(RENDERER_STYLE_PROPERTY_HINTS)) {
+    if (prop in renderer) continue;
+    let stored;
+    let warned = false;
+    Object.defineProperty(renderer, prop, {
+      configurable: true,
+      enumerable: false,
+      get: () => stored,
+      set: (value) => {
+        stored = value;
+        if (warned) return;
+        warned = true;
+        console.warn(
+          `[vectojs/dev] \`${prop}\` is not a renderer property \u2014 assigning it on ${label} has no effect on what is drawn. Call \`${hint}\` instead.`
+        );
+      }
+    });
+  }
+}
+
 // src/renderer/CanvasRenderer.ts
 function emptyDrawCounters() {
   return {
@@ -79,8 +126,8 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
   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)));
-    this.height = _nullishCoalesce(_optionalChain([size, 'optionalAccess', _2 => _2.height]), () => ( (typeof window !== "undefined" ? window.innerHeight : canvas.height || 0)));
+    this.width = _nullishCoalesce(_optionalChain([size, 'optionalAccess', _5 => _5.width]), () => ( (typeof window !== "undefined" ? window.innerWidth : canvas.width || 0)));
+    this.height = _nullishCoalesce(_optionalChain([size, 'optionalAccess', _6 => _6.height]), () => ( (typeof window !== "undefined" ? window.innerHeight : canvas.height || 0)));
     canvas.width = this.width * dpr;
     canvas.height = this.height * dpr;
     if (canvas.style) {
@@ -92,6 +139,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
     if (ctx) ctx.scale(dpr, dpr);
     this.canvas = canvas;
     this.setupContextLossRecovery();
+    installRendererDevTraps(this, "CanvasRenderer");
   }
   /** Register a callback fired after a lost 2D context is restored + re-scaled,
    *  so the owner can repaint (the restored canvas comes back cleared). */
@@ -122,7 +170,7 @@ var CanvasRenderer = (_class = class _CanvasRenderer {
       this.batchActive = false;
       this.batchCount = 0;
       this.contextLost = false;
-      _optionalChain([this, 'access', _3 => _3.contextRestoredCb, 'optionalCall', _4 => _4()]);
+      _optionalChain([this, 'access', _7 => _7.contextRestoredCb, 'optionalCall', _8 => _8()]);
     });
   }
   /**
@@ -491,6 +539,7 @@ var SVGRenderer = (_class2 = class {
   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;
+    installRendererDevTraps(this, "SVGRenderer");
   }
   clear() {
     this.buffer = [];
@@ -712,8 +761,8 @@ var SVGRenderer = (_class2 = class {
   }
   drawImage(source, dx, dy, dw, dh) {
     this.flush();
-    const fromCanvas2 = typeof _optionalChain([source, 'optionalAccess', _5 => _5.toDataURL]) === "function";
-    const rawHref = fromCanvas2 ? source.toDataURL() : _optionalChain([source, 'optionalAccess', _6 => _6.src]) || "";
+    const fromCanvas2 = typeof _optionalChain([source, 'optionalAccess', _9 => _9.toDataURL]) === "function";
+    const rawHref = fromCanvas2 ? source.toDataURL() : _optionalChain([source, 'optionalAccess', _10 => _10.src]) || "";
     const href = fromCanvas2 && this.isSafeRasterDataUrl(rawHref) ? rawHref : sanitizeUrl(String(rawHref));
     const transformStr = `matrix(${this.ma},${this.mb},${this.mc},${this.md},${this.me},${this.mf})`;
     if (href) {
@@ -2285,4 +2334,7 @@ var TextRasterCache = (_class5 = class {
 
 
 
-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;
+
+
+
+exports.setRendererDevMode = setRendererDevMode; exports.isRendererDevMode = isRendererDevMode; exports.installRendererDevTraps = installRendererDevTraps; 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;

package/dist/{chunk-I4WQY7CJ.mjs → chunk-TI5EMJGL.mjs}

@@ -1,3 +1,50 @@
+// src/renderer/IRenderer.ts
+var RENDERER_STYLE_PROPERTY_HINTS = {
+  globalAlpha: "setGlobalAlpha(alpha)",
+  strokeStyle: "stroke(color, lineWidth)",
+  lineWidth: "stroke(color, lineWidth)",
+  fillStyle: "fill(color) \u2014 or fillText(text, x, y, font, color)",
+  font: "fillText(text, x, y, font, color)",
+  lineCap: "stroke(color, lineWidth) (cap is backend-chosen)",
+  lineJoin: "stroke(color, lineWidth) (join is backend-chosen)",
+  globalCompositeOperation: "no equivalent \u2014 composite via a separate canvas",
+  shadowBlur: "no equivalent \u2014 draw the shadow explicitly",
+  shadowColor: "no equivalent \u2014 draw the shadow explicitly",
+  textAlign: "no equivalent \u2014 measure and offset x yourself",
+  textBaseline: "no equivalent \u2014 measure and offset y yourself"
+};
+var rendererDevMode = false;
+function setRendererDevMode(active) {
+  rendererDevMode = active;
+}
+function isRendererDevMode() {
+  if (rendererDevMode) return true;
+  const g = typeof globalThis !== "undefined" ? globalThis : void 0;
+  if (g?.__DEV__) return true;
+  return g?.process?.env?.NODE_ENV === "development";
+}
+function installRendererDevTraps(renderer, label) {
+  if (!isRendererDevMode()) return;
+  for (const [prop, hint] of Object.entries(RENDERER_STYLE_PROPERTY_HINTS)) {
+    if (prop in renderer) continue;
+    let stored;
+    let warned = false;
+    Object.defineProperty(renderer, prop, {
+      configurable: true,
+      enumerable: false,
+      get: () => stored,
+      set: (value) => {
+        stored = value;
+        if (warned) return;
+        warned = true;
+        console.warn(
+          `[vectojs/dev] \`${prop}\` is not a renderer property \u2014 assigning it on ${label} has no effect on what is drawn. Call \`${hint}\` instead.`
+        );
+      }
+    });
+  }
+}
+
 // src/renderer/CanvasRenderer.ts
 function emptyDrawCounters() {
   return {
@@ -90,6 +137,7 @@ var CanvasRenderer = class _CanvasRenderer {
     if (ctx) ctx.scale(dpr, dpr);
     this.canvas = canvas;
     this.setupContextLossRecovery();
+    installRendererDevTraps(this, "CanvasRenderer");
   }
   /** Register a callback fired after a lost 2D context is restored + re-scaled,
    *  so the owner can repaint (the restored canvas comes back cleared). */
@@ -489,6 +537,7 @@ var SVGRenderer = class {
   constructor(width, height) {
     this.width = width;
     this.height = height;
+    installRendererDevTraps(this, "SVGRenderer");
   }
   clear() {
     this.buffer = [];
@@ -2274,6 +2323,9 @@ var TextRasterCache = class {
 };
 
 export {
+  setRendererDevMode,
+  isRendererDevMode,
+  installRendererDevTraps,
   CanvasRenderer,
   sanitizeUrl,
   isSafeUrl,

package/dist/index.js

@@ -9,7 +9,10 @@
 
 
 
-var _chunkKHGHP2J3js = require('./chunk-KHGHP2J3.js');
+
+
+
+var _chunkK2UGEIT6js = require('./chunk-K2UGEIT6.js');
 
 
 
@@ -2840,10 +2843,26 @@ var Scene = (_class7 = class _Scene {
   //
   // Checks run once every ~120 frames (~2s at 60fps) to keep overhead
   // negligible even when dev mode is on.
-  /** Toggle development-mode runtime warnings globally. */
-  static __initStatic5() {this.devMode = false}
+  static __initStatic5() {this._devMode = false}
+  /**
+   * Toggle development-mode runtime warnings globally.
+   *
+   * An accessor rather than a plain field so the renderer layer learns about it
+   * immediately: renderers cannot import `Scene` (the dependency runs
+   * `Scene → renderer`), and their diagnostics are installed per instance at
+   * construction. A plain field would only reach them the next time a `Scene`
+   * happened to be built, which made a directly-constructed `CanvasRenderer`
+   * silently untrapped.
+   */
+  static get devMode() {
+    return _Scene._devMode;
+  }
+  static set devMode(active) {
+    _Scene._devMode = active;
+    _chunkK2UGEIT6js.setRendererDevMode.call(void 0, active);
+  }
   static _devModeDetected() {
-    if (_Scene.devMode) return true;
+    if (_Scene._devMode) return true;
     const gp = typeof globalThis !== "undefined" ? globalThis : void 0;
     if (_optionalChain([gp, 'optionalAccess', _41 => _41.__DEV__])) return true;
     if (_optionalChain([gp, 'optionalAccess', _42 => _42.process, 'optionalAccess', _43 => _43.env, 'optionalAccess', _44 => _44.NODE_ENV]) === "development") return true;
@@ -2952,6 +2971,7 @@ var Scene = (_class7 = class _Scene {
     this.readingDirection = _nullishCoalesce(options.readingDirection, () => ( "ltr"));
     this.renderMode = _nullishCoalesce(options.renderMode, () => ( "always"));
     this._devActive = _Scene._devModeDetected();
+    _chunkK2UGEIT6js.setRendererDevMode.call(void 0, this._devActive);
     this._warnUnknownOptions(options);
     this.reducedMotionQuery = typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)") : null;
     if (typeof window !== "undefined" && typeof window.matchMedia === "function") {
@@ -2979,7 +2999,7 @@ var Scene = (_class7 = class _Scene {
     if (options.renderer) {
       this.renderer = options.renderer;
     } else {
-      this.renderer = new (0, _chunkKHGHP2J3js.CanvasRenderer)(
+      this.renderer = new (0, _chunkK2UGEIT6js.CanvasRenderer)(
         canvas,
         this.disableWindowResize ? { width: this.width, height: this.height } : void 0,
         this.maxDPR
@@ -3620,10 +3640,24 @@ var Scene = (_class7 = class _Scene {
    * resume when it returns — instead of running the full update/render every
    * frame for a scene nobody can see. No-op (stays "on screen") where
    * `IntersectionObserver` is unavailable, so SSR/jsdom behavior is unchanged.
+   *
+   * Also a no-op for a canvas that is not in the document. An offscreen canvas
+   * used purely as a texture source — `@vectojs/three`'s `ThreeAdapter` wraps
+   * one in a `CanvasTexture`, and the same pattern shows up in any
+   * render-to-texture setup — is never appended anywhere, and an
+   * `IntersectionObserver` reports a detached element as not intersecting.
+   * Observing it would therefore set `_canvasOnScreen = false` on the first
+   * callback, and since {@link loop} returns without rescheduling in that
+   * state, the loop would stop permanently: the only resume path is an
+   * `isIntersecting` transition, which a detached element can never produce.
+   * Such a canvas is always "visible" as far as this scene is concerned,
+   * because whether its output is seen depends on the consumer sampling the
+   * texture, which this scene cannot observe.
    */
   watchCanvasVisibility() {
     if (this._canvasObserver || typeof IntersectionObserver === "undefined") return;
     if (!this.canvas || typeof this.canvas.getBoundingClientRect !== "function") return;
+    if (this.canvas.isConnected === false) return;
     this._canvasObserver = new IntersectionObserver((entries) => {
       const entry = entries[entries.length - 1];
       if (!entry) return;
@@ -4054,7 +4088,7 @@ var Scene = (_class7 = class _Scene {
         this.syncOptionalAttribute(
           el,
           "href",
-          attrs.href === void 0 ? void 0 : _chunkKHGHP2J3js.sanitizeUrl.call(void 0, attrs.href)
+          attrs.href === void 0 ? void 0 : _chunkK2UGEIT6js.sanitizeUrl.call(void 0, attrs.href)
         );
         this.syncOptionalAttribute(el, "target", attrs.target);
       }
@@ -5489,7 +5523,7 @@ var Scene = (_class7 = class _Scene {
    * Export the current scene state to a lightweight, flat SVG XML string.
    */
   toSVG() {
-    const renderer = new (0, _chunkKHGHP2J3js.SVGRenderer)(this.width, this.height);
+    const renderer = new (0, _chunkK2UGEIT6js.SVGRenderer)(this.width, this.height);
     this.render(renderer, 0, 0);
     return renderer.toXMLString();
   }
@@ -6550,8 +6584,11 @@ var DOMPortalEntity = (_class11 = class extends _chunkZ3HFY75Rjs.Entity {
 }, _class11);
 
 // src/index.ts
-Scene.registerWebGLPointRendererCreator(_chunkKHGHP2J3js.createWebGLPointRenderer);
-Scene.registerWebGPUParticleSystemManager(_chunkKHGHP2J3js.WebGPUParticleSystemManager);
+Scene.registerWebGLPointRendererCreator(_chunkK2UGEIT6js.createWebGLPointRenderer);
+Scene.registerWebGPUParticleSystemManager(_chunkK2UGEIT6js.WebGPUParticleSystemManager);
+
+
+
 
 
 
@@ -6592,4 +6629,4 @@ Scene.registerWebGPUParticleSystemManager(_chunkKHGHP2J3js.WebGPUParticleSystemM
 
 
 
-exports.CanvasRenderer = _chunkKHGHP2J3js.CanvasRenderer; exports.Circle = Circle; exports.ComputeParticleEntity = ComputeParticleEntity; exports.DOMPortalEntity = DOMPortalEntity; exports.Entity = _chunkZ3HFY75Rjs.Entity; exports.GlyphRasterAtlas = _chunkKHGHP2J3js.GlyphRasterAtlas; exports.GridTextEntity = GridTextEntity; exports.Group = Group; exports.MSDFTextEntity = _chunkZ3HFY75Rjs.MSDFTextEntity; exports.PARTICLE_OFFSET_LIFE = PARTICLE_OFFSET_LIFE; exports.PARTICLE_OFFSET_ORIGIN_X = PARTICLE_OFFSET_ORIGIN_X; exports.PARTICLE_OFFSET_ORIGIN_Y = PARTICLE_OFFSET_ORIGIN_Y; exports.PARTICLE_OFFSET_POSITION_X = PARTICLE_OFFSET_POSITION_X; exports.PARTICLE_OFFSET_POSITION_Y = PARTICLE_OFFSET_POSITION_Y; exports.PARTICLE_OFFSET_SIZE = PARTICLE_OFFSET_SIZE; exports.PARTICLE_OFFSET_VELOCITY_X = PARTICLE_OFFSET_VELOCITY_X; exports.PARTICLE_OFFSET_VELOCITY_Y = PARTICLE_OFFSET_VELOCITY_Y; exports.PARTICLE_STRIDE_FLOATS = PARTICLE_STRIDE_FLOATS; exports.REDUCED_MOTION_FPS = REDUCED_MOTION_FPS; exports.Rect = Rect; exports.SCENE_OPTION_KEYS = SCENE_OPTION_KEYS; exports.SVGEntity = _chunkZ3HFY75Rjs.SVGEntity; exports.SVGRenderer = _chunkKHGHP2J3js.SVGRenderer; exports.Scene = Scene; exports.SplineEntity = SplineEntity; exports.TextEntity = TextEntity; exports.TextRasterCache = _chunkKHGHP2J3js.TextRasterCache; exports.VECTO_USER_TIMING = VECTO_USER_TIMING; exports.VectoJSEvent = _chunkZ3HFY75Rjs.VectoJSEvent; exports.WebGPUParticleSystemManager = _chunkKHGHP2J3js.WebGPUParticleSystemManager; exports.beginVectoUserTiming = beginVectoUserTiming; exports.createWebGLPointRenderer = _chunkKHGHP2J3js.createWebGLPointRenderer; exports.endVectoUserTiming = endVectoUserTiming; exports.isSafeUrl = _chunkKHGHP2J3js.isSafeUrl; exports.loadSpline = loadSpline; exports.measureVectoUserTiming = measureVectoUserTiming; exports.parseColorToRGBA = _chunkKHGHP2J3js.parseColorToRGBA; exports.polySegmentToBezier = polySegmentToBezier; exports.sanitizeUrl = _chunkKHGHP2J3js.sanitizeUrl;
+exports.CanvasRenderer = _chunkK2UGEIT6js.CanvasRenderer; exports.Circle = Circle; exports.ComputeParticleEntity = ComputeParticleEntity; exports.DOMPortalEntity = DOMPortalEntity; exports.Entity = _chunkZ3HFY75Rjs.Entity; exports.GlyphRasterAtlas = _chunkK2UGEIT6js.GlyphRasterAtlas; exports.GridTextEntity = GridTextEntity; exports.Group = Group; exports.MSDFTextEntity = _chunkZ3HFY75Rjs.MSDFTextEntity; exports.PARTICLE_OFFSET_LIFE = PARTICLE_OFFSET_LIFE; exports.PARTICLE_OFFSET_ORIGIN_X = PARTICLE_OFFSET_ORIGIN_X; exports.PARTICLE_OFFSET_ORIGIN_Y = PARTICLE_OFFSET_ORIGIN_Y; exports.PARTICLE_OFFSET_POSITION_X = PARTICLE_OFFSET_POSITION_X; exports.PARTICLE_OFFSET_POSITION_Y = PARTICLE_OFFSET_POSITION_Y; exports.PARTICLE_OFFSET_SIZE = PARTICLE_OFFSET_SIZE; exports.PARTICLE_OFFSET_VELOCITY_X = PARTICLE_OFFSET_VELOCITY_X; exports.PARTICLE_OFFSET_VELOCITY_Y = PARTICLE_OFFSET_VELOCITY_Y; exports.PARTICLE_STRIDE_FLOATS = PARTICLE_STRIDE_FLOATS; exports.REDUCED_MOTION_FPS = REDUCED_MOTION_FPS; exports.Rect = Rect; exports.SCENE_OPTION_KEYS = SCENE_OPTION_KEYS; exports.SVGEntity = _chunkZ3HFY75Rjs.SVGEntity; exports.SVGRenderer = _chunkK2UGEIT6js.SVGRenderer; exports.Scene = Scene; exports.SplineEntity = SplineEntity; exports.TextEntity = TextEntity; exports.TextRasterCache = _chunkK2UGEIT6js.TextRasterCache; exports.VECTO_USER_TIMING = VECTO_USER_TIMING; exports.VectoJSEvent = _chunkZ3HFY75Rjs.VectoJSEvent; exports.WebGPUParticleSystemManager = _chunkK2UGEIT6js.WebGPUParticleSystemManager; exports.beginVectoUserTiming = beginVectoUserTiming; exports.createWebGLPointRenderer = _chunkK2UGEIT6js.createWebGLPointRenderer; exports.endVectoUserTiming = endVectoUserTiming; exports.installRendererDevTraps = _chunkK2UGEIT6js.installRendererDevTraps; exports.isRendererDevMode = _chunkK2UGEIT6js.isRendererDevMode; exports.isSafeUrl = _chunkK2UGEIT6js.isSafeUrl; exports.loadSpline = loadSpline; exports.measureVectoUserTiming = measureVectoUserTiming; exports.parseColorToRGBA = _chunkK2UGEIT6js.parseColorToRGBA; exports.polySegmentToBezier = polySegmentToBezier; exports.sanitizeUrl = _chunkK2UGEIT6js.sanitizeUrl; exports.setRendererDevMode = _chunkK2UGEIT6js.setRendererDevMode;

package/dist/index.mjs

@@ -5,10 +5,13 @@ import {
   TextRasterCache,
   WebGPUParticleSystemManager,
   createWebGLPointRenderer,
+  installRendererDevTraps,
+  isRendererDevMode,
   isSafeUrl,
   parseColorToRGBA,
-  sanitizeUrl
-} from "./chunk-I4WQY7CJ.mjs";
+  sanitizeUrl,
+  setRendererDevMode
+} from "./chunk-TI5EMJGL.mjs";
 import {
   Entity,
   MSDFTextEntity,
@@ -2839,10 +2842,26 @@ var Scene = class _Scene {
   //
   // Checks run once every ~120 frames (~2s at 60fps) to keep overhead
   // negligible even when dev mode is on.
-  /** Toggle development-mode runtime warnings globally. */
-  static devMode = false;
+  static _devMode = false;
+  /**
+   * Toggle development-mode runtime warnings globally.
+   *
+   * An accessor rather than a plain field so the renderer layer learns about it
+   * immediately: renderers cannot import `Scene` (the dependency runs
+   * `Scene → renderer`), and their diagnostics are installed per instance at
+   * construction. A plain field would only reach them the next time a `Scene`
+   * happened to be built, which made a directly-constructed `CanvasRenderer`
+   * silently untrapped.
+   */
+  static get devMode() {
+    return _Scene._devMode;
+  }
+  static set devMode(active) {
+    _Scene._devMode = active;
+    setRendererDevMode(active);
+  }
   static _devModeDetected() {
-    if (_Scene.devMode) return true;
+    if (_Scene._devMode) return true;
     const gp = typeof globalThis !== "undefined" ? globalThis : void 0;
     if (gp?.__DEV__) return true;
     if (gp?.process?.env?.NODE_ENV === "development") return true;
@@ -2951,6 +2970,7 @@ var Scene = class _Scene {
     this.readingDirection = options.readingDirection ?? "ltr";
     this.renderMode = options.renderMode ?? "always";
     this._devActive = _Scene._devModeDetected();
+    setRendererDevMode(this._devActive);
     this._warnUnknownOptions(options);
     this.reducedMotionQuery = typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)") : null;
     if (typeof window !== "undefined" && typeof window.matchMedia === "function") {
@@ -3619,10 +3639,24 @@ var Scene = class _Scene {
    * resume when it returns — instead of running the full update/render every
    * frame for a scene nobody can see. No-op (stays "on screen") where
    * `IntersectionObserver` is unavailable, so SSR/jsdom behavior is unchanged.
+   *
+   * Also a no-op for a canvas that is not in the document. An offscreen canvas
+   * used purely as a texture source — `@vectojs/three`'s `ThreeAdapter` wraps
+   * one in a `CanvasTexture`, and the same pattern shows up in any
+   * render-to-texture setup — is never appended anywhere, and an
+   * `IntersectionObserver` reports a detached element as not intersecting.
+   * Observing it would therefore set `_canvasOnScreen = false` on the first
+   * callback, and since {@link loop} returns without rescheduling in that
+   * state, the loop would stop permanently: the only resume path is an
+   * `isIntersecting` transition, which a detached element can never produce.
+   * Such a canvas is always "visible" as far as this scene is concerned,
+   * because whether its output is seen depends on the consumer sampling the
+   * texture, which this scene cannot observe.
    */
   watchCanvasVisibility() {
     if (this._canvasObserver || typeof IntersectionObserver === "undefined") return;
     if (!this.canvas || typeof this.canvas.getBoundingClientRect !== "function") return;
+    if (this.canvas.isConnected === false) return;
     this._canvasObserver = new IntersectionObserver((entries) => {
       const entry = entries[entries.length - 1];
       if (!entry) return;
@@ -6585,10 +6619,13 @@ export {
   beginVectoUserTiming,
   createWebGLPointRenderer,
   endVectoUserTiming,
+  installRendererDevTraps,
+  isRendererDevMode,
   isSafeUrl,
   loadSpline,
   measureVectoUserTiming,
   parseColorToRGBA,
   polySegmentToBezier,
-  sanitizeUrl
+  sanitizeUrl,
+  setRendererDevMode
 };

package/dist/renderer/IRenderer.d.ts

@@ -299,3 +299,25 @@ export interface IRenderer {
      */
     onContextRestored?(cb: () => void): void;
 }
+/**
+ * Publish dev-mode state to the renderer layer. Called by `Scene`; also usable
+ * directly when a renderer is constructed without one.
+ */
+export declare function setRendererDevMode(active: boolean): void;
+/** Whether renderer dev diagnostics are currently enabled. */
+export declare function isRendererDevMode(): boolean;
+/**
+ * Install dev-mode-only accessors that warn when Canvas2D style *properties* are
+ * assigned on a renderer instead of calling the corresponding method.
+ *
+ * Call once per renderer instance, from its constructor. No-ops outside dev
+ * mode, so the accessors never exist in production.
+ * Each trapped property warns on its **first** write only — a per-frame
+ * assignment would otherwise flood the console at 240fps — and then stores and
+ * returns the value like a plain field, so a warned write is never a hard break
+ * for code that assigns and reads back.
+ *
+ * Skips any property the instance genuinely defines, so a backend that really
+ * does expose one keeps its own behavior.
+ */
+export declare function installRendererDevTraps(renderer: object, label: string): void;

package/dist/renderer.js

@@ -7,13 +7,19 @@
 
 
 
-var _chunkKHGHP2J3js = require('./chunk-KHGHP2J3.js');
 
 
 
+var _chunkK2UGEIT6js = require('./chunk-K2UGEIT6.js');
 
 
 
 
 
-exports.CanvasRenderer = _chunkKHGHP2J3js.CanvasRenderer; exports.GlyphRasterAtlas = _chunkKHGHP2J3js.GlyphRasterAtlas; exports.SVGRenderer = _chunkKHGHP2J3js.SVGRenderer; exports.TextRasterCache = _chunkKHGHP2J3js.TextRasterCache; exports.WebGPUParticleSystemManager = _chunkKHGHP2J3js.WebGPUParticleSystemManager; exports.createWebGLPointRenderer = _chunkKHGHP2J3js.createWebGLPointRenderer; exports.parseColorToRGBA = _chunkKHGHP2J3js.parseColorToRGBA;
+
+
+
+
+
+
+exports.CanvasRenderer = _chunkK2UGEIT6js.CanvasRenderer; exports.GlyphRasterAtlas = _chunkK2UGEIT6js.GlyphRasterAtlas; exports.SVGRenderer = _chunkK2UGEIT6js.SVGRenderer; exports.TextRasterCache = _chunkK2UGEIT6js.TextRasterCache; exports.WebGPUParticleSystemManager = _chunkK2UGEIT6js.WebGPUParticleSystemManager; exports.createWebGLPointRenderer = _chunkK2UGEIT6js.createWebGLPointRenderer; exports.installRendererDevTraps = _chunkK2UGEIT6js.installRendererDevTraps; exports.isRendererDevMode = _chunkK2UGEIT6js.isRendererDevMode; exports.parseColorToRGBA = _chunkK2UGEIT6js.parseColorToRGBA; exports.setRendererDevMode = _chunkK2UGEIT6js.setRendererDevMode;

package/dist/renderer.mjs

@@ -5,8 +5,11 @@ import {
   TextRasterCache,
   WebGPUParticleSystemManager,
   createWebGLPointRenderer,
-  parseColorToRGBA
-} from "./chunk-I4WQY7CJ.mjs";
+  installRendererDevTraps,
+  isRendererDevMode,
+  parseColorToRGBA,
+  setRendererDevMode
+} from "./chunk-TI5EMJGL.mjs";
 export {
   CanvasRenderer,
   GlyphRasterAtlas,
@@ -14,5 +17,8 @@ export {
   TextRasterCache,
   WebGPUParticleSystemManager,
   createWebGLPointRenderer,
-  parseColorToRGBA
+  installRendererDevTraps,
+  isRendererDevMode,
+  parseColorToRGBA,
+  setRendererDevMode
 };

package/dist/tree/Scene.d.ts

@@ -979,8 +979,19 @@ export declare class Scene {
     private pointerEventTarget;
     private hasWarnedZeroSize;
     private fontLoadHandler;
-    /** Toggle development-mode runtime warnings globally. */
-    static devMode: boolean;
+    private static _devMode;
+    /**
+     * Toggle development-mode runtime warnings globally.
+     *
+     * An accessor rather than a plain field so the renderer layer learns about it
+     * immediately: renderers cannot import `Scene` (the dependency runs
+     * `Scene → renderer`), and their diagnostics are installed per instance at
+     * construction. A plain field would only reach them the next time a `Scene`
+     * happened to be built, which made a directly-constructed `CanvasRenderer`
+     * silently untrapped.
+     */
+    static get devMode(): boolean;
+    static set devMode(active: boolean);
     private static _devModeDetected;
     private _devActive;
     private _devFrameCount;
@@ -1157,6 +1168,19 @@ export declare class Scene {
      * resume when it returns — instead of running the full update/render every
      * frame for a scene nobody can see. No-op (stays "on screen") where
      * `IntersectionObserver` is unavailable, so SSR/jsdom behavior is unchanged.
+     *
+     * Also a no-op for a canvas that is not in the document. An offscreen canvas
+     * used purely as a texture source — `@vectojs/three`'s `ThreeAdapter` wraps
+     * one in a `CanvasTexture`, and the same pattern shows up in any
+     * render-to-texture setup — is never appended anywhere, and an
+     * `IntersectionObserver` reports a detached element as not intersecting.
+     * Observing it would therefore set `_canvasOnScreen = false` on the first
+     * callback, and since {@link loop} returns without rescheduling in that
+     * state, the loop would stop permanently: the only resume path is an
+     * `isIntersecting` transition, which a detached element can never produce.
+     * Such a canvas is always "visible" as far as this scene is concerned,
+     * because whether its output is seen depends on the consumer sampling the
+     * texture, which this scene cannot observe.
      */
     private watchCanvasVisibility;
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vectojs/core",
-  "version": "1.26.0",
+  "version": "1.27.1",
   "publishConfig": {
     "access": "public"
   },